Blog de Nicolas Hachet

Les frameworks CSS responsive design

Dans un article précédent, je vous indiquais pourquoi le responsive design est indispensable au succès de votre projet Web. Aujourd’hui, nous voyons les frameworks CSS libres et gratuits permettant de mettre en oeuvre un design adaptatif !

La liste ci-dessous n’est pas exhaustive mais recense les principales librairies open-source que vous pourrez utiliser pour faire des responsives. L’autre solution est de faire du responsive à la main en utilisant les media queries, introduites par CSS3, mais c’est une autre histoire que nous verrons plus tard… Pour l’heure, place aux frameworks CSS !

10 frameworks CSS pour faire du responsive web design

1. Bootstrap

On ne présente plus Bootstrap qui, entre de nombreux autres composants, propose un système de grid layout pour faire du responsive. http://getbootstrap.com/

2. Web Starter Kit

Un kit de démarrage rapide sorti en 2014 par les équipes Google permettant d’adapter les contenus à tous les périphériques, mais également proposant un kit CSS pour votre site Web. https://developers.google.com/web/starter-kit/

3. Gumby

Gumby propose un kit complet de composants CSS ainsi qu’un grid layout reponsive très simple.
http://gumbyframework.com/

4. Foundation

Foundation est un framework CSS ultra complet proposant un grid layout responsive et de nombreux composants d’UI.
http://foundation.zurb.com/

5. Responsive Grid System

Ultra léger, Responsive Grid System se présente comme un kit de démarrage rapide groupant des CSS en fonction de vos besoins, ni plus ni moins.
http://www.responsivegridsystem.com/

6. Skeleton

Comme ses petits copains, Skeleton vous fournira une ossature robuste pour votre site Web responsive.
http://www.getskeleton.com/

7. KNACSS

KNACSS est un framework CSS simple, rapide, puissant avec un logo en forme de saucisse. Et ça, j’adore…
http://www.knacss.com/

8. HTML5 boilerplate

HTML5 boilerplate combine un ensemble de composants et pratiques à utiliser pour la création de votre site Web responsive avec un design « passe partout ».
http://html5boilerplate.com/

9. Pure

Pure est un « petit » framework CSS modulaire ultra léger : 4.4Ko en gzip !
http://purecss.io/

10. Cascade framework

Cascade framework propose, comme son nom l’indique, d’utiliser au maximum les propriétés en cascade afin de construire ses design templates.
http://www.cascade-framework.com/

Vous voilà désormais armé pour créer les templates de votre projet en design responsive ! Le choix du framework se fera principalement selon vos préférences personnelles. N’hésitez pas à en débattre dans les commentaires. 😉