Avec les années la taille des écrans augmente, mais pas nécessairement celle de la surface d’affichage utile. Comprenez par là que si les résolutions d’écrans supérieures à 1024 px sont majoritaires (plus de 55% d’après le W3 Counter), les utilisateurs n’exploitent pas forcément la totalité de l’espace disponible. Résultat : la norme est indiscutablement de faire des mises en page de 1024 px de large (en fait 1005 px quand on tient compte de la barre de défilement vertica  le).

Problème : Comment faire pour afficher un maximum de choses dans la limite de visibilité (sans scroll de la page) ?

Solutions : 8 Layout Solutions To Improve Your Designs.

Dans ce très bon article, l’auteur nous livre ainsi différentes techniques pour virtuellement gagner de la place en jouant notamment sur les couches (layers en anglais) et sur une interface plus dynamique (entre autre) :

• Les carrousels et bandeaux défilants (ex. : Coda)
• Les onglets intérieurs (ex. : Fontecase)

• Les fenêtres modales (ex. : KissMetrics)

• Le roll-over qui affiche un panneau de contenu (ex. : Miro)
• La mise en page progressive qui fait apparaître le contenu au fur et à mesure des clics (ex. : Sursly)
• Les grilles de lecture marquée qui autorisent une très grande densité d’information sur une seule page tout en assurant une bonne lisibilité (ex. : Neutron Creations)
• Les accordéons (ex. : Alex Cohaniuc)

• Les menus sur-dimensionnés (ex. Porsche)

Voici donc une très belle collection d’exemples de ces différentes techniques permettant d’augmenter virtuellement le nombre de pixels.