Actualités WordPress, CSS & Webdesign, OceanWP & Elementor.

Le boîte à outil moderne du web c’est Bootstrap !

Devant travailler sur un projet d’interface Web pour un produit online je cherchais un solution de développement adaptée aux technologies HTML5/CSS3 et responsive. J’avais vu, par le passé, le framework HTML5 Boilerplate et son compilateur Initializr mais j’ai depuis entre-aperçu, dans différents CMS, le framework à la mode : BootStrap. Utilisé semble-t-il de façon massive aujourd’hui, j’ai décidé de m’y intéresser.

BootStrap (conçu à l’origine par 2 développeurs gravitant autour du projet Twitter : Mark Otto et Jacob Thornton) est un framework complet et léger à la base :

  • Feuille de style complète pour différents éléments HTML
  • Librairie Javascript basée sur jQuery
  • Fonte d’icônes Glyphicons
  • Jeux de modèles pour différents composants HTML

logo BootstrapLa liste des composants actuellement disponibles est déjà bien fournie : Glyphicons, Dropdowns, Button groups, Button dropdowns, Input groups, Navs, Navbar, Breadcrumbs, Pagination, Labels, Badges, Jumbotron, Page header, Thumbnails, Alerts, Progress bars, Media object, List group, Panels, Wells.

On trouve aujourd’hui quelques portails de thèmes spécialisés utilisant BootStrap, ils apportent en général de nouveaux composants et des ensembles de déclinaisons (CSS Less) pour l’architecture du squelette HTML. Voilà de quoi bâtir rapidement un projet relativement complexe.

Quelques exemples de thèmes pour BootStrap :

Bootstrap thème EmbarkBootstrap thème LeBlogBootstrap thème AppStrapBootstrap thème Ace AdminBootstrap thème FlatBootstrap thème Shopfrog

L’utilisation du Less CSS est nouvelle pour moi, c’est une technique de manipulation des CSS de manière dynamique plutôt bien pensée, la syntaxe est assez simple, mais ça reste à maîtriser encore pour moi.

La conception du management des styles est bien structurée et permet, avec un peu d’habitude et de pratique, de composer et modifier son squelette HTML rapidement.

Un excellente base de développement moderne.

Sources : BootStrap, Glyphicons, Boilerplate, Wrapbootstrap, Bootswatch, Creativemarket

Cet article a 1 commentaire

  1. Etonnant de voir comment cette solution impreigne le cercle des développeurs web, pourtant on peut s’en passer et garder toute sa créativité…

Laisser un commentaire

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Fermer le menu