Treasury Board of Canada, Secretariat - Government of Canada
Skip all menus Skip first menu
,  Français  Contact Us  Help  Search  Canada Site
     What's New  About Us  Policies  Documents  TBS Site
   Calendar  Links  FAQs  Presentations  Home
,
Chief Information Officer Branch
Information, Privacy and Security Policy Division
Common Look and Feel for the Internet
Accessibility
Collaborative Arrangements
Cybersquatting
E-Mail
Important Notices
Navigation and Format
 Overview
 Standard 6.1
 Standard 6.2
 Standard 6.3
 Standard 6.4
 Standard 6.5
 Standard 6.6
 Standard 6.7
 Standard 6.8
 Guidelines
Official Languages
Internet Guide
Self-Assessment Guide
Toolbox

Find Information:
by Subject [ A to Z ] by Sub-site
Versions:  
Print Version Print Version
Related Subjects:
Common Look and Feel
Design
Internet
Feedback on Website
,
,

Common Look and Feel for the Internet,


Navigation and Format Section

Overview

Electronic service delivery provides excellent opportunities for Canadians to obtain information on GoC programs and services when and where they need it. Given the enormous resources now available on-line at GoC sites, a logical and consistent system of navigation is key to improving access. Effective navigation is dependent on consistent application of standards that are both visible and invisible to the end-user. Well-designed and strategically placed menu bars give users visual cues to site navigation. Search functions help simplify the task of locating specific information. Placing all GoC sites under one domain and standardizing URLs will further enhance these elements.

Creating a 'common look and feel' for an extended family of related Web sites holds enormous challenges. The programs and services offered by GoC institutions are incredibly diverse and often serve a very specific purpose, for a very specific audience. In some cases, the purpose of a site may be strictly to provide information, in others it may facilitate delivery of a particular service. The Navigation and Format Standards and Guidelines are balanced so as to maintain an appropriate degree of consistency while giving institutions the freedom they need to develop Web pages that serve a variety of functions.

Developing a Web site is not a one-time effort: well-designed sites are continuously evolving. Revisions are prompted by user feedback, better understanding of usage patterns, clearer focus of communications objectives, development of new material, modifications to existing documentation, and new interactive options. In the same way, CLF Standards and Guidelines will continuously evolve.

Top of Page

Web-site design

The site must be designed and developed from a user's point of view and testing is a necessary part of the process. Coherent presentation of content is intrinsically linked to layout, typography, graphic standards, the use of symbols and measurement specifications that can be applied to all GoC Web pages, regardless of their function, to establish a standard framework.

Minimalism is a good practice in designing Web sites. Graphic files should be as small as possible to facilitate rapid delivery via any end-user technology and should include text equivalents to ensure all users can obtain a description of what the graphic contains and what purpose it serves. Users should be warned of large file sizes and non-standard formats, i.e., wider than 640 pixels. Navigational aids, such as buttons and links, should be well-designed and easy to use.

No specific procedural standard or guideline could adequately cover the use of imagery, but it is recommended that GoC Web sites minimize non-essential visual information. Where visual images are used, they must be accompanied by appropriate ALT Text tags to ensure that all users are provided with information about what the images represent and can identify the target (or destination) of images that act as links.

GoC institutions are free to use Web and multimedia technologies to enhance sites, on the condition that all elements are universally accessible. Web developers and content providers can maintain alternate versions of sites that offer demonstrations of advanced technologies, alternate formats or interactive multimedia components. These must be presented as secondary sites and must incorporate appropriate hyperlinks if users are expected to download software or plug-ins to operate multimedia components.

Top of Page

Imagery

Well-designed and carefully placed images can improve the visual appeal and information content of Web sites. However, the time it takes to display large images may drive users away from the site. Many users choose to turn off their display options; others, including individuals with certain disabilities or those with non-graphical browsers, can not view images at any time. Therefore, imagery should be kept to a minimum on GoC Web pages. In addition, all images (graphics, photographs, icons, etc.) should be accompanied by descriptive text equivalents to ensure all users can obtain the same information. It is critical to indicate when images act as links to other Web pages of the site or to other sites. Web developers may choose to use thumbnail images as a link to enable users to view larger versions, and should include information regarding the file size and format.

