Links, Buttons and Navigation

Links

Use meaningful descriptive links when you can. Links should provide information on the associated action or destination. Try to avoid “click here” or “learn more.” and “read more”. If you use them make sure the surrounded text provides the right context. Ideally, you would append the link to add more context. For example: from “Learn more” to “Learn more about Bird ID”. Or, write a sentence as you normally would, and link relevant keywords. This can also help with Search Engine Optimization.
Links should not be empty
Links should be part of the same paragraph or element which contains the link context. The context is important for assistive technology.
Provide a link whenever you’re referring to something on an external website. Use links to point users to relevant content and trusted external resources.
For links that contain images, please see Images As Links.
FOR DESIGNERS AND DEVELOPERS: Links must visually appear as links. Design should have consistency of link colors and states set up.
- The hover state should communicate that links are interactive
  - hover state of links set up should also include a focus state as well, to help readers using assistive technologies and touch devices.
- They should have a distinct active and visited state.

Buttons should always contain actions. The language should be clear and concise. Capitalize every word, including articles. It’s OK to use an ampersand in button copy.

FOR DESIGNERS AND DEVELOPERS: Web users, especially users with disabilities, depend on web pages being predictable. If navigation is consistent from page to page within a website, this makes it much easier for screen reader users, screen magnification users, and others to find particular items within the navigation.
Use title case for main or global navigation.
Navigation links should be clear and concise.
- Try to avoid “click here” or “learn more.” and “read more”. If you use them make sure the surrounded text provides the right context. Ideally, you would append the link to add more context. For example: from “Learn more” to “Learn more about Bird ID”.

Sometimes a long piece of copy lends itself to a list of related links at the end. Don’t go overboard—4 is usually plenty.
Should appear in a logical order, following the step down/step up rule: The first article should be a step down in complexity from the current article. The second one should be a step up in complexity to a more advanced article.
If you can, avoid repeating links from the body text in related articles.