Aux premiers temps du Web, tout était facile.
Tous les écrans étaient en 800*600, on n’avait pas vraiment besoin de se poser la question de la largeur du site web. 

Aujourd’hui la norme est plutôt de 1024 pixels de large (mais pas au Maroc), mais certains écrans peuvent être beaucoup plus larges.
Je travaille sur un écran de 1280 pixels, et j’ai parfois vu passer dans les stats de visite de mes sites des écrans de 1.600 pixels de large. 

Un site de 800 pixels de large dans une page de 1600 sera totalement perdu. 

Et c’est le cas de la plupart des sites en flash, où je vois plus de fonds monochrome que d’informations ;

Une mise en page fluide est plus difficile à réaliser techniquement, mais elle s’adapte à la taille de l’écran de l’internaute.
Elle n’est pas toujours possible, par exemple dans ce cas, l’image de fonds en bas de l’écran, et l’encadrement rendent impossibles l’élargissement de la zone écran. En revanche, ici le site occupera toute la place sur l’écran jusqu’à 1200 pixels. 

Dans le cas d’une mise en page fluide, il est important de vérifier l’apparence de votre site aux trois largeurs les plus fréquentes : 800, 1024 et 1280 pixels de large. 

Au delà, j’empêche le site de s’élargir plus, car les textes trop larges sont difficiles à lire.
Et je n’oublie pas de le centrer.
Rien de plus désagréable qu’un site calé à gauche, avec un grand espace vide sur la droite. 

Une fois encore, c’est le site qui s’adapte aux souhaits de l’utilisateur, et pas l’inverse.

Parcourir la sériePrécédent articleProchain article

2 commentaires

  1. melodie Auteur juin 18, 2009 (2:25 )

    Bonjour,

    Depuis fin 2007, les moteurs et les options des navigateurs Firefox, Opera, et IE ont changé. Les pages sont maintenant fixes, ou fluides, en fonction de réglages présents dans les menus. Je ne connais pas trop Opera et IE, bien que je vienne de les essayer, pour voir l’effet sur plusieurs skins à largeur fluides. 

    J’ai été surprise de voir la différence entre ce que j’attendais et ce que j’ai vu, et entre autres, pour conserver une largeur fixe, tout en maîtrisant le réglage de la taille des caractères, il y a dans Firefox 3.0.11, autant sous GNU/Linux que sous Windows (XP), le menu « Affichage>zoom>zoom du texte seulement ». Si on ne l’active pas, la largeur de la page est relative à la taille des caractères, ce qui n’est pas forcément très heureux visuellement.

    J’en profite : merci pour ces divers articles (ainsi que pour votre aide à mes questions ponctuelles sur le forum wp-fr).

    Bonne journée,
    Mélodie

    Répondre à melodie
  2. Bonjour,

    merci pour votre passage. Pour clairifer, il y a deux choses : une mise en page fixe ou fluide, qui est déterminée dans la mise en page du site, et que le navigateur ne peut pas modifier (sauf à utiliser des extensions comme Firebug), et le fait que les fonctions de zoom permettent de zoomer sur la totalité des éléments de la page (images et texte) ou seulement sur le texte, comme vous le signaler. 

    Une mise en page fluide ce n’est pas ça, c’est, à taille de caractère constant, occuper ou pas toute la largeur disponible de la fenêtre du navigateur. Ainsi ce site a une mise en page fixe, car si vous allez voir dans la feuille de style, la largeur des colonnes est exprimée en pixels.
    A taille de pixels égale (donc sans zom), un écran avec plus de pixels (plus large) verra une zone blanche plus importante.
    Dans une mise en page fluide, une ou plusieurs des colonnes s’élargirait pour prendre l’espace disponible.

    Répondre à Marie-Aude

Commenter

*Informations requises Merci de donner les informations requises

  • Pas de liens raccourcis
  • L'auteur doit s'identifier avec son pseudo, son nom, son prénom ou s'il le veut le nom de son entreprise ou de son site, sauf si celui-ci correspond à des mots clés. Toutes les combinaisons sont permises dans ce cadre.
  • L'url peut être celle d'un site ou profil de réseau social, uniquement la page d'accueil
  • Pas d'adresse email jetable

*

*