Top of Page

Animated or Scrolling Images and Text

Various simple mechanisms can be used to add an element of motion to either text or graphics, thereby enhancing the look, adding a degree of entertainment, or serving some other legitimate purpose within the context of a particular Web site. The World Wide Web Consortium (W3C) Web Content Accessibility Guidelines do not ban the use of animated or scrolling images and text, but do provide specific instructions on how they can be implemented without having a negative impact on accessibility. When used, these elements should not self-activate; rather, they should be user-controlled, meaning both activation and deactivation are dependent upon specific requests from the user. In addition, text equivalents must be provided via ALT text or LONGDESC tags. If there is any doubt as to the value of an animated or scrolling text or image, it should be removed from the site.

Top of Page

Text Elements

Like visual elements, Web site texts should be simple and concise. Content should fit within one or two screens, since users are reluctant to scroll endlessly through documents. All information must also be accessible in a text-only format. Font sizes are limited to a single size for headers, and a single size for body text. Hierarchical distinctions can then be made using other font features such as bold and italic. Users should be warned of large file sizes and non-standard formats. Developers should structure information so that it is relatively easy to update.

Top of Page

Typography

Typography choices can enhance or detract from the overall visual appeal of a site. Although user display preferences in individual browsers have ultimate control over text presentation and fonts are displayed as coded only when browsers are set to the default preference, there are benefits to be gained through consistent font presentation.

Top of Page

Layout

Web page layout is an integral part of Common Look and Feel. Some common styles of Web page design create barriers for individuals using assistive devices and non-graphical technologies. Such barriers to accessibility can be avoided through thoughtful Web page design in accordance with CLF and W3C guidelines.

Accessibility is not the only issue with respect to layout. Beyond the common menu bars and FIP identification, a common approach to organizing site content plays a major role in visually unifying the thousands of government Web sites. The simple fixed columnar arrangement provides for third level navigation requirements, creative themes, and a body text line-length that is easy to read on-screen. This layout anchors, in fixed space, the graphic elements which identify the site as a government site and ensures that the consistent presentation of the site content works together with the mandatory graphic elements. See FIP Toolbox for specifications.

It is the responsibility of individual Web developers with the Government of Canada to ensure Web sites are designed to be universally accessible. Information on how to use tables effectively for the layout of images or data presentation is provided from the World Wide Web Consortium Web site.

Standards 7.1, 7.2 and 7.3 have both Navigation and Format and Official Languages implications.


Standard 6.1

All GoC Web pages must include the common menu bar, placed at the top of every Web page, to facilitate navigation through and between GoC sites. The GoC menu options must appear in this order and include: Language (English / French) for bilingual sites only, Contact Us, Help, Search and Canada Site.

Version Histories


Versions Action Effective Date Authority
Version 1.0 First approved 2000-05-04 Letter to Deputy Ministers
Version 1.1 Interpretation Update 2005-09-21 Letter to Deputy Ministers

Rationale

Consistent use of a common menu facilitates navigation on GoC sites and consistently consolidates key common functions across all GoC Web sites.

,

Interpretation (Updated)

To facilitate navigation within individual GoC sites and between multiple GoC sites, a Common Menu has been developed to provide specific service enhancements. Prominently placed at the top of every GoC Web page, the buttons on the Common Menu provide direct links to crucial navigation features. The Common Menu buttons are placed such that the most critical buttons hold the most prominent positions. For example, the language choice and 'Canada Site' buttons should be placed at the left and right extremes (respectively) of the bar itself. The Common Menu bar for unilingual sites is slightly different.

The width of Government of Canada Web pages must be no less than 600 pixels. The width dimensions for page components will be as follows:

  • Header: Fixed, 600 pixels
  • Footer: Fixed, 600 pixels
  • First Column (left navigation): Fixed, 132 pixels
  • Second column (vertical white space): Fixed, 18 pixels
  • Third column (content area): Minimum column width of 450 pixels. 
    In exceptional cases where specific content (e.g. maps, large tables, charts, graphs, etc.) cannot adapt by way of wrapping or linearization to the standard 450 pixel width the content can extend to the right beyond the 450-pixel boundary. 
    When content does extend beyond the 450-pixel boundary a version suitable for printing on standard 8-1/2" x 11" (21.6 cm x 27.9 cm) paper must be provided.

