Voici Light & Bold

En tant que développeur Web et évangéliste en performance Web, je passe beaucoup de temps à améliorer la vitesse de mes sites.

Avoir eu à ma disposition un thème déjà optimisé m’aurait grandement facilité la tâche.

C’est ainsi qu’après un an environ, le thème a complété le processus d’acceptation sur Themeforest. Je suis très fier de présenter officiellement Light & Bold.

Un thème ultra rapide

Avec Light & Bold, je voulais offrir un thème WordPress hyperperformant accessible à tout le monde. Que le thème soit utilisé par un néophyte ou un fanatique de performance Web, les performances devaient être au top et ne nécessiter aucune connaissance particulière.

Le budget de vitesse pour la conception de L&B était très ambitieux. Il était crucial de se démarquer fortement de la concurrence.

Indice de vitesse inférieure à une seconde

L’indice de vitesse ou « Speed Index » est le temps requis pour afficher le contenu critique à l’écran. C’est-à-dire les éléments visuels au-dessus de la ligne de flottaison.

Un indice sous les 1000 millisecondes est aussi la recommandation de plusieurs grands influenceurs en performance Web tels que Paul Irish.

Temps de chargement inférieur à 0.5 seconde

Le temps de chargement ou « load time » est le temps nécessaire pour télécharger et afficher l’intégralité du contenu d’une page Web dans la fenêtre du navigateur. Le temps de chargement est la donnée métrique la plus courante en performance Web puisqu’elle est simple à comprendre.

100 % dans Google PageSpeed Insights

Il faut dire qu’un score parfait n’est absolument pas nécessaire pour obtenir une performance optimale.

Il était toutefois indispensable pour moi que le thème se démarque sur ce point puisque le score obtenu sur Google PageSpeed Insights est utilisé à tort par l’industrie comme indicateur de performance.

Je n’avais donc pas le choix de jouer le jeu.

Heureusement, l’optimisation du thème pour maximiser l’indice de vitesse facilite l’atteinte d’un résultat parfait. Je dois aussi avouer qu’une note parfaite est un outil marketing très puissant?!

Faire des choix

La construction d’un tel thème n’était pas nécessairement évidente. J’ai eu plusieurs interrogations sur la façon de le construire et sur les technologies à utiliser.

Zéro dépendance

Une chose était certaine, par contre : je savais ce que je ne voulais pas.

Je ne voulais pas d’un thème qui nécessite jQuery ou un autre « framework » JavaScript pour fonctionner. Cela alourdit et bloque inutilement le rendu critique de la page.

Starter Theme

Il aurait été tout à fait possible de ne pas travailler avec un « starter theme », mais j’aime bien la structure minimaliste d’Underscore et je l’avais déjà utilisé pour développer plusieurs thèmes, alors c’est Underscore que j’ai choisi.

Architecture CSS

Quelle architecture choisir entre OOCSS, ACSS, oCSS, SMACSS, BEM, SUITCSS??

Le CSS se devait d’être léger et facile à modifier. J’ai finalement découvert le BASSCSS sur une architecture ACSS. Je me suis rapidement adapté à cette architecture et je pense que c’est une très bonne idée pour le maintien du thème à long terme.

BASSCSS permet de créer de nouveaux gabarits sans ajouter la moindre ligne de CSS, ce qui est excellent pour garder la feuille de style la plus légère possible.

Page Builder

J’ai dû tester la plupart des « page builder » pour en trouver un qui n’affecterait pas les performances d’un site. Malheureusement, je n’en ai pas trouvé qui me convenait. Je crois que le problème n’est pas tant les « Page builder » que la flexibilité que les « Page Builder » offrent à l’utilisateur.

Si l’utilisateur peut ajouter un carrousel, des accordéons et des effets parallaxes sur la même page, il le fera assurément?!

J’ai aussi beaucoup réfléchi à la réelle utilisation des « page builder ». Les gens achètent un thème parce que le visuel et les gabarits leur plaisent. Si les visuels leur plaisent déjà, alors pourquoi permettre à l’utilisateur de tout modifier??

Suis-je totalement dans l’erreur??

© 2017 - bulledev.com