Voici donc la solution ultime pour vos applications et sites Web. Plus de 100 000 icones sur une seule et même page Web… c’est fou ! Par contre, forcément, la page met un peu de temps à se charger.

Source : http://www.iconfinder.net/ultimate

En savoir plus :

1. Le SP2 (service pack 2) de Windows Vista enfin disponible Encore un billet qui s’éloigne du web et du webmastering,...
2. Le plein d’icones Web 2.0 pour vos sites Voici juste un petit billet pour vous présenter deux ressources...
3. Thèmes WordPress E-Commerce Pour rester dans la continuité de mon dernier billet vous...

Comme beaucoup le savent, chaque navigateur embarque son propre moteur de rendu graphique et cela engendre des différences au niveau de l’affichage pour un même site selon le navigateur utilisé et sa version. Pour un webmaster, est-il impératif de rendre ses sites compatibles avec tous ces logiciels ?

C’est une bonne question à laquelle, je ne serai répondre pour vous. Tout dépendra en effet de votre site Internet, de sa complexité, de vos connaissances des standards et compétences en CSS, (x)HTML, Javascript… mais également de votre cible de visiteurs. Quel intérêt de rendre son site compatible Safari, s’il ne sert qu’à partager des photos avec des proches qui utilisent tous Internet Explorer ? La problématique inverse se pose si vous souhaitez développer un site sur les Mac et que votre site Internet n’est pas compatible Safari ou Opera…

Internet Explorer et Mozilla Firefox

Bref, dans la plupart des cas, et c’est la politique que j’adopte pour mes sites, je pense qu’il est nécessaire de maintenir son site pour les versions 6&7 de Internet Explorer et la version 3 de Firefox. Au regard de l’étude réalisée par Xitimonitor courant décembre 2008, on remarque que ces trois navigateurs représentent près de 90% des visites sur Internet, réparties de la façon suivante :

• 36,3% pour Internet Explorer 7
• 23,6% pour Firefox 3
• 23,2% pour Internet Explorer 6
• 7,5% pour Firefox 2

Les rendus des moteurs de Firefox 2 et 3 étant très proches, les tests sur Firefox 3 suffisent généralement pour valider le fonctionnement sur ces deux navigateurs. En revanche pour Internet Explorer, des tests s’imposent pour les deux versions, car elles diffèrent plus l’une de l’autre. Le respect de ces navigateurs vous permet donc d’être compatible avec au moins 91% des utilisateurs d’Internet à l’heure actuelle.

L’avenir d’Internet Explorer 6

Cependant, comme le montre l’étude marketshare.hitslink.com, la version 6 d’Internet Explorer est en pleine perte de vitesse au profit de sa version 7 mais également au profit de Firefox. D’ici peu de temps, il ne devrait plus être utile de valider le bon fonctionnement de ses sites sous IE6, qui par ailleurs souffre d’importantes lacunes, l’une des plus connues, étant la non gestion de la transparence des images au format PNG.

J’ai, en partie, arrêter de rendre mes sites 100% compatibles avec Internet Explorer 6, tout du moins pour ce qui concerne l’utilisation des formats PNG. Si vous naviguez avec Internet Explorer 6, vous pourrez le remarquez grâce aux deux images PNG en haut à droite de ce blog (Twitter et RSS), dont le fond, théoriquement transparent, vous apparait gris.

Et vous, sur quels navigateurs testez-vous vos sites ?

Sources :

• Xitimonitor.com
• marketshare.hitslink.com

En savoir plus :

1. Outils de tests multi-navigateurs Suite à un article paru récemment sur ce blog concernant...
2. Extensions Firefox pour vos développements web 2.0 Je ne sais pas pour vous, mais personnellement, je réalise...
3. Exécution Javascript sur le chargement d’une page Comment exécuter plusieurs scripts Javascript au chargement d’une page ?...

<a href="http://www.loicmorvan.fr" style="font-weight:bold;"><b>LoicMorvan</b></a>
ou
<a href="http://www.loicmorvan.fr"><b>LoicMorvan</b></a>.

Ce n’est pas bien grave, car le résultat final sera identique, mais lorsque vous le pouvez, privilégiez l’utilisation de classes et identifiants CSS, dont les attributs de rendu graphique seront rapatriés dans un ou plusieurs fichiers CSS séparés du code.

<a href="http://www.loicmorvan.fr" class="gras">LoicMorvan</a>
et dans votre feuille de styles CSS
.gras{font-weight:bold;}.

Cela paraît anodin comme différence mais beaucoup de choses en découlent.

• premièrement, vous pourrez réutilisez les styles prédéfinis dans votre feuille de styles sur d’autres éléments des vos pages de votre site Internet.
• deuxièmement, lors d’une mise à jour de votre site Internet, tous vos styles seront concentrés dans votre ou vos feuilles de styles, et la modification vous évitera ainsi de devoir parcourir tout votre code pour retrouver les différents styles embarqués.

Un point important par rapport au CSS est également la proscription de l’utilisation des tables HTML pour la mise en forme de données non tabulaires. En effet, avec l’utilisation de tables HTML, votre structure de page sera figée alors que si vous aviez utilisé des feuilles de styles CSS, un ajustement des propriétés de celles-ci vous permettrait de remodeler aisément votre page.

L’utilisation des feuilles de styles peut aller beaucoup plus loin que l’exemple ci-dessus. C’est ce que vous pourrez découvrir sur le site CSS Zen Garden, où il existe de nombreuses pages développées à partir du même code HTML et où, seule la feuille de styles CSS change. Vous pourrez alors constater que toutes ces pages n’ont, d’un point de vue visuel, strictement rien à voir entre elles.

Pour votre prochain site Internet, pensez un minimum au CSS, il vous simplifiera la vie

Liens :
CSS Zen Garden
Annuaire des styles CSS Zen Garden

En savoir plus :

1. Design et support des navigateurs… Actuellement, et heureusement, car c’est la concurrence qui fait progresser...
2. Extensions Firefox pour vos développements web 2.0 Je ne sais pas pour vous, mais personnellement, je réalise...
3. Générateur de thèmes WordPress Vous ne savez pas par où débuter pour créer un...