date | slug | title | description | image | page_title | changefreq | priority |
---|---|---|---|---|---|---|---|
2014-08-18 |
foundation-love |
5 bonnes raisons pour commencer un projet avec Foundation |
Pourquoi Foundation est à l'heure actuelle le meilleur framework pour le responsive design avec HTML & CSS ? |
Pourquoi j'utilise Foundation et pourquoi vous devriez faire pareil |
monthly |
0.8 |
Foundation est dans le top 10 des repos les plus étoilés sur GitHub. Depuis la sortie publique de la version 3 en 2011, il y a connu de petits changements. Mais depuis la version 4 c'est un des Framework responsive les plus stable que vous pouvez choisir pour votre prochaine application. Grâce à son système de grille simple, il est apprécié par les développeurs webs de tout horizons - back-end comme front-end, car vous pouvez facilement et rapidement contruire un site internet fonctionnel et responsive. N'importe quel développeur avec des connaissances de base en HTML et CSS peut commencer à utiliser Foundation.
Foundation offre des bases solides pour n'importe quel site, quelque soit la taille du projet. Il embarque normalize.css, qui est indispensable pour avoir un contenu cohérent entre les différents navigateurs. Foundation est basé sur la priorité au mobile (aka mobile-first) ce qui permet une bonne mise en page, notamment au niveau de la typographie. Le font-size
des textes est calculé en fonction de la taille d'écran. Chaque élément contient un style de base, comme les formulaires qu'il est facile de styler rapidement si vous connaissez les bonnes variables du fichier _settings.scss
.
J'utilise Foundation car je gagne énormément de temps en corrigeant des problèmes historiques au web. Ce temps gagné me permet d'investir plus de valeur dans la construction de solutions évolutives et personnalisées.
Aujourd'hui les sites internet doivent être modernes, soignés, responsive, et optimisé pour le mobile. Foundation nous aide à atteindre ce but avec un minimum d'effort. Voici 5 raisons pour lesquelles je pense qu'actuellement c'est le meilleur framework disponible.
Foundation possède le meilleur système de grille responsive disponible. Construit avec une priorité au mobile il est très facile de faire évoluer sa mise en page sur les tablettes, pour terminer sur des écrans. D'expérience je conseille de diviser son écran en 12 colonnes (Car 3 x 4 = 12). Ce système permet de mettre en place presque n'importe quel type de design.
<div class="row">
<div class="small-6 medium-4 large-2"></div>
</div>
Foundation embarque un nombre impressionnant de composants CSS et JavaScripts, réutilisables et commun à n'importe quel projet web. Pour commencer vous pouvez simplement utiliser le même HTML que celui présent dans la documentation. Si vous souhaitez plus de contrôle au niveau du style il est aussi très facile de personnaliser le framework et d'étendre ses capacités en faisant appel aux mixin Sass.
Foudadation est compatible avec tous les navigateurs web modernes. Bien sûr si vous devez mettre en place un site qui ne respecte pas les standards HTML5, il est toujours possible de surcharger -inutilement de plugins votre page avec HTML5Shiv et Respond.js. Cela vous aidera à supporter un moment les anciens navigateurs.
Si votre employeur / client souhaite un site internet compatible avec internet explorer 7, il est toujours possible de lui expliquer que :
Il est plus productif, à long terme, de construire l'avenir plutôt que de corriger les erreurs du passé.
Foundation offre ne nombreuses façon de personnaliser son style par défaut.
Vous pouvez télécharger directement un fichier CSS personnalisé avec vos différentes couleurs et composants. Cette méthode permet d'écraser les styles et le comportement par défaut du JavaScript. Le principal problème est que vous perdez les nombreuses corrections mineures de bugs.
Si vous maîtrisez l'utilisation de bower avec Node.js, et que vous utilisez un préprocesseur comme Sass vous pourrez utiliser toute la puissance de ce framework. En modifiant le fichier _settings.scss
il est facile et rapide de personnaliser le design. Cette méthode permet de mettre à jour facilement le framework et ses dépendances dans votre fichier bower.json
.
Vous connaissez déjà par coeur le framework, vous pouvez cloner le projet foundation-boilerplate pour directement exploiter les bonnes mixins et contruire rapidement votre prototype.
Foundation est un projet open source, hébergé sur GitHub. Il est publié sous la licence MIT. C'est une des meilleures raisons pour lesquelles j'utilise quotidiennement Foundation. Vous êtes libres de l'utiliser comme bon vous semble en le changeant complètement ou simplement pour expérimenter une nouvelle technologie. De plus vous n'aurez pas à lire d'obscures conditions d'utilisations et n'avez aucun risque à l'utiliser sur les projets de vos clients.
La première étape conciste à lire la documentation. Ensuite pour tester rapidement une mise en page vous pouvez télécharger un boilerplate. Pour finir je construit presque tous mes projets avec une base plus ou moins important de composants issus du framework. N'hésitez pas à aller hacker mon code source.
J'espère que vous avez trouvé cet article interessant et qu'il vous a convaincu d'essayer Foundation pour vos futurs projets.