Colonne 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam accumsan aliquam sem sed fringilla. Vivamus consequat purus est, ac luctus augue pretium elementum. Phasellus ultrices nunc vitae orci blandit, a vulputate erat tristique. Pellentesque gravida convallis nulla sed commodo. Integer id sagittis nibh. Aliquam a porttitor tortor, vitae venenatis nunc. Aliquam erat volutpat. Suspendisse tempus semper finibus. Vivamus pretium mattis neque, quis sollicitudin ligula fringilla eu. Phasellus blandit tempor tellus id sodales. Etiam et nibh est. Aenean sed mi euismod, aliquet lorem feugiat, luctus odio. Ut laoreet mi in metus porttitor fringilla.

Sed quis fringilla urna. Etiam non nisl vel dolor ullamcorper posuere. Aliquam tortor erat, consequat a elit sit amet, mollis laoreet est. Duis non luctus arcu. Mauris finibus id ante in suscipit. Vivamus scelerisque non sapien vel malesuada. Donec condimentum orci at metus sagittis, et maximus sem feugiat.

Duis eget libero sem. Pellentesque at sem tristique, iaculis odio vel, iaculis eros. Phasellus hendrerit, eros sed rutrum blandit, urna mi gravida lectus, eget pellentesque orci neque id ipsum. In enim odio, hendrerit ut condimentum vel, mattis et nisl. Nulla erat ipsum, posuere sit amet nisi aliquam, dictum iaculis purus. Aenean dui orci, efficitur bibendum vehicula vel, consectetur ut nulla. Suspendisse nunc nunc, consequat et quam ac, vestibulum lacinia nibh. In sit amet lectus ac purus ultrices facilisis vel ut enim. Morbi hendrerit interdum metus a scelerisque. Vivamus tempor facilisis velit vel feugiat. Fusce lobortis velit sed leo finibus, a lobortis ligula auctor.

Présentation statique

Quand il n’y avait que des écrans de bureau, on développait un site pour une largeur donnée en se basant, au vu des statistiques de visite, sur le type d’écran le plus largement utilisé par les visiteurs.

Les standards ont évolué en fonction de la qualité des écrans qui s’améliorait : moins de 800 pixels de large au commencement du web et plus couramment 1200 pixels aujourd’hui.

Principe : quelles que soient la largeur et la résolution de l’écran, tous les éléments de la page conservent la même taille fixe et le même placement.

Inconvénient : sur un écran de bureau dont la résolution est inférieure à la largeur du site, une partie du contenu est masquée et un ascenseur horizontal apparaît. Sur un écran mobile (téléphone ou tablette) le contenu complet peut s’afficher, mais en si petite taille que l’expérience utilisateur s’en trouve considérablement altérée.

Colonne 2a

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam accumsan aliquam sem sed fringilla. Vivamus consequat purus est, ac luctus augue pretium elementum. Phasellus ultrices nunc vitae orci blandit, a vulputate erat tristique. Pellentesque gravida convallis nulla sed commodo. Integer id sagittis nibh. Aliquam a porttitor tortor, vitae venenatis nunc. Aliquam erat volutpat. Suspendisse tempus semper finibus. Vivamus pretium mattis neque, quis sollicitudin ligula fringilla eu. Phasellus blandit tempor tellus id sodales. Etiam et nibh est. Aenean sed mi euismod, aliquet lorem feugiat, luctus odio. Ut laoreet mi in metus porttitor fringilla.

Colonne 2b

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam accumsan aliquam sem sed fringilla. Vivamus consequat purus est, ac luctus augue pretium elementum. Phasellus ultrices nunc vitae orci blandit, a vulputate erat tristique. Pellentesque gravida convallis nulla sed commodo. Integer id sagittis nibh. Aliquam a porttitor tortor, vitae venenatis nunc. Aliquam erat volutpat. Suspendisse tempus semper finibus. Vivamus pretium mattis neque, quis sollicitudin ligula fringilla eu. Phasellus blandit tempor tellus id sodales. Etiam et nibh est. Aenean sed mi euismod, aliquet lorem feugiat, luctus odio. Ut laoreet mi in metus porttitor fringilla.

Colonne 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam accumsan aliquam sem sed fringilla. Vivamus consequat purus est, ac luctus augue pretium elementum. Phasellus ultrices nunc vitae orci blandit, a vulputate erat tristique. Pellentesque gravida convallis nulla sed commodo. Integer id sagittis nibh. Aliquam a porttitor tortor, vitae venenatis nunc. Aliquam erat volutpat. Suspendisse tempus semper finibus. Vivamus pretium mattis neque, quis sollicitudin ligula fringilla eu. Phasellus blandit tempor tellus id sodales. Etiam et nibh est. Aenean sed mi euismod, aliquet lorem feugiat, luctus odio. Ut laoreet mi in metus porttitor fringilla.

Sed quis fringilla urna. Etiam non nisl vel dolor ullamcorper posuere. Aliquam tortor erat, consequat a elit sit amet, mollis laoreet est. Duis non luctus arcu. Mauris finibus id ante in suscipit. Vivamus scelerisque non sapien vel malesuada. Donec condimentum orci at metus sagittis, et maximus sem feugiat.

Duis eget libero sem. Pellentesque at sem tristique, iaculis odio vel, iaculis eros. Phasellus hendrerit, eros sed rutrum blandit, urna mi gravida lectus, eget pellentesque orci neque id ipsum. In enim odio, hendrerit ut condimentum vel, mattis et nisl. Nulla erat ipsum, posuere sit amet nisi aliquam, dictum iaculis purus. Aenean dui orci, efficitur bibendum vehicula vel, consectetur ut nulla. Suspendisse nunc nunc, consequat et quam ac, vestibulum lacinia nibh. In sit amet lectus ac purus ultrices facilisis vel ut enim. Morbi hendrerit interdum metus a scelerisque. Vivamus tempor facilisis velit vel feugiat. Fusce lobortis velit sed leo finibus, a lobortis ligula auctor.