1. Accueil  
  2. Design  
  3. Composants  
  4. Changement de langue

Changement de langue

Le menu de changement de langue est utilisé pour traduire des pages de contenus ou de services dans une langue autre que le français ou l’anglais.

Exemple

Quand l’utiliser

Le menu de changement de langue s’utilise lorsque l’information diffusée s’adresse à des clientèles étrangères ou aux personnes nouvellement arrivées au Québec. Les orientations sur la traduction doivent être appliquées.

Comment l’utiliser

Tout contenu doit d’abord exister en français, qui est la langue officielle et de référence du Québec.

Un ministère ou organisme qui souhaite diffuser des contenus traduits doit le faire dans le respect de sa politique linguistique.

Seules les pages ciblées sont traduites. Le chemin de navigation depuis la page d’accueil ne l’est pas.

La langue par défaut, dans le bandeau d’entête et la navigation générale, est toujours le français.

Aucun mécanisme n’a été prévu afin d’inclure un menu de traduction dans le bandeau d’en-tête du PIV autre que les liens Français ou English pour basculer d’une langue à l’autre. Ce menu est donc contextualisé en haut de la page du contenu à traduire, sous le titre de niveau 1.

Informations techniques

Indications sur le contenu

Les libellés de langues sont écrits dans leur propre langue (exemple : écrire « English » pour le libellé de traduction vers l’anglais). Le mot est écrit idéalement avec l’alphabet utilisé dans la langue (exemple : utiliser le Hangeul pour le libellé du mot « Coréen »).

Les libellés sont en Open Sans en taille 14 px avec un interligne de 20 px.

Positionnement

Le menu de changement de langue est positionné directement sous le titre de niveau 1.

Il y a un espacement de 32 px entre la décoration (soulignement rose) du titre de niveau 1 et le menu de changement de langue.

Les libellés de langues sont disposés côte à côte. Si la taille de l’écran est trop étroite pour contenir tous les libellés sur une seule ligne, les libellés excédentaires peuvent s’ajouter sur une ligne supplémentaire.

Ordre

Le libellé « Français » est toujours en premier, suivi du libellé « English » si la page existe en anglais. Les autres libellés de langue sont ordonnancés selon l’importance des publics cibles visés par le contenu.

Dimensions

Le menu de changement de langue occupe 100 % de la largeur de la zone de contenu, dont la limite est 825 px de large.

La hauteur est déterminée par le nombre de lignes sur lesquelles les libellés sont disposés, généralement entre 1 et 3 lignes, selon la largeur de l’écran. La hauteur d’un menu dont les libellés tiennent sur une ligne est de 56 px.

Espacements et dégagements

Il y a 32 px au-dessus et en dessous du menu de langue.

Il y a 15 px entre les libellés et les lignes de 1 px qui se trouvent au-dessus et en dessous du menu de changement de langue.

Chaque libellé a un dégagement de 16 px à droite ainsi que de 2 px en haut et en bas.

États

Actif

Le libellé de la page en cours est écrit en bleu foncé et en gras. Il est non cliquable et n’a donc pas d’état de survol.

CSS du menu de changement de langue par défaut
font-family: Open Sans;
font-weight: regular;
font-size: 14px;
line-height: 20px;
font-color: #095797;
border-top: 1px solid #c5cad2;
border-bottom: 1px solid #c5cad2;

CSS du menu de changement de langue sélectionné
font-weight: bold;
font-color: #223654;

Au survol

Au survol, les libellés deviennent soulignés.

CSS du menu de changement de langue au survol
text decoration: underline;

Au focus

Au focus, les libellés ont un contour bleu clair.

CSS du menu de changement de langue au focus
outline: 2px solid #4a98d9;
outline-offset: 2px;

Dernière mise à jour : 6 novembre 2023

Évaluation de page

L’information sur cette page vous a-t-elle été utile?
Avis général

Des questions ou besoin de renseignements?

Communiquez avec Services Québec