L'allure de mon blog à travers les âges

Voilà un ptit moment que ça me taraudait. Je voulais revoir les anciens design du site.

Mon blog a pas mal évolué avec le temps. Faut dire que je l'ai commencé il y a quinze ans même si j'en ai perdu la première version.

Il n'y a pas si longtemps ce n'était qu'un seul fichier html avec un seul fichier css. Je le modifiais à la mimine direct en html avec vim. Et malheureusement je n'ai pas conservé beaucoup de sauvegarde de cette époque.

Je n'ai que sa dernière itération. Du coup il a fallu que je ruse : je suis passé par l'Internet Wayback Machine qui est un outil magnifique.

Ce site s'évertue à sauvegarder des pans entiers du web. Il sauvegarde des pages web mais surtout les rend disponibles. Du coup on peut voir à quoi ressemblait un site il y a quelques années. C'est un vrai musée numérique moderne.

On peut aussi retrouver des sites qui n'existent plus. C'est pas ultra rapide mais ça marche sacrément bien. Vous pouvez (oui, vous) également demander à ce qu'il sauvegarde une page précise.

Bref, je m'égare, je suis allé récupérer les anciennes versions de mon blog sur leur site.

Et du coup je vous propose un ptit retour en arrière.

Chaque image vous emmènera sur la version html du site que vous pourrez naviguer normalement (à l'exception des liens pétés volontairement ou non).

2007

Bon bha voilà :

Un simple logo en ascii art, un menu qui menait à mes différents services et voilà

Rudimentaire, brutaliste, efficace

C'était vraiment très léger. Je n'utilisais quasiment aucun formattage. Le rendu était d'ailleurs quasi identique dans un navigateur texte que dans un navigateur graphique.

Le contenu était vraiment pauvre avec du recul et je ne stockais pas les dates des articles ce que j'ai regretté bien plus tard. Je regrette également de ne pas avoir contraint le texte à la largeur du logo, c'était assez cool. J'en viens à hésiter à recréer un design similaire sur le blog actuel.

J'ai maintenant un peu honte du contenu mais bon, c'est pas bien grave, faut bien commencer quelque part.

2011

Sans plus tarder le screenshot qui sert de lien :

Le design est absolument pas accessible, il faut passer la souris sur les titres pour afficher les articles, c'est tout gris et gris et blanc et un peu de rondeurs.

La quintessence du CSS en 2011, des ombres, des arrondis, de l'alternance de couleurs et ça réagit au survol.

Je sais pas me demandez pas.

C'est VRAIMENT pas pratique. D'aucun dirait que c'est de la merde, mais vous savez quoi ? D'aucun a raison.

Non, mais sous prétexte de faire mumuse avec un peu tous les ptits trucs fifous du CSS de l'époque j'ai pondu un truc vraiment inutilisable et qui gâche du coup le contenu. J'ai encore plus honte. Mais j'aime encore maintenant l'aspect visuel du menu en haut quand on le survole.

Tiens c'est marrant j'avais déjà terminé ma dégooglisation en 2011 (coucou Frama).

2013

Et vlan !

un design qui a adopté les couleurs actuelles à peu près, avec des colonnes. Bien plus sobre.

J'aime beaucoup ces couleurs et d'ailleurs ça n'a que peu varié depuis

2013 (ouai j'ai pas de nom de design), c'est un design qui me plaît encore pas mal et qui ne fait pas vraiment daté je trouve. C'est sobre, avec des couleurs qui me plaisent beaucoup, assez pastel mais c'est vrai assez peu contrastées.

Je suis allé à fond dans la colonne ce coup-ci, plus le navigateur est large plus c'est chiant à lire. Sur un article court ça ne pose pas de souci mais un article long où il faut scroller verticalement ça veut dire monter et descendre autant de fois qu'il y a de colonnes. Mais ça donne un aspect journal appréciable.

En dehors des colonnes, la seule petite folie c'est l'affichage des dates au survol.

2017

Ça y est, en septembre j'ai adopté Hugo et je dis aurevoir à ma ptite page écrite à la main.

On a un design très proche de l'actuelle avec une colonne de présentation à gauche et le contenu à droite avec chaque article bien défini avec ses métadonnées et un lien pour lire en entier

Je pense que certains d'entres-vous l'ont vu en vrai celui-là.

Avant cette itération, je n'avais à peu près aucun lecteur. Là, j'ai commencé à écrire beaucoup plus de contenu et surtout à chaque fois des articles un peu plus longs qu'avant. Ça commençait à être nécessaire d'avoir des pages dédiées pour chaque article.

On reconnait bien le design actuel qui n'a été que de simple itération depuis cette base. J'ai d'ailleurs donné un petit nom au design NeoDark. Je sais pas trop pourquoi, me demandez pas.

Toujours aucune image de tout le site.

J'avais pas encore les différents types d'articles, du coup le code couleur n'était pas encore posé.

2018

Après un an de Hugo, je suis complètement conquis et je ne pense plus le lâcher de si-tôt.

Très semblable au précédent, il y a désormais les icônes en SVG dans le menu de gauche et quelques couleurs supplémentaires sur les articles

Quelques petites mutations par-ci par-là.

C'est pas la révolution mais de légères évolutions éparses.

J'aimais pas du tout le rendu dans le coin des articles mais je me sentais obligé de le mettre alors qu'au final on s'en fout un peu du type d'article. Surtout que les frontières se brouillent rapidement.

C'est l'arrivé des SVG dans la sidebar, j'ose enfin inclure des images. Je commence à avoir mon lectorat qui se constitue mine de rien. Chaque article avec des images (même petites et optimisées) ça commence à représenter pas mal de trafic.

Et d'ailleurs j'ai également réduit drastiquement le RSS qui représente la plus grosse part de la bande passante. J'inclus donc bien moins d'articles. Je tente de pousser au max l'utilisation du cache mais pas mal de logiciels (nextcloud surtout) ne savent pas se comporter correctement mais on ne peut rien y faire.

2020

Et nous voilà en bout de périple.

Le design actuel

Exit le pastel et bonjour les couleurs

Je sais que certains n'aiment pas, mais je me suis lâché sur les couleurs. J'aime beaucoup cet effet un peu néon, avec les ombres colorés qui poussent les couleurs un peu plus loin sur le fond. Et le footer des articles avec son gris plus sombre ça fait plus classe.

C'est le retour des arrondis aussi avec la bordure haute des articles plus épaisse.

J'ai aussi retravaillé la sidebar pour ajouter un texte visible à chacune des icones. Faut avouer que les icônes en elle-même n'était pas forcément très explicite. Pendant un moment l'icône et le texte pour le Fediverse était animé mais ça bouffait pas mal de CPU pour que dalle.

C'est aussi l'arrivée du blogroll à droite pour promouvoir d'autres blogs francophones.

Bon ça se voit pas sur la capture d'écran mais c'est aussi l'arrivée des commentaires (enfin en fin 2018). Et je poste aussi mes réactions à chaud de visionnages de films pour diversifier un peu plus le contenu.


Voilà, ainsi s'achève ce petit retour en arrière sur près de quinze ans de bloggage.