Alternative CSS3 pour IE

CSS3 est un tel changement pour la construction de page Web et de designs ergonomiques que son apport sur les navigateurs modernes ne cessent d’être retranscrit en JavaScript sur les (le ?) navigateurs plus anciens.
La solution que je vous présente aujourd’hui se nomme CSS3pie – alternative pour IE donc – qui, testée sur un site en production, puis sur quelques pages perso, semble être plutôt performant.

Performant est peut-être un gros mot ici, en effet il s’agit pour cette méthode de passer par un fichier .htc qui est exécuté à chaque fois que l’on fait un appel au fichier, à savoir donc, à chaque élément stylé grâce à CSS3 et que l’on souhaite voir apparaitre sous IE.

Les plus

• Profitez un maximum des possibilités offertes par CSS3 sans vous soucier d’Internet Explorer… enfin presque, il s’agira bien souvent de rajouter deux lignes de codes comme sur cet exemple :

  element {
     -pie-background: linear-gradient(#ffffff, #000000);
     behavior: url(js/PIE.htc);
  }

  Dans certain cas comme les border-radius la ligne behavior suffira.
  Pour plus d’informations à ce sujet je vous invite à visiter le site officiel sur cette page :
  Fonctionnalité et usage de CSS3pie

• Cette alternative est fonctionnelle pour IE6 à IE8, donc pas de souci pour les très très vieux !
• Un excellent support puisqu’il y a de nombreuses mises à jour, un suivi sur Twitter, un forum et un blog.

Les moins

• La nature même de cette solution (.htc) qui est, à ma connaissance, un programme JavaScript exécuté à chaque occurrence de l’appel du fichier.
• Certains bogues rencontrés lors de l’utilisation de la bibliothèque jQuery en production (sous IE), des affichages qui partent en cacahuètes, des éléments qui disparaissent. Mais ces soucis semblent s’estomper au fil des mises à jour.

Une solution à tester donc. Pour ma part, malgré quelques réticences au début je pense que cela peut être une excellente solution pour simplifier bien des démarches d’intégrations…

Bonux

La petite source bien pratique pour vérifier ce qui marche sur votre navigateur :
Tester la prise en charge des CSS3 par votre navigateur
Merci à Simon pour l’info !

Un très bon article de Raphaël au sujet de ces alternatives sur Alsacréations :
Utiliser CSS3 aujourd’hui, outils et ressources

Bonne application !