Working examples

Accessibility Responsibility Breakdown (WCAG 2.0)

• Accessibility Responsibility Breakdown (WCAG 2.0) - English example
• Accessibility Responsibility Breakdown (WCAG 2.0) - French example
• Accessibility Responsibility Breakdown (WCAG 2.0) - English example - Planning accessibility
• Accessibility Responsibility Breakdown (WCAG 2.0) - French example - Planning accessibility

Archived Web page template

• Archived Web page template - English example
• Archived Web page template - French example

Auto-complete for text input fields (datalist polyfill)

• Auto-complete for text input fields (datalist polyfill) - English example
• Auto-complete for text input fields (datalist polyfill) - French example

Base theme (v3.1 Beta)

• Base theme - English examples
• Base theme - French examples
• Base theme - Spanish examples
• Base theme - Arabic examples

Calendar interface

• Calendar interface - Date picker (input type="date" polyfill) - English example
• Calendar interface - Date picker (input type="date" polyfill) - French example
• Calendar interface - Events calendar - English example
• Calendar interface - Events calendar - French example

Charts and graphs support

• Charts and graphs support - Charts - English examples
• Charts and graphs support - Charts - Customized - English examples
• Charts and graphs support - Complex charts - English examples

CLF 2.0 theme

• CLF 2.0 theme - Content pages
• CLF 2.0 theme - Welcome pages
• CLF 2.0 theme - Server message pages

CSS Grid System

• CSS Grid System - English example
• CSS Grid System - Arabic example

Design guide (v3.1 Beta)

• Design guide - English guide

Drupal variant

• Drupal variant - English example
• Drupal variant - French example

Expandable/collapsible content (details/summary polyfill)

• Expandable/collapsible content (details/summary polyfill) - English example
• Expandable/collapsible content (details/summary polyfill) - French example
• Expandable/collapsible content (details/summary polyfill) - English example - Expand/Collapse All Content (v3.1 Beta)
• Expandable/collapsible content (details/summary polyfill) - French example - Expand/Collapse All Content (v3.1 Beta)

Feedback form

• Feedback form - English example
• Feedback form - French example

Footnotes

• Footnotes - English examples
• Footnotes - French examples

Form validation

• Form validation - English examples
• Form validation - French examples

GC Web Usability theme

• GC Web Usability theme - Home pages
• GC Web Usability theme - Content pages
• GC Web Usability theme - Content pages - Web application template
• GC Web Usability theme - Splash pages
• GC Web Usability theme - Server message pages

GC Web Usability Intranet theme

• GC Web Usability Intranet theme - Content pages
• GC Web Usability Intranet theme - Splash pages
• GC Web Usability Intranet theme - Server message pages

Language selector

• Language selector - English example - JavaScript + PHP
• Language selector - French example - JavaScript + PHP

Lightbox

• Lightbox - English examples
• Lightbox - French examples

Mathematical/scientific formula display (MathML polyfill)

• Mathematical/scientific formula display (MathML polyfill) - English examples
• Mathematical/scientific formula display (MathML polyfill) - French examples
• Mathematical/scientific formula display (MathML polyfill) - Complex French example

Menu bar

• Menu bar - English example - Mega menu
• Menu bar - French example - Mega menu
• Menu bar - English example - Horizontal site menu bar
• Menu bar - French example - Horizontal site menu bar

Meter (meter polyfill) (v3.1 Beta)

• Meter (meter polyfill) - English examples
• Meter (meter polyfill) - French examples

Multimedia player

• Multimedia player - English video examples
• Multimedia player - French video examples
• Multimedia player - English audio examples
• Multimedia player - French audio examples

Optimal content examples

• Optimal content examples - English examples
• Documentation related to HTML Table

Optimal content development tools (v3.1 Beta)

• HTML Table Validator

PHP variant

• PHP variant - English examples
• PHP variant - French examples

Prettify (source code)

• Prettify (source code) - English examples
• Prettify (source code) - French examples

Progress bar (progress polyfill)

• Progress bar (progress polyfill) - English examples
• Progress bar (progress polyfill) - French examples

Responsive design emulator

• Responsive design emulator - Content page - English - GC Web Usability theme
• Responsive design emulator - Content page - French - GC Web Usability theme
• Responsive design emulator - Content page + Secondary menu 1 - English - GC Web Usability theme
• Responsive design emulator - Content page + Secondary menu 1 - French - GC Web Usability theme
• Responsive design emulator - Content page + Secondary menu 2 - English - GC Web Usability theme
• Responsive design emulator - Content page + Secondary menu 2 - French - GC Web Usability theme

Responsive images (v3.1 Beta)

• Responsive images - English example

Session timeout

• Session timeout - English example
• Session timeout - French example

Share widget

• Share widget - English example
• Share widget - French example
• Share widget - English example - Filtered sites
• Share widget - French example - Filtered sites

Slide out tab

• Slide out tab - English example
• Slide out tab - French example

Slider control (input type="range" polyfill)

• Slider control (input type="range" polyfill) - English examples
• Slider control (input type="range" polyfill) - French examples

SSI variant

• SSI variant - English examples
• SSI variant - French examples

Tabbed interface

• Tabbed interface - English examples
• Tabbed interface - French examples

Table enhancement (DataTables integration) (v3.1 Beta)

• Table enhancement (DataTables integration) - English example

Text highlighting

• Text highlighting - English example
• Text highlighting - French example

Web Accessibility Assessment Methodology

• Web Accessibility Assessment Methodology - English methodology
• Web Accessibility Assessment Methodology - French methodology
• Web Accessibility Assessment Methodology - English methodology (AAA)
• Web Accessibility Assessment Methodology - French methodology (AAA)

Web feeds widget

• Web feeds widget - English examples
• Web feeds widget - French examples

Web Storage (HTML5)

• Web Storage (HTML5) - English example - Persistent storage (localStorage polyfill)
• Web Storage (HTML5) - French example - Persistent storage (localStorage polyfill)
• Web Storage (HTML5) - English example - Session storage (sessionStorage polyfill) (v3.1 Beta)
• Web Storage (HTML5) - French example - Session storage (sessionStorage polyfill) (v3.1 Beta)

WET theme (v3.1 Beta)

• WET theme - English examples
• WET theme - French examples
• WET theme - Spanish examples

WordPress variant

• WordPress variant - English examples

Zebra striping

• Zebra striping - Column highlight table
• Zebra striping - Simple table
• Zebra striping - Simple grouping table
• Zebra striping - Invoice table
• Zebra striping - Row level with summary table
• Zebra striping - English examples
• Zebra striping - French examples