 |
|
|
| |
| PRATIQUE CLIENTS WEB |
|
|
|
| Indiquer visuellement la langue d'une ressource |
| |
| C'est en faisant intervenir les pseudo-attributs du langage CSS que l'on peut préciser ainsi à l'internaute la langue d'une page liée.
(16/03/2005) |
 |
 |
Forum |
|
|
Réagissez
dans les forums
de JDN Développeurs
|
Un site Web peut contenir toutes sortes de liens, envoyant le
lecteur intéressé vers d'autres sites, sans que celui-ci puisse
connaître par avance la langue de site lié. La balise A,
marquant le lien, dispose d'un attribut hreflang,
mais celui-ci n'est généralement visible qu'en se plongeant
dans le code source.
Les pseudo
attributs de CSS permettent cependant de résoudre de manière
graphique cette situation. Plus précisément, il est possible
d'afficher, via CSS, le contenu de l'attribut hreflang
après le lien, sans pour autant devoir modifier le code HTML
ni gêner l'accessibilité... bien au contraire.
Un lien vers JDN Développeurs pourrait ainsi prendre cette forme
:
<a href="http://www.journaldunet.com/developpeur/"
hreflang="fr-FR">JDN Développeurs</a>
Les codes de langues sont expliqués
en ligne, et sont le plus souvent composés de quatre
lettres : les deux premières correspondent à la
langue,
la deux dernières au pays
d'application. "pt-BR" indiquera ainsi la langue
portugaise telle que parlé au Brésil, "en-UK"
l'anglais parlé en Angleterre. La seconde partie est
facultative pour certaines langues.
La CSS permettant d'afficher la langue pourrait être ainsi :
a[hreflang]:after { content: " [" attr(hreflang)
"] "; }
ce qui donnera
JDN Développeurs
[fr-FR]
On pourra même préciser le tout :
a[hreflang='fr-FR']:after { content:
" [page en français (France)] "; }
Pour obtenir :
JDN Développeurs
[page en français (France)]
Notez bien que comme de nombreuses techniques avancées
CSS, celle-ci n'est accessible qu'aux navigateurs modernes,
ce qui met malheureusement souvent IE6 hors-jeu.
|
|
|
|
|
|
|
