Frameworks CSS: Les aternatives à Bootstrap

Une présentation de 10 alternatives possibles à Bootstrap et Zurb Foundation à prendre en considération.

Dans le monde des frameworks CSS, il y Bootstrap et Zurb Foundation bien sûr, tous deux excellents, mais il y a aussi plus légers, différents. Cela mérite bien un coup de projecteurs sur 10 frameworks CSS que vous pourriez considérer en lieu et place des deux autres précités.

Tendances CSS

Aujourd’hui, les frameworks CSS se revendiquent Bem, OOCss, Smacss, Atomic design. Les pré-processeurs pullulent avec Sass, Less ou Stylus pour ne citer que les plus connus. Bref, les choses évoluent, s’organisent, se structurent et font du développement CSS une discipline à part entière. Simple buzzwords ou nouvelle donne, je vous laisse trancher !

Ce qui est certain, c’est que tous les frameworks CSS s’organisent petit à petit autour d’objets quasi prêts à l’emploi pour construire une interface web la plus flexible, comprendre responsive le plus rapidement possible. Les différences se jouent surtout sur les concepts utilisés, le niveau de flexibilité de chacun d’eux et sur le temps nécessaire à les appréhender.

C’est parti pour une découverte de 10 frameworks qui peuvent vous aider à trouver chaussure à votre pied.

Materialize CSS

Materialize simplifie la vie des développeurs et de leurs utilisateurs.

Materialize CSS

Materialize CSS est disponible en version CSS ou Sass. il est inspiré par les travaux de Google concernant le « Material design ». J’ai commencé à le tester dernièrement pour un projet et je dois dire que pour le moment, rien à reprocher à ce framework qui pourrait bien devenir l’un des mes préférés.

Topcoat

CSS pour des applications web propre et rapide.

Topcoat

Les développeurs de Topcoat ont décidé que leur premier objectif pour ce framework devait être la vitesse. Il est complet avec icônes, polices de caractère Open Source et même des templates pour Photoshop !

Semantic UI

L’interface utilisateur est le langage du web.

Semantic UI

Encore un bien joli framework que ce Semantic UI. Avec un nom comme ça, celui-ci ne pouvait que me plaire. Ce côté sémantique est censé se retrouver dans un nommage stricte des classes utilisées et une séparation non moins stricte des objets et de leurs styles. je dis censé car je n’ai pas encore testé Semantic UI.

Concise CSS

Abandonnez l’indigestion. Arrêtez de trébucher sur vos classes. Soyez concis.

Concise CSS

Concise CSS peut se révéler le choix gagnant si vous souhaitez un framework léger en calories. Seulement 25 Ko sur la balance et une version Sass disponible. Des versions Less et Stylus sont également disponibles mais non supportées.

Skeleton

Un point de départ responsive et ultra simple.

Skeleton

Skeleton est plus pensé comme un point de départ que comme un véritable framework. C’est pour cette raison que les éléments présents ne sont pas stylés. Pas de couleur, de styles particuliers mais juste le nécessaire pour commencer.

UIkit

Un cadre léger et modulaire pour développer des interfaces web rapides et puissantes.

UIkit

UIkit est un framework développé par YooTheme, société spécialisée dans le développement de thème pour Wordpress et Joomla. Il est disponible en version Less et contient de nombreux éléments prêts à l’emploi, que ce soit côté CSS ou Javascript. Il y a même un éditeur HTML compris dans le package !

Pure CSS

Un ensemble de petits modules CSS que vous pouvez utiliser dans chaque projet web.

Pure CSS

Pure CSS pèse juste 4 Ko une fois minimifié ! Et c’est Yahoo qui a construit ce framework extrêmement modulaire. Tout est construit comme une « surcouche » de normalize CSS. L’un des plus légers de cette sélection.

Cascade Framework

Remettre le C dans CSS

Cascade Framework

Cascade repose sur les principes du design « atomique », à savoir la construction d’une page complète comme le résultat de l’ensemble de plus petits composants comme les templates, les organismes, les molécules ou encore les atomes. Le concept est intéressant. Les auteurs se targuent de ne pouvoir inclure que les éléments nécessaires, au contraire de Bootstrap.

Gumby

Plus flexible que jamais.

Gumby

Gumby fait partie des vieux de cette sélection. Il y a en effet un moment que ce framework existe même s’il ne bouge plus trop de la version actuelle 2.6. Il possède pourtant quelques particularités intéressantes comme le « shuffle » qui permet de complètement réagencer le layout d’une page en fonction du terminal utilisé pour y accéder.

Primer CSS

La boîte à outils CSS et les lignes directrices utilisées sur GitHub.

Primer CSS

Primer CSS est le framework utilisé par Github. Gageons que ce simple fait va lui assurer un avenir serein. Il est livré en version Sass. Primer est volontairement restreint aux composants les plus utilisés lors de la création d’une interface web; à savoir boutons, messages, navigation… On y trouve des choses pourtant moins courantes comme des classes prêtes à l’emploi pour l’affichage d’avatars.

Il y a une vie en dehors de Bootstrap

Nombreux sont les frameworks CSS disponibles sur Internet. En fonction des projets, il peut être intéressant de passer de l’un à l’autre. Bootstrap pour une grosse application par exemple et un Skeleton ou Pure CSS pour un site de type « one page ». Attention cependant à la courbe d’apprentissage nécessaire à la maîtrise de chacun d’eux qui pourrait faire arriver à la conclusion opposée; à savoir rester « scotché » à un framework pour tous types de projet. Cependant, il faut noter une véritable convergence de ces frameworks vers des fonctionnalités identiques, aussi le choix final n’est peut-être au fond qu’une histoire de goûts et couleurs… Et ça, ça ne se discute pas !

Olivier Jan

À propos de l’auteur

| Cofondateur de Check my Website

Check my Website est un service pour la supervision et la surveillance à distance de la disponibilité, de la performance et du bon fonctionnement des sites et applications web.

Suivez @olivjan sur Twitter !

Laissez un commentaire

comments powered by Disqus