Conseils pratiques sur l’internationalisation du Web

Encodage. Utilisez l’encodage de caractères UTF-8 (Unicode) pour le contenu, les bases de données, etc. Déclarez toujours l’encodage.

Caractère d’échappement. Utilisez des caractères plutôt que des caractères d’échappement (par ex. : á á or á) à chaque fois que cela est possible.

Langue. Déclarez la langue des documents et indiquez les modifications de langue internes.

Présentation vs contenu. Utilisez des feuilles de style pour les informations de présentation. Restreignez les balises à la sémantique.

Images, animations et exemples. Contrôlez la traduisibilité et les préjugés culturels inappropriés.

Formulaires. Utilisez l’UTF-8 sur le formulaire et le serveur. Préférez les formats locaux de noms/ adresses, heures /dates, etc.

Écriture de texte. Utilisez un texte simple et concis. Soyez soigneux dans la composition des phrases à partir de plusieurs chaînes de caractères.

Navigation. Sur chaque page, insérez une navigation clairement visible vers les pages ou sites localisés, en utilisant la langue cible.

Texte de droite à gauche. En HTML, ajoutez dir="rtl"à la balise html. Réutilisez-la uniquement pour modifier le sens de lecture.

Vérifiez votre travail. Validez ! Utilisez des techniques, tutoriels et articles accessibles sur http://www.w3.org/International/

Intended audience: tous ceux qui découvrent l’internationalisation et ont besoin de conseils sur des thèmes à envisager et les façons de se familiariser avec le contenu du site.

Les « Conseils Pratiques » suivants résument les concepts-clés de la conception de sites Web internationaux. Ces conseils ne sont pas des instructions complètes, ce sont uniquement quelques concepts décrits sur le sous-site Activité d’internationalisation du W3C.

Cette page répertorie les conseils sous forme de déclarations très concises qui apparaissent également sur les cartes de référence format carte de visite, suivis par un texte qui fournit plus de détails et d’explications. Ensuite, nous fournissons des liens vers les informations du sous-site d’internationalisation du W3C, si disponibles, où vous en apprendrez davantage.

Cette page sera mise à jour de temps à autre.

Conseils Pratiques

Encodage. Utilisez l’encodage de caractères UTF-8 (Unicode) pour le contenu, les bases de données, etc. Déclarez toujours l’encodage.

L’encodage de caractères que vous choisissez détermine comment les octets sont associés aux caractères dans votre texte.

Normalement, les encodages de caractères vous limitent à un type d’écriture particulier ou à un ensemble de langues. L’Unicode vous permet de traiter simplement presque tous les types d’écritures et de langues utilisés dans le monde entier. De cette manière, l’Unicode simplifie le traitement des contenus en plusieurs langues, que ce soit sur une seule page ou sur un ou plusieurs sites. L’Unicode est particulièrement utile lorsqu’il est utilisé dans des formulaires, scripts et bases de données, où vous avez souvent besoin de prendre en charge plusieurs langues. L’Unicode rend également très simple l’ajout de nouvelles langues à votre contenu.

À moins que vous ne déclariez correctement quel encodage de caractères vous utilisez, vos utilisateurs peuvent ne pas être en mesure de lire votre contenu. Ceci est dû aux suppositions incorrectes sur la façon d’associer les octets aux caractères qui peuvent être effectuées par l’application interprétant votre texte.

Donnez-moi plus de contexte
Les encodages de caractères pour les débutants explique quelques-uns des concepts de base sur les encodages de caractères, et pourquoi vous devriez vous en soucier. Introduction aux jeux de caractères et encodages de caractères offre une présentation des différents aspects de ce thème.
Comment faire ?
Auteurs HTML & CSSDéveloppeurs de spécificationsConfiguration du serveur
Caractère d’échappement. Utilisez des caractères plutôt que des caractères d’échappement (par ex. : á á ou á) à chaque fois que cela est possible.

Les caractères d’échappement tels que les Références de Caractères Numériques (RCN), et les entités sont des façons de représenter n’importe quel caractère Unicode dans des balises utilisant uniquement des caractères ASCII. Par exemple, vous pouvez représenter le caractère á au format HTML en tant que á ou á ou á.

De tels caractères d’échappement sont utiles pour représenter clairement des caractères ambigus ou invisibles, et éviter les problèmes avec les caractères de syntaxe tels que les esperluettes et les crochets. Il peut parfois également être utile de représenter des caractères non supportés par votre encodage de caractères ou non disponibles sur votre clavier. Sinon, vous devriez toujours utiliser des caractères plutôt que des caractères d’échappement.

Donnez-moi plus de contexte
Utiliser des caractères d’échappement dans les balises et CSS fournit des informations supplémentaires au sujet des caractères d’échappement dans les langages de balisage. Notamment, veuillez remarquer que les entités (telles que á) doivent être utilisées avec précaution.
Comment faire ?
Auteurs HTML & CSSDéveloppeurs de SpécificationsAuteurs SVG
Langue. Déclarez la langue des documents et indiquez les modifications de langue internes.

