Vous avez dit

responsive design ?

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 réactive
(ou responsive design)

Ce type de présentation combine les principes des présentations fluide et adaptative de manière à en éviter les inconvénients respectifs.

Principe : La disposition des éléments d’une page est retravaillée à différentes largeurs d’écran – c’est la part adaptative – mais sans rupture puisque les contenus et les contenants se modulent aussi en largeur entre chaque point d’arrêt – c’est la part fluide.

Avantage : la présentation est toujours optimisée à l’écran quelle que soit la taille et la résolution de l’appareil qui lit le site.

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.

Réalisation CPorlier-Design sur une idée de Joseph Angelo Todaro

Made with Adobe Muse