We have done extensive user research into how users navigate the Get Into Teaching website. From this research we learnt that users found the links on pages helpful and informative. Even where pages contained a lot of links, users told us they did not find it overwhelming.
However, there were still scenarios where we wanted users to be drawn towards one link more than another. For example, where one link was used to provide further explanation whereas the other was the next step in the user's journey.
During a round of user research specifically on navigation components, we tested a green arrow call to action (CTA), that highlighted the link and made it more prominent.
Candidates found the green arrow CTA to be powerful and that they would select this first because they felt the links were more “important” and “inviting”.
We first used the green arrow CTA as part of the routes wizard, to make it clear where users had to go next to find information relevant to them.
We wanted to use the green arrow CTA on the rest of the website too. To ensure the arrow was used consistently across the site, we developed logic for using it.
The green arrow CTA can be used:
- when it's the next logical step on users' journeys
- more than once on a page
The component should not be used:
- on every page, if there is not a suitable use for it
- to direct to pages that are not useful for most people
- to direct to external sites
To use the component, we specify it in the front matter of the webpage. For example, on a html page we’d use the following code:
cta_arrow_link:
events:
link_target: "/events/about-get-into-teaching-events"
link_text: "Find a Get Into Teaching event"