Les informations au sujet de la langue (humaine) du contenu sont déjà importantes pour l’accessibilité, le style, la recherche, l’édition etc. Au fur et à mesure que de plus en plus de contenu sera balisé, et balisé correctement, les applications pouvant détecter les informations de langue deviendront de plus en plus utiles et omniprésentes.

Lors de la déclaration de la langue, vous pouvez avoir besoin de fournir des informations sur une gamme de contenu spécifique de manière différente de celle des métadonnées du document dans son ensemble. Il est important de comprendre cette distinction.

Donnez-moi plus de contexte
Langage sur le Web offre une introduction à plusieurs aspects de ce thème.
Comment faire ?
Auteur HTML & CSSAuteurs SVGAuteurs XMLConfiguration du serveur
Présentation vs contenu. Utilisez des feuilles de style pour les informations de présentation. Restreignez les balises à la sémantique.

C’est un principe important de la conception Web que de garder la manière dont le contenu est stylisé ou présenté distincte du texte lui-même. Ceci permet de mettre facilement en œuvre un style alternatif pour le même texte, par exemple pour afficher le même contenu sur un navigateur conventionnel et sur un petit appareil portable.

Ce principe est particulièrement utile pour la localisation, étant donné que différentes écritures ont des besoins typographiques différents. Par exemple, à cause de la complexité des caractères japonais, il peut être préférable de mettre l’accent sur du contenu de page HTML japonaise autrement qu’en mettant les caractères en gras ou en italique. Il est plus simple d’appliquer de telles modifications si la présentation est décrite en utilisant une CSS, et les balises sont plus propres et plus gérables si le texte est étiqueté correctement et sans ambiguïté comme étant « accentué » plutôt que « gras ».

Travailler avec des fichiers CSS peut permettre d’épargner du temps et des efforts considérables pendant la localisation plutôt que de devoir changer les balises, car toute modification nécessaire peut être faite en un seul endroit pour toutes les pages, et le traducteur peut se concentrer sur le contenu plutôt que sur la présentation.

Donnez-moi plus de contexte
Consultez les diapositives de la présentation de la conférence @media de 2007 « La conception pour les utilisateurs internationaux : conseils pratiques ».
Images, animations et exemples. Contrôlez la traduisibilité et les préjugés culturels inappropriés.

Si vous souhaitez que votre contenu communique réellement avec les gens, vous devez parler leur langue, non seulement à travers le texte, mais également avec des images, des couleurs, des objets et des préoccupations localisés. Il est facile de négliger la nature du symbolisme, du comportement, des concepts, du langage corporel, de l’humour, etc. d’une culture spécifique. Vous devez faire en sorte d’obtenir des retours sur la pertinence de vos images, clips vidéo et exemples de la part des utilisateurs du pays concerné.

Vous devez également faire attention lors de l’intégration de texte à des images lorsque le contenu est traduit. Du texte sur un arrière-plan complexe ou des espaces restreints peut engendrer des problèmes considérables pour le traducteur. Vous devez fournir au groupe de localisation des images avec le texte sur une couche séparée et garder en tête que le texte écrit dans des langues comme l’anglais ou le chinois aura une traduction sûrement plus longue.

Donnez-moi plus de contexte
Consultez les diapositives de la présentation de la conférence @media de 2007 « La conception pour des utilisateurs internationaux : conseils pratiques ».
Formulaires. Utilisez l’UTF-8 sur le formulaire et le serveur. Préférez les formats locaux de noms/ adresses, heures /dates, etc.

L’encodage utilisé pour une page HTML qui contient un formulaire doit prendre en charge tous les caractères nécessaires pour saisir des données dans ce formulaire. C’est surtout très important si les utilisateurs sont susceptibles de saisir des informations dans plusieurs langues.

Les bases de données et les scripts qui reçoivent des données de formulaires sur des pages en plusieurs langues doivent également prendre en charge les caractères de toutes ces langues de manière simultanée.

La façon la plus simple de permettre cela est d’utiliser l’encodage UTF-8 de caractères Unicode pour les pages contenant des formulaires et tous les stockages et traitements en aval. Dans un tel scénario, l’utilisateur peut saisir des données dans n’importe quelle langue et type de caractères.

Vous devez également éviter de présumer que des données telles que le nom et l’adresse de l’utilisateur suivront les mêmes règles de formatage que les vôtres. Demandez-vous en combien de champs détaillés vous avez réellement besoin de diviser des informations comme les adresses. Gardez en tête que dans certaines cultures il n’y a pas de noms de rues, que dans d’autres le numéro de la maison suit le nom de la rue, que certaines personnes ont besoin de plusieurs lignes pour la partie de l’adresse qui précède la ville ou le nom de la commune, etc. De fait, dans certains endroits, une adresse s’ordonne du général au spécifique, ce qui implique une stratégie de mise en page très différente. Veillez à ne pas incorporer d’hypothèses incorrectes au sujet du préfixe régional ou de la longueur du numéro de téléphone dans des routines de validation. Admettez qu’un étiquetage soigneux sur la façon dont les dates numériques seront saisies est nécessaire, étant donné qu’il existe différentes conventions du classement du jour, mois et de l’année.

Si vous recueillez des informations de personnes de plusieurs pays, il est important de développer une stratégie de traitement des différents formats que les personnes s’attendront à utiliser. Cela est non seulement important pour la conception des formulaires que vous créerez, mais ça aura également un impact sur la façon de stocker ces informations sur les bases de données.

Comment faire ?
Auteurs HTML & CSS
Écriture de texte Utilisez un texte simple et concis. Soyez soigneux dans la composition des phrases à partir de plusieurs chaînes de caractères.

Un texte simple et concis est plus facile à traduire. Il est également plus simple à lire s’il n’est pas écrit dans la langue maternelle des personnes qui le lisent.

Vous devez être extrêmement attentif lorsque vous composez des messages à partir de plusieurs sous-chaînes de caractères, ou lors de l’insertion d’un texte variable dans des chaînes de caractères. Par exemple, supposez que votre site utilise un script PHP et que vous décidiez de composer des messages à la volée. Vous pouvez créer des messages en concaténant des sous-chaînes séparées, telles que « Uniquement » ou « Ne Pas », « renvoyer les résultats dans » et « tout format » ou « HTML ». Parce que l’ordre des phrases du texte en d’autres langues peut être très différent, traduire ceci peut présenter des difficultés importantes.

De même, il est important d’éviter de fixer les positions de variables dans un texte, telles que « Page 1 à 10 ». La syntaxe d’autres langues peut exiger l’inversion des nombres pour donner du sens. Si vous utilisez du PHP, ceci signifierait utiliser une chaîne de formatage telle que « Page %1\$d à %2\$d. », plutôt que la chaîne plus simple « Page %d à %d. ». Cette dernière n’est pas traduisible dans certaines langues.

Comment faire ?
Auteurs HTML & CSS

Lorsque vous disposez de versions d’une page ou d’un site dans des langues différentes, ou pour des pays / régions différents, vous devriez fournir aux utilisateurs une façon de voir la version qu’ils préfèrent. Ceci devrait être disponible sur chaque page de votre site lorsque l’alternative existe.

Lorsque vous fournissez des liens vers des pages dans d’autres langues, utilisez le nom de la langue cible avec l’écriture et la langue native. Ne présumez pas que l’utilisateur sait lire le français. Par exemple, dans un lien vers une page en anglais, « anglais » doit être « English ». Ceci s’applique également si vous guidez l’utilisateur vers une page ou un site spécifique à un pays ou une région, par ex. « Allemagne » doit être « Deutschland ».

Comment faire ?
Auteurs HTML & CSS
Texte de droite à gauche. En HTML, ajoutez dir="rtl"à la balise html. Réutilisez-la uniquement pour modifier le sens de lecture.

Un texte écrit dans des langues telles que l’arabe, l’hébreu, le persan et l’ourdou se lit de droite à gauche. Ce sens de lecture mène généralement à aligner le texte à droite et disposer les éléments de manière inversée, notamment la disposition de pages ou de tableaux. Vous pouvez configurer l’alignement et l’ordre du contenu de la page pour une lecture de droite à gauche par défaut en intégrant simplement dir="rtl" dans la balise html.

L’orientation définie dans la balise html établit un sens de lecture pour le document qui se répercute sur tous les éléments de la page. Il n’est pas nécessaire de répéter l’attribut sur des éléments de niveau inférieur sauf si vous souhaitez modifier de manière explicite le flux directionnel.

Le texte intégré à, par exemple, une écriture latine continuera de se lire de gauche à droite au sein d’un flux général de droite à gauche. Idem pour les chiffres. Si vous travaillez avec des langues qui se lisent de droite à gauche, vous devez vous familiariser avec les bases de l’algorithme bidirectionnel Unicode. Cet algorithme gère une bonne partie du texte bidirectionnel sans que l’auteur ait besoin d’intervenir. Il existe certaines circonstances, cependant, où la balise ou les caractères de contrôle Unicode sont nécessaires afin de garantir un effet correct.

Donnez-moi plus de contexte
Les bases de l’algorithme bidirectionnel Unicode offre une présentation de base du fonctionnement de l’algorithme bidirectionnel Unicode et des cas où il a besoin de l’assistance des balises.
Créer des pages HTML en arabe, hébreu et autres écritures de droite à gauche fournit une présentation des bases du traitement de texte de droite à gauche en HTML. Les principes sont semblables pour d’autres langages de balisage.
Balise intra-paragraphe et texte bidirectionnel en HTML fournit une autre présentation, cette fois sur les bases du traitement de texte bidirectionnel intra-paragraphe.
Comment faire ?
Auteurs HTML & CSSAuteurs SVGAuteurs XMLDéveloppeurs de schémas
Vérifiez votre travail. Validez ! Utilisez des techniques, tutoriels et articles accessibles sur http://www.w3.org/International/
Essayez le Vérificateur d’internationalisation du W3C.

Autres documents de présentation

Il existe une page Commencer pour vous aider à trouver des informations sur le site. La page Commencer indique des articles qui fournissent aux nouveaux venus des présentations simples de thèmes-clés sur l’internationalisation et suggèrent des informations de base proposées sur le site pour vous aider à commencer.