Links – GCWeb design system

A link (or hyperlink) is a word, phrase or image on a web page that people select to move to another part of the same content or to access an entirely different web resource (such as a web page, video or downloadable file).

On this page

Use links strategically

Links guide people to the information they are looking for. Use links to avoid repeating information that is already clearly expressed on another web page or to reference related information, such as definitions, supporting information or background information.

Be strategic about how you place and create links on a web page and about how many links you provide:

Make sure link name represents the destination content

Link text should represent the destination content a person will find once they select it. Not doing so can confuse and frustrate the user. For accessibility, the purpose of each link (English only) must be determined from the link text alone or from the link text together with its programmatically determined link context (English only). Also, let people know if the link content must be downloaded to view the content.

Make sure the link text both:

Use

Do not use

Example: Making sure link names represent the destination content

Write:

In Québec, you are the legal representative if you are registered as the liquidator of the estate and may have additional administrative duties. Visit Revenu Québec's steps to follow after a death for this information.

Don’t write:

In Québec, you are the legal representative if you are registered as the liquidator of the estate and may have additional administrative duties. Click here for more information.

Write:

If you file your tax return after the due date and have a balance owing, you will be charged a late-filing penalty. Filing late may also cause delays to your benefit and credit payments.

Don’t write:

If you file your tax return after the Filing due date for the 2022 tax return and have a balance owing, you will be charged a late-filing penalty. Filing late may also cause delays to your benefit and credit payments.

Check that links work

Make sure your links work. Links that don’t work frustrate people and hurt the credibility of your content. Check that they take people to the correct page and are in the appropriate official language.

For pages you create, check links regularly to make sure they still work and update any broken links.

Capitalize links correctly

For a standalone link, capitalize the first letter of the first word, then write using sentence case.

Use lower case for a link in a sentence, unless the link contains a proper name.

When linking to published works like books or journals, use the same capitalization as the work.

When writing hashtags for social media, capitalize each word within the hashtag.

How to link to various types of content

Linking to internal-to-government content

In most cases, public-facing content should not link to content that is accessible only through internal government networks. Occasionally, the audience for content that is accessible to the public may be primarily internal.

When a link leads to content available only on internal government networks, write (accessible only on the Government of Canada network) after the link.

Example: Linking to internal-to-government content

Managers and Human Resources professionals can find helpful information, tips, and strategies to recruit and hire persons with disabilities using the Hiring Person with Disabilities Toolkit (accessible only on the Government of Canada network).

Linking to external content not available in both official languages

Some non-government external web content isn't available in both official languages. If you're linking to external web content that isn't available in the language of the current page, write what language it is available in after the link.

Example: Linking to external content available only in French

For passport renewals for French citizens, refer to Renew your French passport while abroad in Canada (French only).

Opening links in the same tab or a new tab

Your links should open in the same tab, unless doing so would interrupt the task the user is trying to complete. Opening in the same tab lets users use the “back button” to return to the previous page and helps people with visual disabilities, cognitive limitations, and motor impairments by reducing the chance that a change of context will occur unexpectedly.

Linking to a specific location on a page

If you want your link to take people to a specific place on a page, make your link anchor to the relevant heading or subheading. To create an anchor link, first add an ID attribute to the heading tag of the link destination, then include the ID in the link’s URL.

Avoid using other methods of linking to a specific location (such as the scroll to text browser function) as these usually do not meet accessibility requirements for people using assistive technology.

Creating a link as a button

Consider turning a link into a button if you have an action you want the user to complete. For example, you have a page that introduces a new benefit. However, use buttons sparingly and do not have more than one button on a page.

For more information, refer to: Buttons

Providing links for related information

If you need to provide links to another page, form, policy or guide that isn’t part of the main task, introduce the link with a verb (a call to action) or supporting text that provides context using a colon. Depending on the context of why you are providing the link, you may need a lead-in sentence.

Examples of introductions to links:

Avoid using the word see to refer users to links. It is not a clear call to action that tells the user what they should do with the information they find at the link.

If there are multiple links, you can list links using bullet points at the point of need for your user. Do not create a page with a list of links with little or no other context.

For cases where you want to provide a list of resources or a reference for a task, such as technical guides, place these on the appropriate page under a specific heading.

Example: Linking to one source of related information with no lead in sentence

For details: Disability deductions and credits

Example: Linking to one source of related information with a lead in sentence

For more information about how instalments work, refer to: Paying your income tax by instalments.

Example: Listing multiple links of related information

To learn more about other government funding and assistance, review:

Example: Listing a resource at the end of a page

Resource
Information circular, IC82-6R13 Clearance Certificate

Avoid placing links mid-sentence

Mid-sentence links can be distracting. They can slow scanning because people need to stop and read text on both sides of the text. If your sentence needs a link to provide a definition or information on another page, try to place the link at the end of the sentence.

Example: Linking at the end of a sentence

An SR&ED project starts when you identify the need for a scientific or technological advancement that overcomes a scientific or technological uncertainty.

Placing rescue links below page titles

In some cases, users end up on a page that risks being the wrong one (for example, users may confuse "pay arrangements" and "instalments").

Place rescue links when there is a good chance the user may land on a page, likely via search results, and that page could compete with other similar pages.

Make sure rescue links:

Example: Adding a rescue link to the top of a page

You may be looking for: Make a payment for individuals

Email addresses as links

Write e-mail addresses in full instead of embedding the link in your text.

Example: Writing an email address in full

Write:

Don’t write:

Using italics in links

If you are linking to an act or titles of publications, follow the guidelines for writing using Emphasis.

Vanity URLs

Short, easy-to-remember web addresses are called vanity URLs (or vanities). Vanity URLs are intended for promotional material and should be used sparingly. Vanity URLs are meant to be used to drive traffic to a website or certain webpage. They are often used in TV, radio and print ads.

Writing effective vanity URLs

When writing URLs for communication products, you can use either the primary URL or a vanity URL. Vanity URLs are unique and relevant to the page you’re trying to promote.

Make sure to:

How to request a CRA vanity URL

PAB's Digital Communications Team is responsible for maintaining Canada.ca vanities for CRA, as well as for making all vanity URL requests and amendments to the Principle Publisher (PP) on behalf of the Agency.

Refer to: Request a vanity URL for CRA content (only available for internal employees)

Meeting the Accessible Canada Act (ACA) requirements

The Accessible Canada Act (ACA) requires content created for the Canada Revenue Agency meets the goal of realizing a barrier-free Canada by 2040. The CRA uses the Web Content Accessibility Guidelines (WCAG) to help the CRA meet the ACA.

By following the guidance in the UCDG, your web content should meet the the following WCAG success criterion:

Design options

Modify the design

  • Default
  • As a button
  • On an image
  • Rescue links
Appearance
HTML code
<a href="#">Your link</a>
Date modified: