Les navigateurs.

Si vous trouvez une article intéressante, vous pouvez participer à sa diffusion en utilisant les boutons de partage situés ci-dessous.

imprimer le tutoriel

Résumé de la matière Description
Internet Explorer. Internet Explorer perd de plus en plus de terrain au profit d'autres navigateurs...
Plusieurs version IE. L'installation de plusieurs versions d'Internet Explorer en parallèle...
Un CSS pour Explorer 7 et 8. Dans les faits vous aurez une feuille de style pour la mise en page global...
Commentaire conditionnel. Un commentaire conditionnel pour Internet Explorer 6...

«

»

La compatibilité des navigateurs.

Internet Explorer et les autres.

Il y a quelques années, la suprématie d'Internet Explorer (IE) ne causait que peu de maux de tête aux concepteurs. Depuis, la donne a changé. Internet Explorer perd de plus en plus de terrain au profit d'autres navigateurs plus respectueux des standards. Bien que la version 8 démontre un plus grand respect de ces standards que la version 7 et que la version 7 était une évolution très nette par rapport à la version 6, il n'en demeure pas moins qu'IE doit toujours faire l'objet de votre attention lors de la conception de votre site.

Soyez raisonnable!

Il y aura toujours une légère différence selon le navigateur utilisé, principalement entre IE et les autres. Vous devez faire preuve de compromis. Si un navigateur affiche une police plus grande par rapport à un autre, mais que le rendu respecte globalement votre mise en page, félicitations. Gardez à l'esprit que si vous comparez votre site avec différents navigateurs le visiteur ne le fait pas, vous êtes donc le seul à savoir ces petites différences.

Plusieurs versions Internet Explorer

Attention: l'installation de plusieurs versions d'Internet Explorer en parallèle sur un même système peut poser un problème: dans certains cas, toutes les versions d'IE interprèteront les commentaires conditionnels comme si elles étaient la version d'IE la plus récente parmi celles installées.

Voici deux programmes qui pourront vous aidez.

Avec Multiple IE vous aurez toutes les versions accessibles sur la barre de lancement rapide. Je préfère IETester qui est un petit programme sur lequel vous n'avez qu'à entrer l'URL de votre site et choisir les versions d'Explorer que vous voulez tester.

Les instructions conditionnelles pour Internet Explorer 7 et 8.

Depuis la version 7, IE s'est grandement améliorer, mais reste toujours problématique (personnellement, je ne tiens plus compte des versions antérieures à la version 7 - Si une personne a accès à internet, elle peut et doit mettre son navigateur à jour. C'est une question de sécurité et afin de corriger plusieurs « bogues ». Ceci est valable pour tous les navigateurs). Pour pallier ces manquements, nous allons utiliser une instruction conditionnelle reconnue uniquement par Internet Explorer.

 

Un « bog » ou « bogue » (insecte) est un terme qui vient des problèmes que causait un insecte lorsqu'il se brulait sur une lampe et retombait sur les transistors de ces anciens ordinateurs, ces espèces de calculatrice d'une tonne des années 50, pour causer un court-circuit. Aujourd'hui, ce terme exprime un défaut de conception d'un programme à l'origine d'un dysfonctionnement et les navigateurs ne font pas exception.

Un CSS pour Explorer 7 et 8

Dans les faits vous aurez une feuille de style pour la mise en page global, une autre, qui ne comportera que les correctifs pour Internet Explorer 7 et une autre pour Internet Explorer 8. L'avantage de cette méthode est qu'elle permet un rendu plus uniformisé de votre site entre les navigateurs. S'il y a un problème, vous saurez exactement sur quelle page CSS apporter vos correctifs.

Insérer entre <head> et </head>.


1
2
3
 

<style type="text/css" media="screen">@import url(global.css);</style>
<!--[if IE 7]><style type="text/css" media="screen">@import url(ie-7-global.css);</style><![endif]-->
<!--[if IE 8]><style type="text/css" media="screen">@import url(ie-8-global.css);</style><![endif]-->

Remarquez que les deux instructions conditionnelles pour Explorer sont après la feuille de style global. Explorer lit d’abord global.css puis apporte les correctifs selon sa version.

Un commentaire conditionnel pour Internet Explorer 6

Vous avez travaillé fort pour uniformiser le rendu de vos pages pour IE-7 et IE-8, mais que faire si un visiteur utilise toujours IE 6 ? Vous pouvez l'encourager à mettre sa version d'Explorer à jour, par exemple :


1
2
3
4
 

<!--[if lte IE 6]>
 <h3 class="old-ie">Vous utilisez une ancienne version Internet Explorer. Ce site est optimisé pour les versions 7 et 8<br />
 Pour une question de sécurité, je vous recommande une mise à jour immédiate de votre navigateur.</h3>
<![endif]-->

Dans le CSS


1
2
3
4
 

.old-ie{
text-align:center;
color:red
}

Ce commentaire ne sera affiché à l'écran que si le visiteur à une version 6 d'Explorer ou plus ancienne.

 

«

»

LE CONCEPTEUR DE SITE WEB.com

Pour un site professionnel

Téléphone 514 363-4169
Courriel serge@leconcepteur.ca