Comme je n'ai pas pu m'empêcher de jeter un oeil dans mon Feed Deemon ce matin, un billet de Dive the Web m'a fait sursauter :

Le language CSS est sensible à la casse. Du moins, c'est ce que je croyais.

Et bien, me voici toute ébaubie, je découvre qu'il ne l'est pas. J'ai défini une class smallTxt et j'ai fait une faute de frappe en oubliant de capitaliser le t... et ça marche. Je m'étonne, je crois d'abord faire face à un bug du navigateur. Je teste dans FireFox 1.0 et IE6. J'ai ensuite essayé le coup avec SMALLTxt et SmALLtxt... Même résultat: le style est toujours appliqué.

Je vérifie donc sur quelques sites et j'ai la confirmation que je cherchais: le CSS n'est pas sensible à la casse.

Lire la suite de CSS, sensibilité à la casse, doctype switching et lecture des specs
(6 commentaires et trackbacks)

(Non, ce n'est pas un montage)

Lire la suite de Valider, c'est bien. Réfléchir, c'est mieux.
(11 commentaires et trackbacks)

Une remarque de l'excellent Denis Boudreau dans le forum Webmaster-Hub me faire amicalement bondir : je suis de ceux qui soutiennent qu'on ne devrait utiliser qu'un seul h1 par page, pas plusieurs.

Etant pour ma part de ceux qui soutiennent qu'on peut n'utiliser qu'un seul h1 par page, mais que cela n'a rien de normatif, je crois qu'il y a là un bon exemple de l'abus de prescription. Le choix d'utiliser h1 de telle ou telle manière relève en effet de deux problématiques distinctes : le respect de la norme d'une part, et dans ce cadre, les choix de pratiques d'autre part. Ne les mélangeons pas :

Lire la suite de title et h1, titre de section et titre de document: le malentendu
(35 commentaires et trackbacks)

Si vous n'avez jamais entendu parler du FOUC, vous pouvez vous épargner la peine de lire ce qui suit et vous contenter de retenir que ce Flash of Unstyled Content dans IE n'aurait jamais dû être érigé en bug et ne devrait surtout jamais faire l'objet de hacks dans le code HTML.

Si en revanche, vous avez déjà tripatouillé le contenu de votre head pour éviter cet effet de rendu, prenez ce qui suit en considération :

Lire la suite de FOUC, Si vous avez du temps à perdre...
(11 commentaires et trackbacks)

Il arrive régulièrement que l'on braque les projecteurs sur une propriété CSS ou un élément HTML jusque-là peu employé, et dont on découvre tout à coup sinon l'existence, du moins les multiples possibilités d'utilisation. Généralement, après une période d'enthousiame et d'inventivité plus ou moins heureuse, on en vient à un usage plus limité, mais plus raisonné de l'outil en question (voir la mode des listes de définition par exemple).

Il semble, à lire Raphael Goetter et sa collègue Nanoum, que ce soit aujourd'hui le tour de la propriété content liée aux sélecteurs :before et :after. Aussi me permettrais-je de proposer cette petite anayse de leur usage :

Lire la suite de :before et :after, du bon usage du contenu généré
(15 commentaires et trackbacks)

Le groupe de travail du W3C sur l'internationalisation (I18N) poursuit sa récente entreprise pédagogique (que complète la Quality Assurance Activity et sa collaboration avec le WASP) avec un projet de document sur un de ces thèmes apparemment évidents, mais qui vous réservent quelques suprises : Authoring Techniques for XHTML & HTML Internationalization: Specifying the language of content.

Quels en sont les points essentiels ?

Lire la suite de Internationalisation: Spécifier la ou les langues d'un document Web
(26 commentaires et trackbacks)

Ce qu'il y a de bien et de très simple dans la notion d'interopérabilité CSS, c'est que ce genre de sottise de la part d'un concepteur n'est plus un problème :

Source : Site du premier Ministre (gouvernement français).

Lire la suite de L'interopérabilité : quoi qu'est-ce ?
(10 commentaires et trackbacks)

Faute de temps pour détailler, voici brièvement une technique CSS permettant d'obtenir :

• Deux colonnes (ou plus) de largeur au choix fixe ou variable ;
• De hauteur apparente identique quelque-soit leur contenu, dans les navigateurs ayant un support CSS suffisant, avec une dégradation correcte de cette présentation dans IE Windows 5+ ;
• Et un pied de page stable quelque-soit la hauteur des colonnes.

Lire la suite de Des colonnes de même hauteurs en CSS
(22 commentaires et trackbacks)

Une discussion sur le forum OpQuast me trotte par la tête depuis quelques temps, à propos des feuilles de styles print. Le fait qu'une CSS print permettent d'obtenir un résultat imprimé différent du résultat affiché :

• serait déroutant pour l'utilisateur qui s'attend à un résultat identique sur les deux médias ;
• le priverait de la possibilité d'imprimer la page telle qu'il la voit, alors qu'il peut justement souhaiter imprimer les arrières-plans, les éléments décoratifs, les menus de navigations, etc. que la CSS print sert justement le plus souvent à éliminer.

C'est oublier qu'un document peut très bien avoir plusieurs feuilles de style d'impression.

Lire la suite de Plusieurs styles alternatifs pour imprimer
(6 commentaires et trackbacks)

Tout a été dit par Eric Meyer il y a longtemps dans Consistent List Indentation sur ce problème de marge gauche des listes sur lequel buttent de nombreux webmestres. Pour créer l'espace nécessaire aux puces d'une liste ordonnée ou non, les navigateurs n'ont pas tous adoptés la même méthode :

Lire la suite de Gérer l'espace à gauche d'une liste selon les navigateurs
(9 commentaires et trackbacks)

Un lecteur agacé me fait remarquer que les guillemets apparaissant avant et après [mes] blocs de citation (blockquote) sont particulièrement disgracieux, que je pourrais au moins utiliser des guillemets français, ou mieux, pas de guillemets du tout. En fait, ce n'est qu'un petit bug des navigateurs Gecko sur la propriété CSS clip :

Lire la suite de Des guillements inopinés dans Mozilla et FireFox
(7 commentaires et trackbacks)

Petit exemple de code final généré par le javascript de Google-Adsense :

Lire la suite de Google AdSense, ou comment générer à son insu un code invalide
(7 commentaires et trackbacks)

Premier navigateur graphique vocal du genre, Opera 7.60 (preview 1) implémente partiellement les propriétés de style oral actuellement définies par le Working Draft CSS3 Speech Module. Ceci inclut en fait :

• 4 propriétés telles qu'elles sont définies par CSS2 aural ;
• 5 propriétés reformulées en CSS3 .

Les propriétés et mots-clés issus du CSS3 Speech Module Working Draft sont identifiés par le préfixe -xv-, afin de les différencier des futures propriétés finales CSS3.

Voici une définition rapide et un exemple de chacune de ces propriétés :

Lire la suite de Les propriétés CSS orales pour Opera 7.60 preview 1
(un commentaire ou trackback)

J'utilise systématiquement l'attribut cite des éléments de citation q et blockquote pour en identifier les sources par leur URI. C'est pourquoi j'ai toujours regretté que ce lien potentiel sur ces éléments ne soit pas exploité nativement par les navigateurs actuels : cliquer sur une citation et atteindre immédiatement sa source, quoi de plus simple, pourtant ?

Heureusement, il suffit d'un petit détour par les extensions CSS d'Opera et de Mozilla-FireFox pour permettre aux utilisateurs de ces navigateurs de tirer parti de cet attribut sémantique de manière assez satisfaisante.

(Ce qui suit est en revanche sans objet dans Internet Explorer et Safari).

Lire la suite de Attribut cite: comment générer en CSS un pseudo-lien vers la source des citations
(9 commentaires et trackbacks)

Humpff... (gros soupir)

Pour la quatrième fois de la semaine, un lecteur d'OpenWeb (fort sympathique par ailleurs) me fait parvenir pour me demander de l'aide... sa feuille de style non indentée.

C'est tout simplement illisible ! Tiens, prenons celle d'OpenWeb, par exemple (qui est plutôt corpulente) et désindentons-la :

Lire la suite de Indentez vos feuilles de style !
(3 commentaires et trackbacks)