The buttons in the common menu bar must have a black background with white text that is left justified and at least a 9 pixel font size. The dimensions of the buttons are 14 pixels high and 89 pixels wide with a 1 pixel space between the buttons. The common menu bar must appear on all html pages along with the other mandatory elements. See specifications.

Français
Links to the page content in the other official language: Change language scripts
Contact Us
Provides a means for users to send electronic mail or to find the information necessary to utilize other means of communication (telephone and facsimile numbers, street and post office box addresses, etc.) with the organization or delegated officials
Best Practice: Contact Us
Help
Links to page containing a site map and other assistive information such as frequently asked questions or other user information
Best Practice: http://www.ec.gc.ca/help_e.html
Search
Links to search and retrieval systems that enable users to obtain information on a particular subject in any GoC Web site: How to make your Search page accessible
Best Practice: http://www.seniors.gc.ca/searchadvanced.jsp?&font=0&userLanguage=en
Canada Site
Provides a direct link to the Government of Canada Web site

Web site vs Web document

CLF Standards are mandatory on all HTML navigation pages of GoC Web sites. In the case of downloadable versions of documents on your Web sites that are in non-HTML formats such as .doc, .rtf, .pdf, .txt, .wpd, the implementation of the menu bars is not required. However, the CLF Standards for Federal Identity, Official Languages, Important Notices, Collaborative Arrangements and Accessibility are required.

Top of Page

6.1 Best Practices

Common Menu Bar

The following are best practices to help institutions standardize the kinds of information that should be available behind each of the buttons on the Common Menu Bar.

Top of Page

English / Français Language button

Bilingual Web sites: This button provides a direct link to the page content in the other official language. Change language scripts

Unilingual Web sites: This button should read "Disclaimer" and take the user to the Unilingual Welcome page where a link to bilingual information on the department / agency is available. The Federal Identity Program Toolbox provides the specifications and guidance on building a unilingual Web site.

Multiple language Web sites: CLF Technical Working Group will provide guidance in the form of best practices on how to implement navigation of GoC content available in more than the two official languages.

Top of Page

"Contact Us" page

  • GoC sites should provide relevant contact information, including information that could accommodate those with disabilities or special needs. The contact information provided should be in the context of where a user is on the Web site. An example of contact information can be found at the Canada site Contact Us page - http://canada.gc.ca/comments/form_e.html.
  • Institutions should establish service standards or refer to existing institutional service standards. Service standards should be provided to the user up front so that they understand the process and know what to expect, i.e. response time for service delivery.
  • Ensure proper implementation of Common Look and Feel Standard 4.4 - acknowledgements.
  • Ensure proper implementation of Common Look and Feel Standard 5.4 - personal information.

Top of Page

"Help" page

  • Provide a link to the site map or an alphabetical list of products that are available on your site.
  • Provide an overview of any Accessibility features that are available on your site. e.g. Access Keys, personalization.
  • Describe what formats are available throughout your site. Please see the Help page on this Web site for more information and examples.
  • Provide a link to technical help for problems with the Web site or for users who are having problems accessing information on the Web site, i.e. link to webmaster's e-mail.
  • Provide a link to the "Contact Us" page on the Web site.
  • Provide site specific help information as well links to the institution's more general help.

Top of Page

"Search" page

  • This button should link to search and retrieval systems that enable users to obtain information on a particular subject in any GoC Web site How to create an accessible Search page.
  • Provide detailed help on how to search the information on your site with examples of how to conduct a simple and advanced search Information on how to search in other languages, and how to use other characters is encouraged when appropriate. Termium features, services and software could also be included.
  • Provide links to the other levels of searching within your institution e.g. Department or Agency.
  • Provide a link to the Canada Site AltaVista search page.

To ensure information on your site is found by users proper implementation of Common Look and Feel Standard 6.3 on metadata must be applied to html resources.

Top of Page

Canada Site button

  • Provide a direct link to the Government of Canada Web site. When your site is a GoC intranet provide a link to the GoC Publiservice Web site.
  • When linking from an English content page to the Canada Site / Publiservice Site always link to the index page of the site and never to the Splash page where the user is then forced to make their language selection again.

