Comment puis-je garder mon site cohérente à travers les navigateurs?

Construisez votre conception pour Firefox. Firefox a toujours tenu au courant des derniers changements en CSS et tend à être stable, ce qui rend le démarrage candidat de point pour tous vos projets web. Complétez votre conception d`abord dans Firefox, puis passer à d`autres navigateurs pour vérifier les incohérences.

Travailler avec Firefox extensions de conception. Extensions vous aidera à trouver des erreurs dans le modèle d`objet de document (DOM), trouver des sélecteurs CSS appropriés et des conseils de code de numérisation pour les propriétés CSS.

Testez votre conception dans les navigateurs WebKit (Chrome / Safari). intégré de l`outil de débogage en droit d`accès Chrome, cliquez sur la page et en sélectionnant "Inspecter l`élément." Étant donné que Chrome et Safari utilisent le même moteur WebKit, vous aurez normalement seulement besoin de tester dans l`un de ces deux navigateurs, mais il est encore bon de vérifier à la fois.

Notez toutes les incohérences que vous observez dans Chrome vs Firefox. Ouvrez le côté deux navigateurs côte à côte. Si vous ne voyez pas les incohérences, procéder directement à des tests dans Internet Explorer à l`étape 8. Si des incohérences apparaissent dans Chrome, puis consultez les étapes 5, 6 et 7.

techniques CSS d`étude. Éviter ou contourner les problèmes et les incohérences du navigateur en appliquant une variété de techniques à ce problème. Apprenez ces en étudiant le travail des autres, par exemple dans les nombreux blogs en ligne consacrés à la discussion et l`enseignement des techniques de CSS. Lisez-les régulièrement, ou chercher à travers eux lorsque vous rencontrez un problème spécifique.

Ecrire un balisage structurel et de présentation CSS. Utilisez des balises HTML pour organiser la structure du document de votre page Web, mais exclusivement utiliser les CSS pour définir les propriétés de style de la page. Par exemple, ne pas utiliser des balises HTML gras, italique ou forts pour le style de votre texte. Utilisez les propriétés de police de CSS à la place.

Ajouter une feuille de style spécifique à Chrome. Seulement faire cela si vous pouvez incohérences pas correctes entre Chrome et Firefox en améliorant sur le codage de style partagé entre eux. Snippets et javascript pour stylesheets spécifiques Chrome sont disponibles en ligne.

Test dans les dernières versions d`Internet Explorer (IE). Ne vous laissez pas rebuter par problèmes-souvent, un tweak de style simple ou l`ajustement structurel du HTML est tout ce que vous devez faire. programmes de mise au point, tels que IE Tester, faciliter le processus de test dans les différentes versions de IE, ainsi que pour inspecter le code lui-même.

Créer une feuille IE spécifique. Ne pas passer trop de temps à essayer de manipuler les CSS pour créer une apparence cohérente dans IE. Il suffit de créer une nouvelle feuille de style spécifique à IE, et de modifier les sélecteurs CSS et les propriétés dont vous avez besoin. Snippets pour ajouter des feuilles de style IE à vos modèles HTML sont disponibles en ligne.

Gardez un manuel de référence CSS à proximité. Acheter un manuel de poche ou d`accéder à la documentation en ligne W3C dans une fenêtre de navigateur distincte.