Page d'accueil » Boîte à outils » 10 alternatives légères à Bootstrap & Foundation

    10 alternatives légères à Bootstrap & Foundation

    Choisir le bon cadre qui convient parfaitement à vos projets pourrait être un peu difficile - il y a beaucoup de choix. Peut-être que vous voulez aller avec des choix populaires comme Bootstrap ou Foundation, mais si votre site Web va être assez simple, vous n'aurez pas besoin de la plupart des blocs de construction et des matériaux inclus dans le package par défaut.

    La bonne nouvelle est qu’il existe une poignée d’alternatives beaucoup plus minces que Bootstrap ou Foundation. La plupart de ces cadres sont livrés avec juste la bonne quantité de styles et de composants pour vous aider à démarrer, tout en vous permettant de les étendre dans la direction que vous souhaitez pour votre projet.

    Voici 10 alternatives légères à Bootstrap et Foundation que vous devriez utiliser pour la construction de sites Web à plus petite échelle.

    Plus sur Hongkiat.com:

    • Démarrer avec Twitter Bootstrap
    • Utiliser Bootstrap 3 avec Sass
    • Outil Bootstrap: Construire des dispositions HTML Bootstrap
    • Travailler avec le plugin Bootstrap: Fenêtre modale
    • Outil Bootstrap: Construire Megamenu avec YAMM3

    1. squelette

    Skeleton a finalement eu un lifting. C'est une refonte totale à partir de la base, et pourtant, il est toujours aussi léger qu'il l'était. Le nouveau système de grille Skeleton adopte désormais la philosophie du Mobile First, qui garantit que la mise en page occupe une place centrale, quelle que soit la taille de l'écran de l'appareil..

    Tous les composants inclus dans la version précédente - boutons, formulaires et éléments d'entrée - sont toujours présents, mais les styles de typographie de base sont désormais définis dans rem unité.

    2. CardinalCSS

    CardinalCSS est un framework CSS construit avec un accent sur les performances, la lisibilité et surtout la maintenabilité. CardinalCSS adopte certaines approches modernes telles que mobile-first pour façonner le réseau; et modèle de boîte CSS qui vous permet de déterminer facilement la largeur et la hauteur des éléments.

    CardinalCSS est également livré avec une poignée de classes d’aide permettant d’appliquer rapidement des styles à un élément, par exemple, le lettrine qui applique l'effet d'abaissement du premier caractère du paragraphe.

    3. ConciseCSS

    ConciseCSS est un framework CSS - sans fioritures. Il s’agit d’un framework Lean construit sur Sass, LESS et Stylus, qui ouvre la voie de la maintenance en CSS. Mais, si vous préférez les CSS simples et simples à la vanille, vous pouvez également les obtenir..

    De même, ConciseCSS est également fourni avec des styles de base pour des éléments essentiels tels que les en-têtes, les paragraphes, les tableaux, les formulaires et un ensemble de classes d’aides permettant de créer une interface utilisateur de bouton..

    4. PowertoCSS

    PowertoCSS est léger et constitue un cadre frontal solide. Les noms de classe utilisés pour créer la grille et appliquer des styles sont simples et faciles à retenir, par exemple. .bouton. Vous pouvez également ajouter votre propre thème. Rendez-vous à leur StarterKit pour commencer.

    5. furtif

    Furtive est un framework CSS conçu pour la première fois sur mobile, construit autour des standards Web les plus modernes, tels que l'utilisation de Flexbox pour la grille et rem unité de dimensionnement des éléments (y compris la taille de la police). Furtive conserve une petite empreinte CSS en ne prenant pas en charge les anciens navigateurs (* cough * Internet Explorer) car ils nécessitent un certain piratage CSS. Furtive est donc un cadre parfait si vous concevez un site Web pour le futur.

    6. BassCSS

    BassCSS propose un ensemble léger de styles d’éléments de base, d’utilitaires, de styles de mise en page et de couleurs, sous forme modulaire pour la création d’une application Web réactive. Les fichiers SCSS sont inclus pour personnaliser facilement le style. Vous pouvez jouer avec la typographie, les espaces, les points d'arrêt et les éléments de l'interface utilisateur.

    7. Mueller

    Mueller est un système de grille modulaire réactif construit sur Sass et Compass. Avec Mueller, vous pouvez construire la grille en ajoutant des classes directement aux éléments HTML, ou si vous préférez que vos éléments HTML soient nets et propres, en utilisant la la grille() une fonction. La grille de Mueller peut être utilisée en tandem avec la bibliothèque Javascript de la maçonnerie pour créer une mise en page semblable à celle de Pinterest..

    8. Tuktuk

    Tuktuk est un nom tout à fait unique pour un framework. Comparé à Bootstrap ou Foundation, Tuktuk est beaucoup plus léger, car il ne contient que la quantité appropriée de composants pour créer un site Web présentable, notamment pour le système de grille, le style de base pour la typographie, les tableaux et quelques modaux.

    9. Base

    Base est construite sur LESS et Sass et ne comprend que les composants essentiels à la création de sites Web: la grille et le style de base des éléments HTML. La base n’est pas fournie avec des composants Javascript, mais elle offre une excellente compatibilité de navigation si bien qu’elle fonctionne même avec IE7.

    10. Toast

    Le dernier de notre liste est Toast. Grâce à la feuille de style SCSS incluse dans le package, Toast vous permet de configurer facilement les noms de classe de grille, la gouttière et même la base de colonne. Par exemple, si vous souhaitez que la grille soit une colonne de 9 bases au lieu de 12, vous pouvez le faire. Toast est un framework CSS minimal avec des configurations très flexibles adaptées à vos besoins..