Language selection

Search

Canada.ca theme

The page templates and design patterns below comprise a reference implementation of the Canada.ca design system, including the mandatory requirement of the Content and Information Architecture (C&IA) Specification. Government of Canada departments and agencies can contribute additional patterns and templates via GCWeb github repository.

This current implementation reference match the version 2.0 of the C&IA Specification released on January 2019.

Found an C&IA implementation issue or you want to contribute at their development, let us know by submiting GCweb issue, sending pull request or by participating at one of our WET-BOEW weekly Tuesday code sprint.

Meaning of statuses
Up to spec
Meet the latest published C&IA specification.
Stable
Meet the latest published specification.
Informational
It's for your information. It's complete and suggestive but not defined by and from a specification yet.
Need to revalidate
Was meeting the preceding published specification, but it need to be manually revalidated to ensure it continues to meet the latest published specification.
Partial
Partially up to spec or partially stable in order to meet other core web standards such WCAG 2.0 Level AA.
Outdated
Don't meet the latest specification but met a previous version. It requires updates.
Backlog
Need to be developped.
Incomplete
Incomplete because it don't fully meet all the specification yet. Still need developpement work.
Deprecated
Do not use because it's deprecated, but listed here for your information.

Templates and common design patterns

Working example Last update Category Description Status Specification Version
Splash page Templates The initial landing page for a visitor to Canada.ca, allowing the option to enter the site in French or English Need to revalidate C&IA v1.4
Home page Templates/Home Shows the Government of Canada's most visited and important products and services Up to spec C&IA v2.0
Theme page Templates Theme page types and templates are user-tested pages which provide access to topics and destination pages that support task completion. Need to revalidate C&IA v1.4
Topic page Templates Topic pages help people learn everything the Government of Canada is doing in relation to a specific topic area. Need to revalidate C&IA v1.4
Departments and agencies page Templates Provides links to all federal government institutions Need to revalidate C&IA v1.4
Institutional profile page Templates/Profile pages An institutional profile page represents the landing page for a Government of Canada institution on Canada.ca. Need to revalidate C&IA v1.4
Institutional profile page for arm’s-length institutions Templates/Profile pages An institutional profile page represents the landing page for a Government of Canada institution that meet the criteria for Arm’s Length on Canada.ca. Need to revalidate C&IA v1.4
Organizational profile page Templates/Profile pages Single landing page on Canada.ca for an organization that is associated with a Government of Canada institution. Need to revalidate C&IA v1.4
Organizational profile page for arm's-length institutions Templates/Profile pages An organizational profile page represents the single landing page on Canada.ca for an organization that meet the arm’s-length criteria. Need to revalidate C&IA v1.4
Partnering and collaborative arrangement profile page Templates A partnering/collaborative arrangement profile page represents the single landing page on Canada.ca for an entity that is associated with 1 or more Government of Canada institutions. Backlog C&IA
Service initiation page Templates/Service initiation pages Focus on helping Canada.ca visitors start a task. Need to revalidate C&IA v1.4
Service initiation page: single step only Templates/Service initiation pages Focus on helping Canada.ca visitors start a single step only task. Need to revalidate C&IA v1.4
Institutional service performance reporting page Templates Institutional service performance reporting pages collect all service standards from an institution and provide annual performance reporting information, as per the requirements of the Policy on Service. Need to revalidate C&IA v1.4
Program description page Templates A program description page provides information about an internal administrative activity that delivers a service. Backlog C&IA
Ministerial profile page Templates A ministerial profile page is the landing page for a minister in the Government of Canada, which includes biographical information along with links to initiatives and recent activities related to the minister. Need to revalidate C&IA v1.4
Consultation profile page Templates Consultation profile pages provide access to Government of Canada consultations and engagement activities. Backlog C&IA
Act profile page Templates/Laws and regulations pages Provides access to Government of Canada acts. Need to revalidate C&IA v1.4
Regulation profile page Templates/Laws and regulations pages Provides access to Government of Canada regulations. Need to revalidate C&IA v1.4
Guidance on legislation profile page Templates Guidance on legislation provides information to facilitate awareness, understanding, and compliance with statutory and regulatory requirements and may also describe their administration. Guidance on legislation does not establish new requirements and is not legally binding. Backlog C&IA
Government-wide audience page Templates Gives access to information and services relevant to a government-wide audience. Need to revalidate C&IA v1.4
News landing page Templates/News pages Landing page for displaying News. Need to revalidate C&IA v1.4
News results page Templates/News pages Search result pages when searching for news. Backlog C&IA
News product page Templates/News pages Single news page template Backlog C&IA
Campaign page - Example 1 Templates/Campaign pages Campaign pages are time-limited, promotional pages that respond to the Government of Canada's desire to communicate, educate, influence, market, raise awareness and call to action. Need to revalidate C&IA v1.4
Campaign page - Example 2 Templates/Campaign pages Informational ESDC v1.1
Promotional events page Templates A promotional events page is a destination page that describes and explains an official government-hosted event that occurs in a promotional context, such as a festival, a celebration and an awards ceremony. Need to revalidate C&IA v1.4
Contact us page Templates Institutional contact page Need to revalidate C&IA v1.4
Search page Templates Provides the template for the search engine on Canada.ca Backlog C&IA
Short index page Templates/Index Addresses lists of 10 to 50 items in length. Backlog C&IA
Long index page Templates/Index Lists that have over 50 items, requiring 3 or more screen-lengths of scrolling. Incomplete C&IA v1.5
Finder page Templates/Index Common design template for filtering a large set of pages, documents or data with shared characteristics. Backlog C&IA
Faceted finder page Templates/Index Lists of over 100 items and for Canada.ca collections Backlog C&IA
Content page Templates Generic destination pages Up to spec C&IA v2.0
Content page - Limited width content Templates Generic destination pages Up to spec C&IA v2.0
Content page - GCWeb 4.0.29 font style Transitionary to C&IA v1.5+ Force a page or a section of a page to use the GCWeb 4.0.29 font style. Informational
Archived page Templates Archived page Informational
Content page - Signed Off Templates Signed Off/On Informational
Content page - Signed On Templates Signed Off/On Informational
Feedback form Templates Feedback form Informational
Server message page Templates Server message page Informational
Server message page - English/French Templates Server message page Informational
404 error page Templates 404 error page Informational
404 error page - English/French Templates 404 error page Informational
Search results page Templates/Search For search results from across the Government of Canada. Stable Search template specification v2.0
Contextual search results page Templates/Search For search results that are filtered to a search context. Stable Search template specification v2.0
Search facets/filters results Templates/Search For search results that are accompanied by faceted filter boxes. Partial Search template specification v2.0
Starting page for search Templates/Search For search results that are accompanied by faceted filter boxes. Backlog Search template specification v2.0
Advanced search page Templates/Search For search results that are accompanied by faceted filter boxes. Backlog Search template specification v2.0
Global header navigation Header, footer, navigation The top tasks from all Government of Canada websites are organized into topics and then grouped into the 15 main themes of Canada.ca, represented in the header. Backlog C&IA
Other header elements Header, footer, navigation In addition to the global navigation menu, the header includes additional branding and functional elements. Backlog C&IA
Main content footer Header, footer, navigation The main content footer appears after the main content of the page, and above the global site footer. Backlog C&IA
Global footer navigation Header, footer, navigation The global (site-wide) footer at the bottom of each web page contains links to Government of Canada corporate content, and to Government of Canada content repositories. Backlog C&IA
Reduced header and footer Header, footer, navigation Provides flexibility for specific situations in which full application of the global header and footer impede task success, while maintaining overall consistency in the experience Backlog C&IA
Transactional scenarios Header, footer, navigation Pages where people are engaged in a transactional process. Backlog C&IA
In-page table of contents 2018-03-02 Header, footer, navigation/In-page navigation List of links that lead to subsections of the same page. Need to revalidate C&IA v1.4
Ordered multi-page navigation (step-by-step) Header, footer, navigation/In-page navigation Group of several pages intended to be read in a preferred order. Backlog C&IA
Tabbed interface Header, footer, navigation/In-page navigation Separates related content into different panes that are viewable one at a time when the respective tab is clicked. Backlog C&IA
Buttons (WET alternative) Common design patterns Use to encourage a person to take action
  • Informational
  • Backlog
