En commençant par une charte graphique comprenant : un logo, les couleurs principales et la typographie à utiliser. Et un échange avec Ethan sur ses besoins, son activité, ses attentes particulières par rapport au site et l’hébergement et les plugins déjà en place pour le site web. J’ai réalisé une première maquette sur Figma (voir capture d’écran), puis nous avons tous deux échangé des idées pour affiner et améliorer le design.
Je suis ensuite passé directement à la mise en œuvre de cette première version du design avec Generatepress et Generateblocks Pro et j’ai produit les modèles nécessaires au fonctionnement optimal de WordPress et du site web (page d’accueil, modèle d’archive pour les taxonomies et le blog, modèle d’article unique pour les articles). Tout a été mis en place avec Generatepress et Generateblocks sans aucun code supplémentaire, ce qui permet à Ethan de modifier toutes les parties de son site web directement avec l’interface graphique et notamment Gutenberg. (voir la capture d’écran « Elements »).
Après cette première implémentation, Ethan trouvait le site un peu trop « blog », j’ai donc modifié le design directement avec Gutenberg pour obtenir quelque chose de plus compact avec un meilleur accent sur le contenu, car le site web est éducatif et informatif. Nous avons travaillé efficacement avec Ethan, de manière totalement asynchrone car il est aux États-Unis et moi en France. Une seule réunion en face à face sur Google meet a permis de confirmer nos points de vue et de valider les dernières modifications. L’ensemble du projet s’est déroulé à merveille, et le résultat est un site ultra-léger « content-first » qui correspond bien à la charte graphique initiale et qu’Ethan peut modifier entièrement lui-même. Un site éditorial clé en main, performant et optimisé pour le référencement.