Standard 6.2

All GoC Web pages must incorporate an institutional menu similar in design and placement to the common menu bar. The number of buttons and choice of terminology should represent plain language descriptors of the organization's program and services. Department, Branch / Sector, Division

Rationale

Establishing a standard format and location for the primary institutional menu facilitates attainment of CLF navigation objectives and further enhances communication and identification objectives.

,

Interpretation

The institutional menu is a key feature in providing service delivery within an individual site. Each GoC site and sub-site will need to adopt terminology on the menu buttons that reflects its specific programs and services, yet some degree of standardization should be applied to enhance over CLF objectives. As it can be anticipated that some similarity in the content of institutional menus will occur from site to site, CLF suggests Web developers should consider including the following standard elements: What's New, Publications / Catalogue, Menu / Contents, Home / Previous / Next, Programs & Services, Index, Submit / Order.

The standard requires a consistent look and placement for the primary institutional menu. While institutions are free to choose the colour, number of buttons (up to 10) and content of their primary institutional menu, the size and design must match that of the Common Menu. In addition, the primary institutional menu must be placed directly below the Common Menu. The terminology used on menu buttons should be selected carefully to ensure choices are clear to end-users that may or may not understand the phrases or terminology used internally to reflect programs or services.

GoC institutions are free to develop additional secondary menu systems as required. Institutions with many Web sites or many levels of content may need this additional navigation assistance. Such secondary menus should be located in the left column of Content Pages. They may incorporate a more graphic or visually thematic approach to displaying navigation options than is used in the mandatory menu. Secondary menus should be designed with the appropriate attention to accessibility concerns and should visually complement overall Web page layout.

While the primary institutional menu should contain links to major subject areas that are institution-wide or major functions not included in the Common Menu, the secondary menu may contain links that are more content specific, such as institutional sub-sites, program and service areas, or lengthy content files.


Standard 6.3

All GoC Web sites must adopt the following five metatags as a metadata standard for description of Web resources: Title, Originator, Language of Resource, Date and Controlled Subject. Metatag Generator

Common Look and Feel Metadata Standard Definitions and HTML Examples

TBITS 39: Treasury Board Information Management Standard, Part 1: Government On-Line Metadata Standard

META Tag Generator is a tool which accepts user input and will generate HTML code according to the standard which can be pasted into an HTML page.

These five metadata elements are part of the 15 element Dublin Core Metadata Element Set, the leading international metadata standard for on-line resource discovery.

,

Rationale

Metadata is a key tool in describing and managing information assets. It is particularly important to have an effective identification system for information assets since many are invisible, hidden in Web sites or databases, until a user initiates a search to find the assets relevant to a current need. Whether we in the public service or our clients in the Canadian public are the searchers, we need an effective way to use the labels on our information assets to find them when we need them. You can see that the chair you are sitting on is a chair without looking at the bar code label, but an electronic document is invisible until its label or its text is found by a search tool.

The benefits of using a systematic way of assigning and structuring metadata include:

  • Relevance: Providing information that search engines can use to find relevant documents in large collections such as Web sites or document databases where text search alone brings up many irrelevant documents or lists of documents too long for users to look at.
  • Identity: Providing descriptive information so that users can tell how old a document is, who wrote it, or how to get additional information. Most documents on government Web sites now cannot tell the user whether they are 5 days old or 5 years old. Sometimes the user wants one, sometimes the other. Metadata helps a user know if the information is reliable and current.
  • Inventory: A list of what information the Government holds so that the information can be managed, tracked, updated, analyzed and used efficiently.
  • Consistency: The Dublin core, an international metadata standard provides the framework and many of the rules for use so that metadata can be applied consistently in large and diverse organizations such as the Government of Canada. This creates an environment in which users can search for and find information without needing to know which department produced it or to which program it relates.
  • Interoperability: An international metadata standard such as Dublin Core provides a way for information resources in electronic form to communicate their existence and their nature to other electronic applications (e.g. via HTML or XML) or search tools and to permit migration of information between applications or search systems.
  • Policy compliance: A critical component of meeting the Management of Government Information Holdings (MGIH) policy requirement to know and be able to find the information Government holds.