C&IA
Carousels (WET alternative) Common design patterns Use to promote multiple different activities, initiatives, programs, and services
  • Informational
  • Backlog
C&IA
Charts and graphs (WET alternative) Common design patterns Use as visualization techniques for communicating data or statistics
  • Informational
  • Backlog
C&IA
Collapsible content (WET alternative) Common design patterns Use to hide secondary content until requested.
  • Informational
  • Backlog
C&IA
Contact information (GCWeb alternative) Common design patterns Use to present contact information on Canada.ca page
  • Informational
  • Backlog
C&IA
Context-specific features Common design patterns Use to promote activities, initiatives, programs, and services Need to revalidate C&IA v1.5
Contextual alerts (WET alternative) Common design patterns Use to present important new information that needs to appear in a pre-existing context
  • Informational
  • Backlog
C&IA
Contributors Common design patterns Use to link to institutions or organizations that support the content on the page Backlog C&IA
Data tables (WET alternative) Common design patterns Use to communicate data
  • Informational
  • Backlog
C&IA
Disclaimer overlay (WET alternative) Common design patterns Use to display privacy statements and similar forms of disclaimer
  • Informational
  • Backlog
C&IA
Download links Common design patterns Use to reference and link to non-HTML files Need to revalidate C&IA v1.4
Icons (WET alternative) Common design patterns Use as symbols to communicate actions or states
  • Informational
  • Backlog
