Links

Overview

Buttons and links help someone explore a relevant topic further, jump to a new category, or backtrack.

Design

Default

Links with icons

Usage guidelines

Use links to connect to relevant information that supports the content. Links include:

• internal or external web page
• emails
• publications
• images
• video or audio files

External links

Follow these rules when using links to a site outside of Alberta.ca:

• use an external link icon
• link to authoritative and trustworthy sites
• use anchor text correctly – link descriptive words and phrases instead of ‘click here’ or ‘learn more’

Accessibility

Format links with blue colour font and underlined.

Colours

• Default colour: #0070C4
• Hover colour: #333333
• Focus and active colours (hover state with 2 pixel outline): #FEBA35
• Visited: #756693
• Disabled: 40% transparency

Content guidelines

• Write descriptive, anchor link names with a minimum 15 characters including spaces. Generic expressions, such as ‘click here’ or ‘find out more’, provide little navigational value to someone using a screen reader.
• Use page and document titles as the link, when applicable.
• Use program emails but avoid personal emails.
• Use document titles as the links, when applicable, followed by the file size in kilobytes (KB) or rounded to the nearest decimal in megabytes (MB).
• Avoid using identical link text for different links (for example, 2 links read ‘fact sheet’, but each one links to a different URL).
• Do not link to anchor (in-page) links on other pages
• Do not include program or act acronyms in link text. Place them after the link in parentheses).
• Do not write out URLs.

Examples

• Web page title: Learn more about Enforcement programs outside Alberta
• Document title: Adult Instructor Training
• Email: [email protected]
• Act: Residential Tenancies Act (RTA)