For more information see: Selecting and Implementing a Metadata Standard for the Government of Canada

Top of Page

Interpretation

Essentially information about information, metadata is made up of elements that define standard descriptions of information holdings. This CLF standard is based on Dublin Core and requires GoC institutions to describe Internet resources using five mandatory metatags in document headers: Title, Originator, Language of Resource, Date and Controlled Subject. Link: Common Look and Feel Metadata Standard Definitions and HTML Examples

The Canada Site includes a Web crawler that indexes departmental sites to create a searchable central index. As departments create metatags to describe their information holdings, the Web crawler will incorporate these records in the central index. The Canada Site search index will be configured to recognize Dublin Core metatags and use them in ranking and displaying results.

Top of Page

6.3 Best Practices

To complement the use of these mandatory GoC metatags, Web developers should also ensure that the HTML Title element and two HTML meta elements, Description and Keywords are specified. Authors should use the Title element to identify the contents of a document. Since users often consult documents out of context, authors should provide context-rich titles. The content of the HTML Title tag is displayed as the window header in a Web browser, in bookmarks and in search results. Common search engines may use the contents of the Keywords tag to improve the quality of search results. The contents of the Description tag may be displayed as a summary in search results. The display of these elements is limited in length by browsers and search engines.

Departments or Web sites requiring additional metadata elements should use the additional Dublin Core elements as a starting point. In accordance with the Government of Canada Metadata Framework domain specific metadata element sets may be developed with the mandatory Common Look and Feel and additional Dublin Core metadata elements at their core.

Indexing Federal Government Web Pages: Guidelines for the Development of an Indexing Policy (November 2002)

These guidelines were developed by members of the GOL Metadata working Group during the summer of 2002 and approved at the September 17, 2002 meeting. This document targets departments developing indexing policies for the population of the Common Look and Feel mandatory element <dc.subject>.

Two user-friendly web-based guides are now available on the Council of Federal Libraries' site (September 2002)

An Implementation Guide for Metadata Developers offers practical assistance to those responsible for creating metadata content for federal government Web pages in accordance with the Common Look and Feel standard. It explains the tasks to be performed, demonstrates how the required information should be created and directs readers to other resources. It also provides instructions on how and where to insert the required source codes into a Web document.
An Implementation Guide for Metadata Managers offers assistance to managers responsible for meeting the CLF metadata standard.
The guides were created by an interdepartmental, cross-disciplinary team of metadata practitioners lead by the Council of Federal Libraries' Metadata Action Team.
The guides' home page is: http://www.collectionscanada.ca/6/37/s37-4016-e.html
The Council of Federal Libraries welcomes your comments on the guides. Please send them to: nippni@nlc-bnc.ca.

How to register a controlled vocabulary or thesaurus for use in dc.subject on federal government Web sites:

Registering a Standardized Vocabulary

Top of Page

Links

Search to select subject descriptors:
Government of Canada Core Subject Thesaurus Depository Services Program (Communication Canada)

Common Look and Feel Metadata Standard Definitions and HTML Examples

Treasury Board Secretariat Information Management Resource Centre References and Resources for Metadata

Training materials for applying Dublin Core metadata


Standard 6.4 (Updated)

All Government of Canada Web pages must have a date indicator to inform visitors of the currency of the content and signal that the end of that page has been reached. All currency indicators must use the ISO standard format for all-numeric date display (YYYY-MM-DD) and use at least one of the following date labels: "Date published:", "Date modified:", or "Last updated:".

Version Histories


Versions Action Effective Date Authority
Version 1.0 First approved 2000-05-04 Letter to Deputy Ministers
Version 1.1 Updated 2005-09-21 Letter to Deputy Ministers

Rationale

The date indicator informs the users of the date of the original posting (issuance or publication) to the Web site or the date of last update (modification) of the resource.  Because of its positioning at the bottom of the page, the date indicator can also signal to the users that they have reached the end of that page.

As GoC sites are increasingly used to obtain valid, accurate and up-to-date information for personal and professional use, it is vitally important that GoC institutions provide clear date indicators for the resources placed on their Web sites.

Including a currency indicator is recognized as an industry best practice that users have come to expect, and use of the ISO standard (YYYY-MM-DD) will enhance conformity among GoC sites.

