Navigation

Nous recrutons : 2 postes ouverts en ce moment ! Consulter les offres!

Créer un Styleguide performant

Le principe de "styleguide"

Le web évoluant sans cesse, nous suivons les dernières pratiques de développement frontend avec beaucoup d’attention. Nous les appliquons ensuite au plus vite pour améliorer nos processus de travail, les performances, la facilité de prise en main ainsi que la pérennité de nos productions.

Parmi ces méthodologies, nous affectionnons particulièrement le styleguide, une documentation qui expose les éléments HTML composant le site et forme ainsi une documentation qui est utile tant au niveau de la communication entre nos clients et nous-mêmes qu’entre les designers et les développeurs.

Nos styleguides utilisent l’approche “atomique” pour la construction des composants. C’est une pratique qui nous permet :

  • De garder la main globalement sur les différents éléments qui forment le site (une molécule est composée de plusieurs atomes et peut avoir des atomes en commun avec une molécule différente).

  • De faciliter ainsi l’évolution du code en gardant une base saine, solide et commune pour tout le site, tout en fournissant une documentation “live” visible par tous les partis.

Dans notre flux de travail, nous mettons en place un styleguide avant de commencer son intégration dans un CMS. Cela nous permet d’avoir une meilleure vision des composants et de garder un code HTML propre avant de le passer sur la plate-forme, qui a ses besoins propres.

Par ailleurs, l’avantage d'un tel système est qu'il ne se cloisonne pas aux limites d'un projet uniquement. Un styleguide est fait pour être facilement repris et utilisable dans d’autres projets. Si, par exemple, une nouvelle plate-forme devait faire son apparition, chaque composant est récupérable et facilement extensible.

Pour en savoir davantage sur le sujet vous pouvez consulter nos différents projets ci-dessous, nos articles ou contacter un membre de notre équipe spécialiste dans ce domaine. Vous pouvez également découvrir cet article en anglais, qui explique dans les grandes lignes "comment créer un styleguide".

Nos projets Créer un Styleguide performant