Bonjour,
Malgré mes efforts, je ne trouve toujours pas de manière propre de mettre en évidence les mots étrangers dans un document. À l’oral, ça ne pose pas de problème (du moment que le lecteur d’écran a des accents différents, mais je ne pense pas que ce soit une problématique de webmestre). En revanche, c’est autrement plus délicat à l’écran.
Le cas le plus commun est : un mot anglais est mis en italique. Plusieurs possibilités :
1. span style. Bof, hein. Plus d’autres problèmes que j’aborde plus loin.
2. span class. Un peu mieux, mais fondamentalement aussi bancal.
3. interpréter par CSS la valeur de langue. C’est le plus intéressant car le plus abstrait, mais dans l’état actuel, je bloque.
Voici ce que donne la solution numéro 3 :
The language pseudo-class: :lang (CSS2.1)
The language pseudo-class :lang (CSS3)
Ça à l’air bien, sauf que :
a. ça ne fonctionne que pour de l’anglais (on peut raffiner pour que les dialectes comme l’étasunien, le canadien, l’australien, le britannique, le londonien… soient pris en compte). Si je mets de l’allemand, par exemple, le texte apparaîtra normal (en romain) et non en italique.
b. ceci n’inverse pas le style de la police. Tant que le texte de base (le parent) est en romain, pas de problème. Mais si le parent est en italique, le texte étranger ne sera pas mis en romain ! On peut toujours s’amuser à cumuler les balises (i *:lang(en), em *:lang(en)…) mais, outre que ce n’est pas très élégant, ce n’est pas bon non plus : si j’ai mis un paragraphe en italique par CSS, le texte ne sera pas inversé (ma feuille de style actuelle met les blocs de citation en italique, par exemple ; je pourrais certes utiliser un blockquote *:lang(en), mais ce ne serais bon que pour cette feuille de style en particulier).
c. pour finir, l’attribut lang est nécessaire. Où est le problème ? Qu’en XHTML 1.1 cet attribut est interdit et remplacé par xml:lang. Or, ce dernier attribut est du XML et CSS, créée avant XML, ne sait pas le gérer. Ce dernier point est le moins gênant, dans le sens que l’on peut toujours revenir en XHTML 1.0 (qui, lui, accepte cet attribut, même en mode strict). XHTML 1.1 n’apporte pas grand-chose (hormis de bonnes bases pour la modularisation) et donc la gêne est moindre.
Pour résumer:
La solution actuelle (*:lang(en) {font-style:italic}) fonctionne mais est bancale pour trois raisons :
• ne fonctionne que pour une langue donnée
• n’inverse pas la police
• interdit le XHTML 1.1 et le futur XHTML 2.0
Voici ce que mes recherches pour améliorer la chose ont donné :
• la pseudo-classe :not est introduite par CSS3 et permet de sélectionner « en creux » : non pas ce qui correspond, mais tout ce qui ne correspond pas. Ici, il s’agirait de sélectionner tout ce qui n’est pas la langue du parent
• :xml:lang. Ce n’est sûrement pas la bonne manière de l’écrire, mais ce serait une mise à niveau de la formule CSS de reconnaissance des langues
• |(parent-lang). Là encore, l’écriture de la formule est incorrecte, mais il s’agirait de sélectionner non pas une langue (anglais, français), mais la langue courante (qui un jour peu être de l’anglais et un autre du français) du parent (donc de p dans un citation en ligne d’un paragraphe). Le | devant sert à sélectionner également les dialectes (fr-fr, en-gb…)
• reverse. Cette nouvelle valeur de font-style inverserai le style de police de l’élément par rapport à celui du parent : un mot étranger deviendrait italique s’il est entouré de romain et inversement. Seul problème : l’oblique (qui me semble à jeter, de toute manière) ne serait pas gérable (une inversion se faisant sur deux éléments, pas trois)
Bon, ça, c’est l’idéal. La pratique future, cependant, pourrait être
Ça ne résoud que le problème a (une seule langue). Mais c’est mieux que rien.
===================
Avez-vous des commentaires à faire sur la question ?
La principale raison pour laquelle j’ai ouvert cette discussion est que je pourrais avoir loupé quelques autres possibilités. La seconde raison est que je ne sais pas à quel module CSS3 je dois m’adresser (j’ai l’impression que la réponse est : plusieurs).
Merci de vos suggestions.
Modifié par David Latapie (19 Sep 2006 - 14:01)
Malgré mes efforts, je ne trouve toujours pas de manière propre de mettre en évidence les mots étrangers dans un document. À l’oral, ça ne pose pas de problème (du moment que le lecteur d’écran a des accents différents, mais je ne pense pas que ce soit une problématique de webmestre). En revanche, c’est autrement plus délicat à l’écran.
Le cas le plus commun est : un mot anglais est mis en italique. Plusieurs possibilités :
1. span style. Bof, hein. Plus d’autres problèmes que j’aborde plus loin.
2. span class. Un peu mieux, mais fondamentalement aussi bancal.
3. interpréter par CSS la valeur de langue. C’est le plus intéressant car le plus abstrait, mais dans l’état actuel, je bloque.
Voici ce que donne la solution numéro 3 :
*:lang(en) {font-style:italic}The language pseudo-class: :lang (CSS2.1)
The language pseudo-class :lang (CSS3)
Ça à l’air bien, sauf que :
a. ça ne fonctionne que pour de l’anglais (on peut raffiner pour que les dialectes comme l’étasunien, le canadien, l’australien, le britannique, le londonien… soient pris en compte). Si je mets de l’allemand, par exemple, le texte apparaîtra normal (en romain) et non en italique.
b. ceci n’inverse pas le style de la police. Tant que le texte de base (le parent) est en romain, pas de problème. Mais si le parent est en italique, le texte étranger ne sera pas mis en romain ! On peut toujours s’amuser à cumuler les balises (i *:lang(en), em *:lang(en)…) mais, outre que ce n’est pas très élégant, ce n’est pas bon non plus : si j’ai mis un paragraphe en italique par CSS, le texte ne sera pas inversé (ma feuille de style actuelle met les blocs de citation en italique, par exemple ; je pourrais certes utiliser un blockquote *:lang(en), mais ce ne serais bon que pour cette feuille de style en particulier).
c. pour finir, l’attribut lang est nécessaire. Où est le problème ? Qu’en XHTML 1.1 cet attribut est interdit et remplacé par xml:lang. Or, ce dernier attribut est du XML et CSS, créée avant XML, ne sait pas le gérer. Ce dernier point est le moins gênant, dans le sens que l’on peut toujours revenir en XHTML 1.0 (qui, lui, accepte cet attribut, même en mode strict). XHTML 1.1 n’apporte pas grand-chose (hormis de bonnes bases pour la modularisation) et donc la gêne est moindre.
Pour résumer:
La solution actuelle (*:lang(en) {font-style:italic}) fonctionne mais est bancale pour trois raisons :
• ne fonctionne que pour une langue donnée
• n’inverse pas la police
• interdit le XHTML 1.1 et le futur XHTML 2.0
Voici ce que mes recherches pour améliorer la chose ont donné :
*:not(:xml:lang|(parent-lang)) {font-style:reverse}• la pseudo-classe :not est introduite par CSS3 et permet de sélectionner « en creux » : non pas ce qui correspond, mais tout ce qui ne correspond pas. Ici, il s’agirait de sélectionner tout ce qui n’est pas la langue du parent
• :xml:lang. Ce n’est sûrement pas la bonne manière de l’écrire, mais ce serait une mise à niveau de la formule CSS de reconnaissance des langues
• |(parent-lang). Là encore, l’écriture de la formule est incorrecte, mais il s’agirait de sélectionner non pas une langue (anglais, français), mais la langue courante (qui un jour peu être de l’anglais et un autre du français) du parent (donc de p dans un citation en ligne d’un paragraphe). Le | devant sert à sélectionner également les dialectes (fr-fr, en-gb…)
• reverse. Cette nouvelle valeur de font-style inverserai le style de police de l’élément par rapport à celui du parent : un mot étranger deviendrait italique s’il est entouré de romain et inversement. Seul problème : l’oblique (qui me semble à jeter, de toute manière) ne serait pas gérable (une inversion se faisant sur deux éléments, pas trois)
Bon, ça, c’est l’idéal. La pratique future, cependant, pourrait être
*:not(lang|(en)) {font-style:italic}Ça ne résoud que le problème a (une seule langue). Mais c’est mieux que rien.
===================
Avez-vous des commentaires à faire sur la question ?
La principale raison pour laquelle j’ai ouvert cette discussion est que je pourrais avoir loupé quelques autres possibilités. La seconde raison est que je ne sais pas à quel module CSS3 je dois m’adresser (j’ai l’impression que la réponse est : plusieurs).
Merci de vos suggestions.
Modifié par David Latapie (19 Sep 2006 - 14:01)