,

Interpretation

The standard provides for two kinds of dates:  "Date published" and "Date modified". The dates must be represented in the ISO all-numeric date standard YYYY-MM-DD. The two dates are defined as follows:

"Date published" is the date of formal issuance (i.e., posting to the Web site) of the resource.

"Date modified" is the most recent date on which the document was substantially changed and re-posted to the Web site. "Last updated" is alternative wording. Use of "Date modified" is preferred.

Either 'Date published' or 'Date modified' must be used, as applicable in accordance with the definitions above.

These definitions are consistent with the Common Look and Feel Metadata Standard Definitions and HTML Examples used in Standard 6.3. Encoding for the date value is defined in a profile of ISO 8601 [W3CDTF] and follows the YYYY-MM-DD format.

Top of Page

6.4 Best Practices

It is useful to establish a standard marker that signifies users have reached the end of any given Web page.

CLF Footer Elements


Standard 6.5

All GoC Web sites must use only standard 216 Web-safe colours for Web site elements, including menu bars and navigation aids, typography and background, and for simple graphic components.

Rationale

Only the 216 Web-safe colour options ensures compatibility with the full range of browsers and platforms available. It also makes good design sense to pick complementary colour schemes that display sufficient contrast for the average user.

,

Interpretation

In general, the standard requires the use of 216 Web-safe colours in all elements of site design to ensure the highest level of display accuracy across all platforms and systems. Web designers should also be aware that colour choices could seriously hamper the functioning of a Web site. While end-users can control colour elements to suit their needs, picking complementary colour schemes that display sufficient contrast such as black text on a white background, is the best way to avoid creating problems for people with visual and perceptual disabilities.

Top of Page

6.5 Best Practices

Black text on a white background provides high contrast and utility with respect to on-screen and printed information, and provides numerous accessibility advantages.

 


Standard 6.6

Frames must only be used on GoC sites as an alternative format.

Rationale

Frames are an example of non-sequential text, which can create interpretation problems for individuals using assistive technologies and for advanced multi-modal systems. Frames present additional problems when trying to ensure that organizational identification and CLF elements remain attached to content when located via search engines. Frames can also prevent users from easily bookmarking specific Web site content.

,

Interpretation

It is the responsibility of individual Web developers to ensure Web sites are accessible to all citizens.

Web page layout is critical to universal accessibility in that some common styles of Web page design actually create barriers for individuals using assistive devices and non-graphical technologies. Such techniques can only be used as an alternative, where universal accessibility has been otherwise guaranteed.


Standard 6.7

Web analyzer tools must be the standard means of collecting site usage data. Counters must not be used to perform this function.

Rationale

As corporate investment in Web site development and maintenance continues to rise, many organizations rely on statistics regarding site usage to measure associated costs and benefits. Some use simple counters, or others use more sophisticated Web analyzer tools to obtain data. Counters add little value to a site and often appear to be self-congratulatory. Web analyzer tools provide more information and are virtually transparent to the end user.


Standard 6.8

All GoC institutions must apply HTML validators to existing Web sites to assess accessibility status and HTML validations must be applied to new GoC sites prior to posting.

Rationale

All sites must be tested with a variety of browser software to ensure Web page layout remains intact regardless of what platforms end-users employ. These include graphic as well as character-based browsers. Testing should focus on ease of use, navigation, screen layout, comprehension and user satisfaction. Sites should also be tested with the graphics option turned off, as many users prefer this option as a means of accelerating document downloading. Web developers need to be aware that various hardware and software platforms can all significantly alter the appearance of a site, especially colour in graphics and backgrounds.

Validating HTML pages - on both existing and future sites - against a DTD will ensure they are syntactically correct. It should be noted that not all HTML editors are capable of performing this function, and that some are only effective in validating a vendor's proprietary DTD.

From: http://www.w3.org/TR/WAI-WEBCONTENT/#validation

,

Validation

Validate accessibility with automatic tools and human review. Automated methods are generally rapid and convenient but cannot identify all accessibility issues. Human review can help ensure clarity of language and ease of navigation.

Begin using validation methods at the earliest stages of development. Accessibility issues identified early are easier to correct and avoid.

