Si vous êtes déve­lop­peur ou desi­gner web, vous n’êtes pas sans savoir q’In­ter­net Explo­rer 8 est sor­ti récem­ment ; cette nou­velle ver­sion a été bien accueillie par les acteurs du web pour saluer l’ef­fort qu’à pro­duit Micro$soft pour sor­tir un navi­ga­teur qui res­pecte les normes conçues par la W3C (Micro$oft à juste 8 ans de retard sur ses concur­rents, de la part de la plus grosse entre­prise d’in­for­ma­tique du monde, ça m’en bouche un coin), m’en­fin, comme aurait dit Gaston…

Tou­jours est-il que IE8 nous arrive avec un double moteur sous le capot. En effet pen­dant des années nous autres desi­gner avons lut­ter et bra­ver les inco­hé­rences de ren­du d’IE ; mais pis encore, des indé­li­cats on conçut des sites qui ne sont cor­rec­te­ment consul­tables QUE par IE7 (cas très répan­due dans les intra­nets d’en­tre­prises et d’administrations).

Donc pour « ne pas cas­ser le Web » les déve­lop­peurs de la ver­sion 8 on inclut à côté du nou­veau moteur d’in­ter­pré­ta­tion HTML, l’an­cien d’IE7 (mais par défaut, c’est bien le nou­veau moteur qui est uti­li­sé) et une pos­si­bi­li­té de pas­ser de l’un à l’autre assez sim­ple­ment (comme quoi à Red­mond on peut faire des choses simples !).

Le méca­nisme mis à dis­po­si­tion repose sur l’u­ti­li­sa­tion d’élé­ment d’en-tête dis­po­sé soit dans la requête HTTP soit dans les balises méta. La direc­tive dite « X-UA-Compatible » pos­sède la syn­taxe suivante :

en requête HTTP :
Header set X-UA-Compatible "IE=8"
ou dans les métas :
<meta http-equiv="X-UA-Compatible" content="IE=8" />

Si on spé­ci­fie IE=8 c’est le nou­veau moteur qui est uti­li­sé, si on uti­lise IE=EmulateIE7 c’est l’an­cien moteur qui sera uti­li­sé. Micro$soft à indi­qué que ce méca­nisme sera implé­men­té dans les futurs ver­sions d’IE, il existe d’ailleurs une direc­tive IE=Edge qui indique que c’est le moteur le plus récent qui doit être uti­li­sé (au cas où sor­ti­rait un IE9 encore meilleur…).

Par ailleurs, si aucune direc­tive n’est pré­sente dans le code de la page, alors IE8 fera appa­raître dans la barre d’ou­til une icône per­met­tant de bas­cu­ler l’af­fi­chage en mode « IE7 ». Il existe aus­si une « liste noire » qui peut être télé­char­gée ici, cette liste après ins­tal­la­tion per­met à IE8 de bas­cu­ler auto­ma­ti­que­ment vers le mode IE7 si vous navi­guez sur l’un des 2400 domaine qu’elle contient. À noter aus­si, et c’est très impor­tant, que les en-têtes (HTTP ou méta) ne fonc­tionnent cor­rec­te­ment que si la page pos­sède un DOCTYPE (je vous ren­vois à l’ex­cel­lente tra­duc­tion d’un article de Jef­frey Zeld­man sur Pompage.net).

Tout cela parait presque par­fait ; mais il fau­dra cepen­dant faire atten­tion à quelques petites choses, car la logique de la bas­cule entre mode IE8 et IE7 peut être légè­re­ment modi­fiée en fonc­tion du contexte :

• par défaut, IE8 uti­lise le moteur IE8 (que j’ap­pel­le­rais doré­na­vant standard),
• si une page est conte­nue dans la liste noire des domaines devant être ren­du en mode IE7, alors c’est le moteur IE7 qui est utilisé,
• si l’in­ter­naute appuie sur le bou­ton de com­pa­ti­bi­li­té IE7 alors qu’il navigue dans un domaine bla­ck­lis­té, alors c’est le mode IE7 qui est utilisé,
• si la page pré­cise X-UA-Compatible IE=EmulateIE7, le bou­ton de com­pa­ti­bi­li­té est caché et le moteur IE7 est utilisé
• si la page pré­cise X-UA-Compatible IE = EmulateIE7 via la balise méta mais que dans le code de la page une balise <script> est uti­li­sé avant la balise meta en ques­tion ; alors c’est le moteur stan­dard qui est utilisé,
• si la page spé­ci­fie X-UA-Compatible IE = 8 via l’en-tête HTTP et X-UA-Compatible IE = EmulateIE7 via la balise méta alors c’est cette der­nière direc­tive qui pré­vaut et c’est le moteur IE7 qui sera utilisé,
• si votre site est consul­té « au tra­vers » d’autres sites bla­ck­lis­tés (comme le sont Google Images ou la Digg­bar) alors votre site sera visua­li­sé en mode IE7.

En défi­ni­tive, il est tout à fait pos­sible de ren­con­trer IE8 envoyant de la chaîne User Agent IE7
au ser­veur en uti­li­sant le mode Stan­dards IE8 moteur de ren­du et inver­se­ment. ce qui peut poser des pro­blèmes si vous avez uti­li­sez une feuille de styles spé­ci­fique à une ou plu­sieurs ver­sion d’IE en uti­li­sant les com­men­taires conditionnels…
Donc nous ver­rons donc dans un pro­chain article, com­ment remettre les chose à plat proprement.

Note : cet article est une tra­duc­tion libre d’un article écrit par Faruk Ate? sur son blog