Sous le microscope fait peau neuve

Posté : January 7, 2024 / Mis-à-jour : March 27, 2024

Temps de lecture : 3 minutes

Le blog Sous le microscope vient de fêter ses 3 ans et en profite pour changer son graphisme et pour proposer de nouvelles fonctionnalités.

Refonte graphique

Le but de cette refonte est de remplacer l’ancien graphisme qui faisait un peu vieillot et n’était pas vraiment personnalisé. Le nouveau graphisme se veux plus moderne et épuré tout en mettant l’accent sur le contenu.

Pour ce nouveau graphisme, j’ai dessiné de nouvelles illustrations.

De nouvelles fonctionnalités

Plusieurs améliorations ont été ajoutées comme une barre de progression indiquant l’avancement de la lecture d’un billet de blog permettant ainsi de mieux se repérer lors de la lecture. Un système d’autocomplétion pour la barre de recherche a été rajouté pour rendre les recherches plus rapides et efficaces. Des animations ont également été placées à différents niveaux pour rendre l’expérience de navigation plus fluide.

Sous le capot

Le site Sous le microscope a été ma première expérience dans le monde du web. Pour cela j’avais choisis le logiciel WordPress (système de gestion de contenu ou Content Management System en anglais) qui ne nécessite pas de coder, est facile d’utilisation et largement utilisé (43 % des sites internet sont basés sur WordPress en janvier 2024). Bien que cette première approche a été réalisée sans coder, cette nouvelle version elle repose sur du code.

Création d’un thème personnalisé

Plusieurs milliers de thèmes pour WordPress sont disponibles et permettent de personnaliser le graphisme de son site. Dans le cadre de cette refonte graphique, j’ai décidé de coder mon propre thème ce qui me permet d’avoir un meilleur contrôle sur l’apparence et les fonctionnalités du site. La création du thème personnalisé a également permis de remplacer 8 extensions (plugins) tierces, que j’utilisais précédemment, par des fonctions créées pour ce nouveau thème. Cela facilite la maintenance et réduit les risques de sécurités dû aux extensions tierces.

image back / office et code Pour cela, j’ai utilisé les langages de programmation : PHP, CSS (SASS) et Javascript.

Cookies et vie privée

La diminution du nombre d’extension a aussi permit de réduire le nombre de cookies et ainsi d’améliorer le respect à la vie privé. L’extension SlimStat Analytics qui était utilisée pour le suivi des utilisateurs nécessitée l’enregistrement de cookies. Celle-ci a été remplacée par une autre ne nécessitant pas de cookies. Les seuls cookies encore présents sont ceux proposés de base par WordPress et optionnel lors de l’ajout d’un commentaire.

Un site beaucoup plus léger et rapide

Depuis le début d’internet, les pages ont tendance à devenir de plus en grandes et à contenir plus de contenu (passant de 467 kb à 2505 entre novembre 2010 et janvier 2024). Cela peut conduire à des pages qui sont plus longues à charger mais également à augmenter l’impact écologique du site en nécessitant de télécharger plus d’informations depuis le serveur. Réduire la taille des pages a donc été l’un des objectifs de ce nouveau thème.

Cela passe notamment par le format des images qui passe de .png vers .svg et .webp ce qui permet de réduire le poids des pages à charger. A cela s’ajoute de améliorations dans le code pour être plus rapide, la désactivation de fonctions non utilisées de WordPress comme les émojis dans les commentaires, ainsi qu’un meilleur paramétrage du système de cache.

La page d’accueil est beaucoup plus rapide. de 300 ms et elle est 2 x fois plus légère

D’après le calculateur Website Carbon, l’impact estimée du site est de 0,11 g de CO2 par visite.

https://www.websitecarbon.com/website/souslemicroscope-com/

Bilan des améliorations

En plus des améliorations cités ci-dessus d’autres comme une meilleure structure des pages a été réalisée pour faciliter le référencement du site (SEO). Le site se veut plus durable avec la réduction du nombre de cookies et une réduction du poids des pages.

préciser plus durable et moins de risques vies privées.

D’autres modifications viendront au fur et à mesure ainsi que de nouveaux billets de blog sur des articles de microbiologie. Je suis ouvert à des propositions d’améliorations.