Standards de largeur de site

Il est aujourd’hui difficile de décider d’un format d’écran puisque beaucoup d’appareils différents occupent les rapports de ventes des marchands de produits informatiques ; Du gigantesque écran d’ordinateur de bureau aux écrans d’appareils mobiles en passant par la panoplie de netbook, ultrabook etc…

Les bananes avec les bananes

Pour éviter de mélanger les pommes avec les bananes, cet exercice se limitera à calculer une norme de largeur pour les fureteurs “standards”. Cet à dire, en language CSS, aux médias de type screen. Donc les ordinateurs de bureaux et les ordinateurs portables (incluant les netbook) qui utilisent un système d’opération grand public tels que Windows (XP, Vista, 7), Mac OS X ou Linux.

Les contraintes

Voici une liste des contraintes que j’ai considérée pour décider du format final :

1. Les statistiques compilées par Google Analytics des résolutions d’écrans des visiteurs de mon site ; Soit 1024 x 768 et 1280 x 1024.
2. La largeur de l’interface du fureteur moderne qui gruge le plus de pixels dans la fenêtre du viewport ; Mozilla Firefox version 3.5 pour Windows XP. Ce fureteur  nécessite 4 pixels à gauche et 21 pixels pour sa barre de défilement (scrollbar) à droite, donc un total de 25 pixels de largeur.
3. La dimension doit être un nombre paire pour permettre un alignement horizontal parfait.
4. La dimension doit être divisible par des valeurs paires et impaires pour laisser un maximum de flexibilité au designer pour décider de la grille graphique (sub-division en colonnes avec des marges) qui convient le mieux au style de ses maquettes.

Les standards finaux sont …

• 996 pixels pour un écran de 1024 x 768.
• 1248 pixels pour les écrans de 1280 x 1024.