Thème de la facilité d'emploi Web GC

Aperçu

Chef du projet : Paul Jackson (@pjackson28)

Purpose

Le thème base à été créé pour conformer aux principes de la Norme sur la facilité des sites Web.

Avantages

Les premières tâches ont été essayées avec les utilisateurs : contactez-nous, la recherche, retourner à la page d'accueil, à propos de nous, rester connexes par les médias sociaux, naviguer le site, lire les avis, et basculer la langue officielle de choix.
Conformes à la Norme sur l'accessibilité des sites Web et la Norme sur la facilité d'emploi des sites Web
Conformes à WCAG 2.0 AA
Conception réactive avec le soutien pour les appareils mobiles et les ordinateurs de table
Recours aux balises sémantiques HTML5 et à la spécification WAI-ARIA pour accroître l’accessibilité
Regroupe le gros de la navigation sous le domaine du contenu
Conformité aux critères HTML5 et XML

Utilisation recommandée

Quand utiliser

Ce thème doit être utilisé pour les sites Web du gouvernement du Canada (dotés d'applications Web).

Quand ne pas utiliser

Ce thème peut seulement être utilisé pour les sites Web du gouvernement du Canada (dotés d'applications Web).

Apparence

The theme prescribes the look of the template for content pages, splash pages and server error pages. Content layout, including that of the home page, is not prescribed, except for the Priorities section that is right-aligned somewhere below the breadcrumbs.

Le thème prescrit l'apparence du modèle pour les pages de contenu, les pages d'entrée et les pages de messages du serveur. La mise en page du contenu, y compris cela de la page d'accueil, n'est pas prescrit, sauf la section pour les Priorités qui est aligné à droite au dessous du fil d'Ariane.

Contenu

Le contenu devrait se fixer sur les premières tâches des utilisateurs. Les utilisateurs ont tendance à naviguer par le zone de contenu premier et les menus deuxième. Ils cherchent des mots-clés qui les aideront à rencontrer leur besoin d'informations. Écrire dans la voix active et les verbes d'usage. Les utilisateurs scruteront souvent les informations distinctes - comme les liens. Chaque lien doit être descriptif et représentatif du contenu à lequel il mène. Ceci est surtout prononcé quand les utilisateurs accèdent au site via un appareil mobile.

Mise en œuvre

Instructions générales

Utiliser \theme-gcwu-fegc\*.html pour créer vos pages Web.
Facultatif : Créer et installer un our plusieurs fichers CSS (pour le CSS personnalisé)
Facultatif : Créer les liens aux nouveaux fichiers CSS entre les commentaires suivants :
```
< !-- CustomScriptsCSSStart -->
< !-- CustomScriptsCSSEnd -->
```
Corriger les URLs des *.css, *.js et *.gif dans les fichiers *.html
Remplacer le titre de la page (entre <title> et </title>,), le titre du site et le titre du contenu (entre <h1 id="wb-cont"> et </h1>)
Remplacer les valeurs des métadonnées
Corriger les liens Terms and conditions/Avis

Instructions spécifiques aux pages de contenu (cont*.html)

Corriger les liens de la barre de menu
Corriger les liens des mégamenus ou éliminer les mégamenus
Corriger les liens de sélection de la langue
Facultatif : Mettre en oeuvre navigation secondaire version 1 (trois niveaux maximum) ou navigation secondaire version 2 (quatre niveaux maximum)
Corriger la zone de recherche
Corriger le fil d'Ariane
Corriger les liens Transparency/Transparence
Corriger les liens dans le pied de page du site
Corriger le valeur pour Date modified/Date de modification ou remplacer avec Version (où permis par la Norme sur la facilité d'emploi des sites Web)

Instructions spécifiques aux pages d'entrée (sp-pe*.html)

Corriger les liens English/Français
Facultatif : Ajouter les autres liens de sélection de la langue

Instructions spécifiques aux pages de messages du serveur (serv*.html)

Remplacer les messages en anglais et français
Facultatif : Ajouter des messages pour les autres langues

Exemples

Développement

Le code pour le thème base se trouve dans plusieurs places dans le dossier source de la BOEW :

theme-gcwu-fegc/js/theme.js - contient le JavaScript du thème pour la facilité d'emploi Web du GC
theme-gcwu-fegc/sass/theme.scss - contient le CSS pour les pages de contenu du thème pour la facilité d'emploi Web du GC
theme-gcwu-fegc/sass/theme-ie.scss - contient le CSS spécifique à IE7/8 pour les pages des contenu du thème pour la facilité d'emploi Web du GC
theme-gcwu-fegc/sass/theme-serv.scss - contient le CSS pour les pages de messages du serveur du thème pour la facilité d'emploi Web du GC
theme-gcwu-fegc/sass/theme-serv-ie.scss - contient le CSS spécifique à IE7/8 pour les pages de messages du serveur du thème pour la facilité d'emploi Web du GC
theme-gcwu-fegc/sass/theme-sp-pe.scss - contient le CSS pour les pages d'entrée du thème pour la facilité d'emploi Web du GC
theme-gcwu-fegc/sass/theme-sp-pe-ie.scss - contient le CSS spécifique à IE7/8 pour les pages d'entrée du thème pour la facilité d'emploi Web du GC
theme-gcwu-fegc/sass/includes/ - contient les fichiers à inclure pour créer les fichies CSS du thème pour la facilité d'emploi Web du GC
theme-gcwu-fegc/jquerymobile/jquery.mobile.theme.css - contient le CSS spécifique à jQuery Mobile du thème pour la facilité d'emploi Web du GC
theme-gcwu-fegc/images/ - contient les images du thème pour la facilité d'emploi Web du GC
theme-gcwu-fegc/jquerymobile/images/ - contient les images spécifique à jQuery Mobile pour le thème pour la facilité d'emploi Web du GC

Problèmes connus

Les styles des CSS ne seront pas entièrement uniformes d’un fureteur à l’autre puisque plusieurs interpréteront différemment la syntaxe des CSS.
L'essai de facilité d'emploi est nécessaire pour les styles dans la système styles in the CSS grid system.

Recherche