C&IA
Images (WET alternative) Common design patterns Use to complement or enhance text
  • Informational
  • Backlog
C&IA
Institutional byline (GCWeb alternative) Common design patterns Use to link to the institution responsible for the content
  • Informational
  • Backlog
C&IA
Interactive questions Common design patterns Use to present a sequence of simple questions that leads to answer needed to continue or complete task Backlog C&IA
Latest news (GCWeb alternative) Common design patterns Use to feature the most recent news items
  • Informational
  • Backlog
C&IA
More information for (GCWeb alternative) Common design patterns Use to connect to a related government-wide audience
  • Informational
  • Backlog
C&IA
Most requested (GCWeb alternative) Common design patterns Use to feature top tasks related to the page it is on
  • Informational
  • Backlog
C&IA
Multimedia (video and audio) Common design patterns Use to complement or enhance text Need to revalidate C&IA v1.4
Promotional feature banner Common design patterns Use to promote government-wide and institution-specific activities, initiatives, programs, and services. Backlog C&IA
Related links Common design patterns Use to list links to content related to the page Backlog C&IA
Services and information Common design patterns Use to present sets of links with accompanying descriptions (Doormat link) Up to spec C&IA v2.0
Social media channels block (follow box) (GCWeb alternative) Common design patterns Use to allow people to follow official Government of Canada social media accounts from various social media platforms
  • Informational
  • Backlog
C&IA
Social media feeds widget Common design patterns Use to embed the latest posts from official Government of Canada social media accounts Need to be revalidate C&IA v1.4
What we are doing (GCWeb alternative) Common design patterns Use to link to content that provides background or explanations of GC activities in support of creating or improving public policy
  • Informational
  • Backlog
C&IA

Themes plugins

Notes and other resource

Evaluation and report

Report a problem on this page
Please select all that apply:

Thank you for your help!

You will not receive a reply. For enquiries, please contact us.

Date modified: