Testez votre navigateur

Les webmestres savent bien que l'interprétation de leurs pages diffère selon le navigateur utilisé. Une série de tests permettra de vous donner une idée de la qualité de l'affichage de votre navigateur.

1. Les caractères spéciaux

   • La table de caractères d'Europe de l'Ouest

     Test d'affichage des caractères d'Europe de l'Ouest

   • Les tables de caractères Unicode

     Test d'affichage des caractères Unicode

2. Les feuilles de styles

   • Prise en charche des différents styles

     • Barré, ligne supérieure et souligné

       Ceci est un exemple de line-through, de overline et de underline dans une ligne sans exposant ni indice

       A. Ceci est un exemple de line-through avec texte normal, ^exposant et _indice. B. Ceci est un exemple de line-through avec ^exposant et _indice

       A. Ceci est un exemple de overline avec texte normal, ^exposant et _indice B. Ceci est un exemple de overline avec ^exposant et _indice

       A. Ceci est un exemple de underline avec texte normal, ^exposant et _indice B. Ceci est un exemple de underline avec ^exposant et _indice

     • Description témoin

       Sur la première ligne, un trait horizontal uni devrait passer environ à mi-chemin entre la ligne de base et l'œil des lettres (correspondant respectivement au bas et au haut d'une lettre x minuscule) pour « line-through », non loin au dessus du sommet des lettres du texte pour « overline », et non loin au-dessous de la ligne de base pour « underline ».
       Sur la partie A des lignes suivantes, les traits horizontaux devraient être situés similairement, en tenant compte de la position verticale du texte ; pour chaque « texte normal », la distance du trait horizontal par rapport à la ligne de base doit être la même pour que pour le texte de la première ligne correspondant.
       Sur la partie B de ces lignes, un trait horizontal uni devrait passer à la hauteur du trait de la partie A correspondant à « texte normal » pour la première ligne, à « exposant » pour la deuxième ligne, et à « indice » pour la troisième ligne.

     Test des feuilles de styles CSS 2 complet

   • Feuilles de styles alternatives

     • Utilisation de la balise <link>, pointant vers des feuilles de styles liées et des feuilles de style alternatives

       Si votre navigateur gère convenablement les feuilles de styles, ce texte doit apparaitre en retrait par rapport au bord gauche de la page, avec une indentation supplémentaire pour la première ligne et en rouge. De plus vous devriez pouvoir, à la place du style de base de la page, affichant le texte sans mise en forme supplémentaire, choisir entre Feuille de styles 1, affichant le texte en petites majuscules, et Feuille de styles 2, affichant le texte avec une police sans empattements et en italique, par un réglage de style dans le menu Présentation ou Affichage de votre navigateur.

     • Affichages témoins

       Si votre navigateur gère convenablement les feuilles de styles, ce texte doit apparaitre en retrait par rapport au bord gauche de la page, avec une indentation supplémentaire pour la première ligne et en rouge. De plus vous devriez pouvoir, à la place du style de base de la page, affichant le texte sans mise en forme supplémentaire, choisir entre Feuille de styles 1, affichant le texte en petites majuscules, et Feuille de styles 2, affichant le texte avec une police sans empattements et en italique, par un réglage de style dans le menu Présentation ou Affichage de votre navigateur.

       Si votre navigateur gère convenablement les feuilles de styles, ce texte doit apparaitre en retrait par rapport au bord gauche de la page, avec une indentation supplémentaire pour la première ligne et en rouge. De plus vous devriez pouvoir, à la place du style de base de la page, affichant le texte sans mise en forme supplémentaire, choisir entre Feuille de styles 1, affichant le texte en petites majuscules, et Feuille de styles 2, affichant le texte avec une police sans empattements et en italique, par un réglage de style dans le menu Présentation ou Affichage de votre navigateur.

       Si votre navigateur gère convenablement les feuilles de styles, ce texte doit apparaitre en retrait par rapport au bord gauche de la page, avec une indentation supplémentaire pour la première ligne et en rouge. De plus vous devriez pouvoir, à la place du style de base de la page, affichant le texte sans mise en forme supplémentaire, choisir entre Feuille de styles 1, affichant le texte en petites majuscules, et Feuille de styles 2, affichant le texte avec une police sans empattements et en italique, par un réglage de style dans le menu Présentation ou Affichage de votre navigateur.

3. Les images

   • disponibles

     Si votre navigateur prend bien en compte les images, l'affichage des quatre séries d'images formant chacune le mot « bien » devraient être identiques à l'affichage témoin, et comporter un effet d'ombré animé. La sychronisation de l'effet d'ombré n'a pas un caractère obligatoire, mais est préférable.

     • Utilisation de la balise <object>, avec spécification de la taille de l'image

     • Affichage témoin :

       

   • manquantes

     • Utilisation de la balise <object>, sans spécification de la taille des images

     • Utilisation de la balise <object>, avec spécification de la taille des images

     • Affichage témoin

       PARFAIT

   Test des images complet

4. Les tableaux

   Voici des séries de tableaux normalement identiques les uns aux autres à l'affichage. Pour chacune d'entre elles, le tableau ayant le plus de chances de s'afficher correctement est placé en dernier.

   [En construction]

5. Le rechargement de la page courante

   Actualisez le contenu de cette page avant de lire la phrase suivante. Certains navigateurs reviennent alors en début de page, tandis que d'autres réaffichent la partie de la page que l'utilisateur était en train de consulter. À vous de juger de l'aspect pratique du phénomène. Reprenez ce paragraphe depuis le début au besoin.