Au début tout était dans le HTML. Puis le W3C vint, et mis chaque chose à sa place : le HTML pour la structure, le CSS pour la présentation et les Scripts pour les actions.

Mais, alors qu'on en était encore à la première Guerre du Web et alors que le standard CSS1 n'était pas encore finalisé, des petits rigolos ont commencé à créer leurs propres propriétés CSS, que bien évidemment, ils étaient les seuls à implémenter. Par exemple les propriétés CSS zoom, filter ou expression, qui n'appartiennent qu'à MSIE dans l'espoir de les imposer.

C'est dans cette idée que fut proposé les préfixes par développeurs. La première forme implémentée par Microsoft (il faut encore une fois louer leur précipitation :) commençait par mso-. Gros souci de lisibilité et de risque de collision. Vous imaginez si un navigateur se serait appelé “border” ? C'est afin d'éviter cette ambiguïté et pour faciliter le travail des logiciels d'analyses que ces préfixes doivent commencer par un tiret, comme -moz- ou -ms- (voyez sitepoint pour une petite liste). Et bien évidemment, le préfixe dicte quel navigateur est concerné par cette propriété. Les autres l'ignoreront superbement.

L'un des exemples, c'est l'usage des colonnes CSS sur ce blog depuis 2007. Firefox a stabilisé cette propriété depuis la version 2.0 et Safari depuis la 3.0. Problème, l'activation dans les CSS se fait toujours accompagné des préfixes vendeurs, rappelant leur caractère purement expérimentale et non-définitivement normée.
Le problème ne vient pas des autres navigateurs (ils assument plus tard s'ils mettent du temps à le programmer), mais du retard des prises de décision du groupe de travail CSS au W3C. Plusieurs entreprises, associations, organisations, organismes interviennent et les CSS ne servent pas uniquement pour le rendu des sites webs sur les ordinateurs : Les CSS peuvent servir pour les téléphones portables, les décodeurs TV, les synthèses vocales, l'impression de documents, etc... C'est cette complexité et cette universalité qui font que toute décision doit être soigneusement discutée. Un autre problème vient aussi du fait que le standard CSS n'est pas validée par propriétés, mais par versions. Deux fronts sont menés à la fois au sein du CSS-WG : les versions 2.1 et 3.0 du standard.
C'est pour ça que nombre de propriétés sont parfaitement implémentées par tous les grands navigateurs (je parle des versions modernes, hein...), mais que leur écriture dans les CSS restent condamnées depuis 5 ans au purgatoire de ces infâmants préfixes expérimentaux.
Pour une durée de peine indéterminée...

Où l'on cherche qui joindre à ce sujet

Arrivé à ce point, il faut que je vous parle de Daniel Glazman. Ce mec est un dieu vivant vénéré par des hordes de mozillistes dont moi. Fondateur de Disruptive Innovations, on lui doit l'un des premiers éditeurs Wysiwyg de qualité en rendus standards (N|vu), d'une extension Firefox qui permet d'enregistrer sur sa Freebox en restant au bureau et un parseur de CSS en Javacript (JSCSS). Il est actuellement co-chairman du groupe de travail sur les CSS au W3C.
Daniel Glazman a un site web dont l'accueil est tout aussi austère qu'il est lui-même doué.

Or, c'est justement en écrivant son projet JSCSS qu'il jurait de plus en plus sur les préfixes vendeurs des CSS. Au point d'avoir lancé un sondage.

Ouais, parce que c'est bien beau, mais on s'y perd un peu

Disons que vous voulez mettre en place une propriété qui est en cours de discussion au sein du CSS-WG, mais déjà appliquée par certains navigateurs. Et vous avez pas envie de rater la marée parce qu'elle est vraiment trop belle. Par exemple, la propriété box-shadow. Voici comment la plupart des web-(designer|développeur|intégrateur)s vont l'appliquer dans leur CSS :

	-moz-box-shadow: #f00 0 0px 2px;
	-webkit-box-shadow: #f00 0 0px 2px;

Et là, vous voyez immédiatement qu'il y a un problème puisqu'on a inconsciemment oublié au moins deux navigateurs phares : Opera et MSIE (si! si! l'espoir fait vivre). En fait, il aurait fallut écrire :

	-moz-box-shadow: #f00 0 0px 2px;
	-webkit-box-shadow: #f00 0 0px 2px;
	-o-box-shadow: #f00 0 0px 2px;
	-ms-box-shadow: #f00 0 0px 2px;
	-khtml-box-shadow: #f00 0 0px 2px;

Autre inconvénient, cela fait des lignes de codes démultipliées pour chaque propriété expérimentale dans chaque élément qui l'utilise. Et au moment de l'intégration officielle de la propriété dans le standard CSS, ces lignes seront à remplacer par la propriété officielle puisque les navigateurs auront retiré de leurs parseurs la version avec leur préfixe de test. Car dans 5 ans, vous aurez toutes les chances d'avoir à remplacer le précédent exemple par :

	box-shadow: #f00 0 0px 2px;

(Et pour les vieux navigateurs qui tardent à se renouveler, hein... y'en a marre des boulets)

Ici, je souffle timidement une solution

De : (moi)
À : Daniel Glazman
Sujet : J'y ai réfléchi à ton problème de préfixes expérimentaux dans les css

Et oui, finalement ça m'a taraudé : comment le plus avoir la soupe à la grimace dans les css sur les préfixes. [...]

Pourquoi ne pas introduire en alias un préfixe constructeur « -*- » (ou sinon utiliser dans le style très unixien « -- » si jamais l'étoile gène) Ça donnerait ceci :

	-*-box-shadow: #f00 0 0px 2px;

Du coup, on ne supprime pas l'accès aux paramètres expérimentaux de chaque constructeur si chacun fait à sa sauce (genre Apple veut tester le paramètre -odor- et ne propose que les parfums fruits, tandis que mozilla propose que les parfums musqués, mais avec les paramètres raccourcis inversés)

On allège considérablement nos feuilles de styles. Si MSIE décide de tenter la danse, on est pas obligé de rajouter une ligne spécifique, et on garde toujours la possibilité d'y accéder.

Alors oui, je sais, c'est pas ta problématique. La tienne concerne plus la suppression définitive des préfixes pour alléger le parsing des CSS. Mais au moins, on aurait la paix à moyen terme...

De : Daniel Glazman

C'est pas con du tout. Tu devrais poster ça en anglais dans www-style...

Dont acte. (voir ici)

De : Moi
À : www-style@
Sujet : Suggestion for generic CSS vendor prefix

I wrote this by recommendation from Daniel Glazman. I hope you will excuse my French : this is the first time I do this kind of contribution.

Problem :

Lot of properties are still in the infancy of the validation, other ones are waiting for the definitive approval of the CSS standard 2.1 or 3. So if you want to use an experimental property, each declaration should have the vendor prefix, with all the problems :

-moz-box-shadow: #f00 0 0px 2px;
-webkit-box-shadow: #f00 0 0px 2px;

Here, you can see that I completely forgot browsers like MSIE, Opera or Konqueror. A more complete example would be :

-moz-box-shadow: #f00 0 0px 2px;
-webkit-box-shadow: #f00 0 0px 2px;
-opera-box-shadow: #f00 0 0px 2px;
-ms-box-shadow: #f00 0 0px 2px;
-khtml-box-shadow: #f00 0 0px 2px;

But if I wish to write my own browser and implement those properties, my browser will always be forgotten wy CSS writers.
The other problems is the bloating of the CSS for every declaration, and stability in the future.

Proposal :

Using a wildcard like a star to explain that the experimental property is common to every browser that can understand it :

-*-box-shadow: #f00 0 0px 2px;

If the star is a problem to parse, another suggestion is to prefix with two hyphens, a little bit like an unix parameter :

--box-shadow: #f00 0 0px 2px;

Main advantage is browser neutrality, simplicity in the CSS and portability. And we can still target a kind of browser by its vendor-prefix.

Thank you for reading me.