CSS Bootstraps et autres réjouissances

N’avez-vous jamais entendu cette célèbre phrase qui dit « Pourquoi toujours tenter de réinventer la roue ?« . Telle une vielle rengaine, mais pourtant si vraie ! Stop, arrêtez de répéter vos styles CSS et travaillez plus intelligemment.

Pour vos projets web, travaillez mieux et commencez sur une base solide. Pour aller plus loin que l’utilisation de grilles comme 960.gs ou encore Blueprint, les Bootstraps peuvent énormément vous faciliter la vie pour certains de vos projets. Traduit littéralement un Bootstrap est, en système informatique, un petit programme d’amorçage qui permet d’en lancer un plus gros. (Wikipédia).

Bootstraps

Dans le cas de notre site Internet, il constitue en général un ensemble de classes CSS (et aussi Javascript) pouvant être réutilisées pour vos projets web. Vous y trouvez de tout : des styles de titres, en passant par les formulaires, jusqu’au messages d’erreurs. Bien-sûr pour la structure, tout est mis en œuvre avec des lots de grilles. HTML 5, CSS 3, compatible pour tout les navigateurs moderne, bref que du bon. Enfin presque… Il ne faut pas oublier qu’ils constituent une base bien solide, mais a personnaliser en fonction des demandes de votre projet. Mais que demander de plus ? Il existe encore d’autres alternatives ! Lisez donc la suite…

Comment les utiliser ?
Téléchargez simplement le pack complet des sources et utilisez les fichiers CSS dans votre projet.

Bootstrap Twitter

Le plus célèbre est le fameux Bootstrap Twitter qui vient de sortir en version 2.0. C’est un des plus complet du genre. Il est basé sur les styles du célèbre réseau social. Il permet aussi l’utilisation de Less.CSS.

Bootstrapp

Bonus : pour vos maquettes avec Fireworks, retrouvez les éléments du Bootstrap Twitter en PNG par ici.

FBootstrap

Idéal pour vos applications Facebook, il inclus un maximum d’éléments HTML et de styles CSS prédéfinis. Tableaux, grilles, navigation et bien plus encore.

Jquery UI Bootstrapp

Celui ci-offre un thème bien propre pour les éléments utilisant Jquery UI. Moins complet que les précédents, mais tout aussi utile.

Les autres réjouissances

Fondation

Alors là, on passe a du très lourd. Récemment mis en ligne par l’agence Zurb, Foundation est ce que l’on pourrai appeler un framework. Comportant des centaines de styles, il constitue une superbe fondation (pas fait exprès) pour concevoir et maintenir votre projet web. Il offre des éléments vraiment très utile comme des grilles flexibles pour toute résolutions de navigateurs, des boutons, des styles de texte, sans compter les éléments JavaScript tel des boîtes modales, des accordéons…. À utiliser de toute urgence pour mettre rapidement un site sur pied.



Initializr

Tout autre chose, enfin presque. Initializr est un générateur de templates HTML5 pour vous aider à commencer un projet basé sur HTML 5 Boilerplate. Le template généré est propre et comporte tout ce qu’il faut pour commencer à intégrer votre maquette.

Pour conclure :

N’est présenté ici qu’une partie des outils de ce type. Mais dans tous les cas, pour vos prochains projets web, dès l’étape du webdesign, n’oubliez pas les possibilités d’intégration rapide qui existent. Évidement ces outils ne seront pas adaptés à certains sites, mais il vous feront sans aucun doute gagner un temps précieux sur vos projets.

11 commentaires

Répondre Jetstrap, créateur d'interfaces Bootstrap en ligne | WebdesignerTrends - Ressources utiles pour le webdesign, actus du web, sélection de sites et de tutoriels Annuler la réponse

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

*