Following are some important validation methods, discussed in more detail in the section on validation in the Techniques Document.

1. Use an automated accessibility tool and browser validation tool. Please note that software tools do not address all accessibility issues, such as the meaningfulness of link text, the applicability of a text equivalent, etc.

2. Validate syntax (e.g., HTML, XML, etc.).

3. Validate style sheets (e.g., CSS).

4. Use a text-only browser or emulator.

5. Use multiple graphic browsers, with:

  • Sounds and graphics loaded
  • Graphics not loaded
  • Sounds not loaded
  • No mouse
  • Frames, scripts, style sheets, and applets not loaded

6. Use several browsers, old and new.

7. Use a self-voicing browser, a screen reader, magnification software, a small display, etc.

8. Use spell and grammar checkers. A person reading a page with a speech synthesizer may not be able to decipher the synthesizer's best guess for a word with a spelling error. Eliminating grammar problems increases comprehension.

9. Review the document for clarity and simplicity. Readability statistics, such as those generated by some word processors may be useful indicators of clarity and simplicity. Better still, ask an experienced (human) editor to review written content for clarity. Editors can also improve the usability of documents by identifying potentially sensitive cultural issues that might arise due to language or icon usage.

10. Invite people with disabilities to review documents. Expert and novice users with disabilities will provide valuable feedback about accessibility or usability problems and their severity.


Guideline 6.1

Guidelines are not mandatory with respect to this policy but are provided to help institutions carry out government policy efficiently and effectively.

All GoC Web sites should incorporate Cascading Style Sheets (CSS) or similarly sized tables to achieve consistent presentation of content. W3C Cascading Style Sheets, W3C CSS Validator

Rationale

Effective design results from careful consideration of several elements: colour, space, imagery, typography and layout. While Web technologies offer new opportunities for creativity, there are distinct benefits to be gained in communication, identification, navigation and content through standardization of some design elements. When applied across a large group of related Web sites, design standards increase visual recognition by end-users and lead to stronger associations between various GoC institutions.

In keeping with good design principles, the common look and feel Web page layout guidelines observe practices developed to maintain consistent, professional and highly cognitive relationships between all elements on each Web page.

,

Interpretation

Effective use of space is crucial to good information design. Effective use of white space in the left-hand column, along with a fixed width for content space, reinforces visual recognition of GoC sites. Consistent use of labels, line width, Web page layout, etc., will further enhance visual recognition of GoC sites and make it easy for users to locate exactly what they are looking for. Carefully coded Cascading Style Sheets are the most efficient means of achieving this standard, but simply coded tables may also be used to establish placement of elements.

Top of Page

Best Practices

Layout and presentation

