Recettes de code

Mots étrangers

Avant les CSS3, il n’était pas possible de mettre en italique tout les mots qui ne sont pas de la langue du document (style très répandu en typographie occidentale). Bien sûr il existait quelques bricolages, mais rien de propre :

CSS en ligne (incompatible XHTML 2.0)
C’est de l’anglais, <span style="font-style:italic" xml:lang="en">of course</span>.
Si la langue n’est ni de l’anglais, ni de l’allemand, ni de l’espagnol
:lang(en), :lang(de), :lang(es) {font-style:italic}

Avec CSS3 et la pseudo-classe :not, c’est désormais possible.

  • Si la langue n’est pas du français générique
    :not(:lang(fr)) {font-style:italic}
  • Je ne suis pas sûr que l’on puisse formater l’attribut en revanche. Le code ci-dessous peut donc être incorrect.

    Si la langue n’est pas un dialecte du français
    :not(:lang|(fr)) {font-style:italic}
  • Dans le cas de Dotclear, la valeur de la langue n’étant pas fixe mais provenant d’une variable, c’est encore plus délicat. Il faut extraire la chaîne. Avantage cependant : la langue primaire n’est plus fixée dans une CSS mais est extraite de celle du document, ce qui est l’objectif (sinon, un billet écrit en anglais serait entièrement en italique, ce qui n’est pas l’objectif). <?php dcInfo('lang'). Ç> dans <html xml:lang="<?php dcInfo('lang'); ?>">.

    Si la langue n’est pas celle de base du document (pour Dotclear)
    :not(:lang(php dcInfo('lang'))) {font-style:italic}

    À noter que, même si ce code est valide (ce dont je suis loin d’être sûr), le support de la convention typographique sur les insertions de mots étrangers n’est que partiel car :

    1. ce ne devrait pas être un passage en italique, mais une inversion de style (romain/italique et vice-versa) ;
    2. cette inversion peut être multiple et doit être basée sur le style de l’élément précédent Un billet en français citant Lawrence d’Arabie dans sa langue maternelle (l’anglais) lorsqu’il utilise un mot arabe). Il me semble qu’il y a une fonction qui permet une telle « remontée » des sources en CSS3, les combinateurs adjacents indirects ;
    3. il faut aussi demander à ce code ne pas prendre en compte les dialectes.

    Bref, il y a du travail…

Héritage de soulignement

Personne ne savait, il a fallu remonter jusqu’à Bert Bos himself. Du coup, je pense que ça vaut le coup que je recopie ici :

<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
	<style type="text/css">
		#test li	{text-decoration:underline}
		#test li li	{text-decoration:none}
	</style>
</head>

<body>
<div id="test">
<ol>
	<li>niveau 1-1
		<ol>
			<li>niveau 2-1</li>
			<li>niveau 2-2</li>
		</ol>
	</li>
	<li>niveau 1-2</li>
</ol>
</div>
</body>
</html>

Dans ce code, niveau 2-1 et niveau 2-2 ne devraient pas être soulignés (text-decoration:none). Malheureusement, c’est le cas sur au moins trois (Gecko, KHTML et Presto) des moteurs qui en valent la peine (je n’ai pas pu tester sur Tasman et Trident est bien sûr hors concours).

En fait, ce comportement est normal (bien qu’à mon sens non désirable) :

La spéc’ dit que le soulignement doit continuer dans les éléments enfant. Il n’y a donc pas moyen d’arrêter cela en CSS2 ; il faut soit utiliser une propriété CSS3, soit mettre le texte dans un span et souligner celui-ci.

Laurent Denis suggère d’utiliser #test li ol {display: table-cell}, les éléments en display:table-cell étant exclus de la boîte de soulignement. En revanche, ceci n’est pas compatible avec la numérotation.

Comme je préfère modifier la CSS (un seul fichier) que la structure (tous les fichiers et moins propre puisque j’insère d’une certaine manière de la présentation dans la structure), j’attendrai les CSS 3.

Notification de langue

Privilégier ISO 639-1 sur ISO 639-2. Lorsqu’ISO-639 (qui normalise les noms de domaines) propose simultanément des codes à 2 et à 3 caractères, on choisira le code à deux caractères : fr (français) plutôt que fre, conformément à la RFC 3066 : When a language has both an ISO 639-1 2-character code and an ISO 639-2 3-character code, you must use the tag derived from the ISO 639-1 2-character code.

C’est d’ailleurs un des points de la FAQ i18n du W3C. Cette règle permet de s’assurer qu’un code unique est utilisé pour une langue, et que les documents antérieurs à ISO 639-2 n’auront pas à être modifiés.

Pushing Your Limits : Douglas Bowman, Sydney 2004

Très cours, tout en image. Ah ! la concision…


Syndiquer le contenu