Once a majority of users use browsers that support CSS-2, the following style sheet techniques should be used to control layout and presentation.

  1. Use style sheets for text formatting rather than converting text to images.
    For example, stylized text on a colored background can be created with style sheets instead of as an image. This provides flexibility for people to view the text in a form that is most readable to them including magnified, in a particular color combination such as white on black, or in a particular font.
  2. Use style sheets rather than invisible or transparent images to force layout.
  3. Use style sheets instead of deprecated presentation elements and attributes that control visual presentation (elements {BASEFONT, CENTER, FONT, S, STRIKE, and U}. attributes {"align," "background," "bgcolor," "color," and "face"}. Authors are encouraged to use elements (such as STRONG, EM, H1, H2, ABBR, etc.) that add structure to documents.

Until then tables (to control layout) and bit-mapped text (for special text effects) may be used with alternative pages as necessary. http://www.w3.org/WAI/GL/19980624txt.htm

Use Cascading Style Sheets only where the CSS techniques in question are known to have adequate browser support. Each new release of the major graphical browsers include more and better support for the CSS guideline. Many CSS commands especially for font effects, simple margins etc., have been well supported since level 4 graphical browsers. More advanced CSS support is being developed. CSS markup should be used to replace the deprecated <FONT> tag in any case.

Following these 6 steps should minimize the need for testing multiple platform / browser combinations and will ensure your content is served.

  1. Design to the W3C Priority 1 and 2 Checkpoints and CLF Standards.
  2. Validate pages to HTML 4.01 Transitional as a minimum.
  3. Choose colours from the 216 web-safe colours list.
  4. Use style sheets.
  5. Test pages in a browser with style sheets disabled.
  6. When a client notifies you of an issue regarding access to content, then test against the specific issue and improve or solve it.

The following CLF standards have both navigation and format and official languages implications. Their navigation and format characteristics are described below. The Official Languages considerations are fully described in Section 7, Official Languages.


Standard 7.1


All GoC institutions must register their gc.ca domain names using at least one of the two following domain name conventions.
(a) a name or acronym that represents the institution's primary purpose in both official languages, e.g. www.canada.justice.gc.ca, www.ic.gc.ca
(b) 2 acronyms or names- one with the English first, the other giving prominence to the French, e.g. pco-bpc.gc.ca and bpc-pco.gc.ca and space-spatial.gc.ca spatial-space.gc.ca
  • If option (b) is adopted, the names or acronyms will appear on the URL line on the Welcome Page of a site in accordance with the principles set out under section 7.3 below.

Institutions may also register equivalent unilingual English and French versions of a name, or the acronym thereof, if they wish or need to use those on unilingual content pages (i.e., pco.gc.ca on English content pages and bcp.gc.ca on the French content pages) or when publishing information in unilingual media, e.g., in English or French magazines or newspapers.

Top of Page

Rationale

Just as government telephone numbers across the country are easily recognized by the '9' at the front of the prefix, the CLF standard to adopt a single domain name seeks to establish a similar identifier for GoC on the Internet. Domain names are vital to end-users. The domain name is the highest level reference to an individual site. If they know the exact domain name, users can effectively 'direct dial' to the information they want. In addition to acting as gateways to information and services, Web sites are key elements of marketing, promotional and information materials. A common domain name will further enhance federal identity, presence and visibility.

Bringing all GoC sites into a single domain will improve public recognition and make it easier for individuals to remember domain names they use on a regular basis. The standardization may also increase their chances of finding a site they have not previously visited. Informal surveys suggest Canadians are beginning to associate the gc.ca domain with the GoC.

Standard 7.2


All GoC Web sites must incorporate Welcome Pages at the main point of entry to the site. Each Welcome Page must incorporate three key elements: the "Canada" wordmark, the institutional signature and the language choice buttons except on unilingual Web sites where a content button must be provided. See Policy on using the official languages on electronic networks, which sets out requirements for bilingual sites as well as for unilingual sites, with a special disclaimer and hyperlink requirement for the latter, see Standard 7.4.

If Welcome Pages are used at a sub-site level, they must conform to the above requirements.  All elements of each Welcome Page must be viewable without scrolling in a 640 by 480 pixel screen.

Top of Page

Rationale

Welcome Pages are key to initial communication, identification and navigation on all GoC Web sites, and must therefore be designed to facilitate these functions. The standard single screen size ensures all necessary elements are viewable without scrolling and provides immediate access to the full content of any Welcome Page. While the centre area of any Welcome Page is left open for customisation to suit the needs of the institution (or its programs and services), standardization of the screen size and placement of mandatory elements will enhance visual consistency across all GoC sites.

Standard 7.3


All Web pages on all GoC Web sites must incorporate the "Canada" wordmark and the institutional signature using high quality reproductions in terms of accuracy, colour and resolution.

(a) The "Canada" wordmark must appear in the lower right display area on Welcome Pages and in the upper right display area on Content Pages.

(b) The institutional signature must appear in the upper left display on both Welcome and Content pages. On the Welcome page of a site, the order of the official languages is dictated by the location of the office providing the service through the site in question, i.e., English on the left for offices located outside of Quebec and French on the left for offices located inside Quebec.

Top of Page

Rationale

Standards for the size, placement and prominence of the "Canada" wordmark and FIP institutional signatures at the initial point of entry to GoC sites (the Welcome Page), and on all additional Web pages, foster visual recognition of individual institutions and increases the recognition of their links to the GoC. Consistent use of standard federal identifiers will ensure any area of any site can be easily identified as belonging to the Government of Canada, and will indicate that the information has been provided by a GoC institution. FIP identifiers also serve to assure users that the information is being appropriately used in the intended context.


  ,
 Return to
Top of Page
Important Notices