J’écrivais il y a quelques temps que j’utilisais Hugo comme générateur de site statique pour ce projet de site de blog, et j’expliquais brièvement les avantages et inconvénients que je trouvais à cet outils.

J’ai depuis, à ma grande surprise, reçu des e-mails de quelques lecteurs (vous aussi pouvez me contacter ici me posant des questions sur Hugo. Ils étaient à la recherche d’une solution pour reconstruire leurs sites personnels.

Comme de toute façon j’espère convaincre certains membres de mon entourage (ils se reconnaîtront) de se mettre à l’écriture d’un journal de bord en ligne (ils ont de nombreux avis fascinants à partager, et je voudrais égoïstement les lire), j’ai pensé qu’il serait temps de revenir de façon plus approfondie sur mon format de blog et son fonctionnement. Peut-être qu’en me lisant, ils se lanceront dans l’aventure.

Nous allons donc parler des principes généraux derrière Hugo, l’outil que j’utilise pour créer ce blog. Pas de détails techniques ni de tutoriel, simplement mon avis et ma compréhension de ce systèmes.
Allons y donc.

Gif de Dr Who disant 'Allons-y Alonzo'

Un générateur de sites statiques

La quasi totalité du web que nous utilisons est composé de sites internets dits “dynamiques”. Ils ont la capacité de s’adapter à la volée à celui ou celle qui les regarde, et au moment où ils sont vus. Ainsi, visiter le site de la SNCF vous montre les trajets du jour, et même éventuellement en partance de la ville ou vous vous trouvez, sans qu’un pauvre webmaster épuisé n’ai réécrit toute la page d’accueil pour vos beaux yeux. Ce changement est fait au moment où vous consultez la page, de façon automatique, dynamique.

Il en va de même pour les sites de shopping qui affichent le nombre d’article en stock, les réductions, les avantages fidélité dont vous bénéficiez, le délai de livraison jusqu’à votre adresse, etc.

Hugo vous permet de créer des sites statiques, qui seront donc affichés exactement à l’identique pour chaque visiteur, et présentera toujours exactement le même contenu, jusqu’à ce que le créateur du site n’y modifie quelque chose.


Avantages des sites dynamiques

Les outils de création de sites dynamiques sont plus connus, plus fréquents, et souvent plus facile d’emploi en requérant moins de connaissances techniques pour être mis en place. Ce sont les CMS1 tels que Wordpress, Joomla et autres, et ils représentent la très large majorité du web actuel.

Quand vous utilisez un tel système, vous avez généralement accès à une page de connexion, puis à tout un tableau d’administration par lequel vous pourrez configurer, modifier, améliorer votre site, créer et rédiger de nouvelles pages, etc.

Certaines plateformes commerciales (comme SquareSpace, par exemple) vous proposent même de louer un site internet pré-construits, et s’occupent pour vous du déploiement et de l’hébergement, mettant à votre disposition de puissants outils de création et de mise en page, sans que la moindre connaissance informatique ne soit attendue de vous.

Ces outils sont très biens : ils permettent à ceux qui n’ont pas les connaissance, le temps, ou simplement l’intérêt, de eux aussi créer un site qui leur appartient. Ce sont de bon outils de démocratisation du web.

À mon avis, de nombreux site aujourd’hui créés dynamiquement pourraient tout à fait être statiques. Je pense à certains blog personnels, ou des sites vitrines présentant marques, lieux ou personnes, qui ne changent pas vraiment d’une visite à l’autre. Et je pense que, une fois franchi l’étape de découverte et d’apprentissage d’un générateur de site statique, ces derniers sont de meilleurs outils dans la plupart des cas.


Avantages de Hugo comme site statique

Je n’ai essayé que Hugo, alors je ne parlerai que de lui. Mais je présume (sans aucune vérification faite) que ces argument s’appliquent également aux autres générateurs de site statique (comme par exemple Jekyll).

Économique

Parce qu’un site statique est… statique, l’ordinateur qui le met à disposition des visiteurs (a.k.a serveur) n’a presque aucun travail à faire. Pas de base de donnée traiter ni consulter à chaque affichage, pas de code à exécuter. Chaque page est brute, devant être expédiée tel quel. La puissance de calcul pour cette simple expédition est minimal, et le serveur n’a aucunement besoin d’être puissant.

Parce qu’on ne met sur le serveur que le contenu du site, et pas tout l’outil qui sert à le construire, le volume de données nécessaires à placer sur le serveur est grandement diminué.

Parce que le site est statique, le serveur n’a pas besoin d’information sur le client. Il y a donc moins d’échange d’information, et la transaction peut se faire bien plus vite.

Les sites statiques sont donc économes en ressources pour le serveur, et le serveur peut donc être moins cher et moins puissant pour des performance égales.

Écologique

Puisque le serveur est moins puissant et consomme moins de ressources, il est plus écologique. Les composants n’ont pas besoin d’être dernier cri, le serveur a moins besoin d’être refroidi, on peut héberger plus de sites en parallèle sur la même structure.

Et puisque le site est statique, le client aussi a moins de travail à faire. une fois les fichiers reçus, il y a très peu de code à exécuter ou de nouvelles requêtes à faire. On affiche, et puis c’est tout. De fait, moins de puissance à utiliser, moins de batterie consommée.

Je n’ai pas fait de mesure ni de comparaison pour quantifier ce bénéfice écologique. Mais dans un monde où se déploie une vraie course à la surconsommation, aux performances extrêmes, où les processeurs tournent de plus en plus vite pour supporter des application toujours plus grosses et lourdes, cette décroissance est rafraîchissante.

Indépendant

Hugo est open source, est gratuit, est téléchargeable localement, et utilisable à partir d’un simple, unique fichier binaire.
Le site qu’il génère est un bête est brut ensemble de fichier HTML et CSS, modifiable à partir de n’importe quel éditeur de texte. Les données qu’il utilise pour produire le site aussi sont de simple fichier texte.

Une telle ouverture est devenue rare : quitter un écosystème d’application et emporter ses données sans en perdre est devenu difficile, voir impossible.
Vous prenez le même risque en utilisant un CMS. Certes, certains vous permettent de sauvegarder et exporter vos données, mais ces données ne pourront pas facilement être utilisées pour reconstruire votre site avec un outil différent.

Ceci veut dire que votre site Hugo est vraiment votre site. Aucune entreprise faisant faillite, ou verrouillant vos accès, ou changeant sa politique de donnée, ne peut vous retirer le contrôle de votre travail. Dans le pire des cas, vous serez obligé de changer d’hébergeur, et cela vous prendra quelques minutes pour remettre tout votre site en ligne.

Résistant

Un site internet est accessible par tous, visiteurs curieux comme pirates malintentionnés. Les sites dynamiques se font fréquemment attaquer par des armées de robots qui cherchent automatiquement les failles de sécurité qu’il pourraient présenter.

Ce n’est pas parce que votre petit blog perso n’a que peu de visites qu’il n’intéresse pas les pirates : le serveur qui est derrière est une ressource précieuse, et votre site est la porte à travers laquelle y accéder pour transformer en usine à spam, ou bien propager du contenu malveillant, ou tout autre acte répréhensible.

Un site statique ne laisse pas ses visiteurs faire autre chose que le visiter. Il ne peut donc pas être piraté, par essence.

Bien sûr, le serveur n’est pas invulnérable : d’autre portes d’accès peuvent être exploitées. Mais c’est tout de même retirer aux attaquants un point d’accès majeur et fragile.

Résilient

Dans la continuité directe du point précédent, les sites statiques sont résilients. J’entends par là qu’il ne reposent que sur des technologies basiques, stables et pérennes. Le HTML et le CSS sont amenés à rester, et les nouveautés de ces langages sont bien souvent retrocompatibles. Le code d’aujourd’hui sera vraisemblablement interprété de la même façon dans 20 ans ou plus.

Un site dynamique repose sur des bases de données, du PHP, des bibliothèques logicielles qui doivent être mises à jour, sous peine d’être vulnérables aux attaques susmentionnées. Et les mises à jour peuvent parfois (souvent) causer des dégâts au contenu, que ce soit la mise en page ou même le fonctionnement de votre site.

Si vous ne mettez pas Hugo à jour, vous ne bénéficierez pas des toutes dernières options et fonctionnalités, mais vous n’en aurez probablement pas besoin de toute façon.


Limites de Hugo

Vous l’aurez compris, je ne suis pas impartial. J’aime beaucoup Hugo : je le trouve simple, sobre, fiable. Je l’utilise avec plaisir, et il me plaît de deux façons :

  1. J’aime faire un blog, et Hugo rend cette tâche simple
  2. J’aime bidouiller l’informatique, et Hugo me laisse libre d’explorer tout le bidouillage qu’il me sied.

Néanmoins, il me serait malhonnête de prétendre que Hugo n’est qu’une partie de plaisir. Il présente de nombreux inconvénients dont il faut avoir conscience avant de l’employer. Donnons en un aperçu.

L’apprentissage

Utiliser Hugo demande de manier plusieurs outils avec lesquels peu de gens ont l’habitude d’interagir. Il y a une courbe d’apprentissage assez raide à franchir.

Ligne de commande

Hugo est un outil en ligne de commande. Je ne lui connaît pas d’interface graphique en simplifiant l’emploi. Il exige donc de ses utilisateurs d’ouvrir un terminal et de taper des instructions.

Certes, la liste de ces instruction est très réduite, et prennent peut être une page A5 à lister et expliquer de façon détaillée (écrit très gros), mais ça reste une étape intimidante pour quiconque n’a jamais fait appel à une console.

L’hébergement

Tout site web doit être hébergé. Nombre de services propose aux utilisateur de gérer l’hébergement directement depuis leur site. Hugo ne propose aucun hébergement : il va vous falloir trouver votre serveur, le louer, et y placer vos fichiers à chaque fois que vous modifiez votre blog.

Là encore, c’est assez facile d’apprendre à le faire, mais c’est intimidant.

Git

Git est un outil permettant de gérer les versions de vos projets. Il est couramment utilisé par les développeurs.

Bien que tout à fait facultatif, il permet de garder des sauvegardes de vos modifications de votre blog et de les synchroniser entres les différents endroits où vous pourriez travailler sur votre blog.

Il demande tout de même lui aussi de maîtriser la ligne de commande, et est parfois complexe à utiliser.

la personnalisation

Hugo est complètement personnalisable. que ce soit changer le thème (et de nombreux thèmes sont disponibles), ajouter votre propre style, créer des short-codes pour rendre vos outils faciles d’accès, ou bien radicalement modifier la composition de vos pages, c’est complètement possible : Hugo est malléable car vous avez accès au code source.

Mais ce n’est pas forcément facile. Maîtriser le CSS et le HTML est une base incontournable pour celui qui veut modifier son site de cette façon, et il va vous falloir vous pencher sur la documentation pour les modifications plus poussées de Hugo.

Au final, si les possibilités sont bien plus vastes qu’avec un site pré-fait avec un CMS, elles sont bien moins accessibles à ceux qui ne savent pas encore au moins un peu coder avec des technologies web.

Les fonctions dynamiques

Pour moi, c’est la plus grosse faiblesse d’Hugo. Et c’est logique : qu’un site statique ne puisse pas se comporter comme un site dynamique est évident.

Ainsi, si vous avez besoin de fonctions dynamiques, comme gérer une boutique d’e-commerce, ou permettre à vos visiteurs de s’identifier pour accéder à certaines pages, Hugo n’est probablement pas pour vous.

J’ai cru voir des solutions d’e-commerce compatibles avec Hugo, mais je ne vois pas l’intérêt de se mettre ses contraintes techniques supplémentaires.


Conclusion

Les e-mails de lecteurs que j’ai reçus cherchaient à quitter Wordpress pour s’affranchir d’un système parfois encombrant, nécessitant des mises à jour fréquentes et une maintenance souvent frustrante.
À ceci, Hugo fait plus que répondre.

Toutefois, ils cherchaient surtout un système “clefs-en-mains”, rapide à découvrir et maîtriser, et avaient tout deux besoin d’une e-shop. Je me suis vu contraint et forcé de leur déconseiller mon outil favori.

À contrecoeur, ce conseil, car je trouve si grisant d’avoir son outil en local, entièrement maîtrisable, complètement ouvert ; c’est si stimulant de bidouiller son blog à l’envie et de vraiment le faire sien. Je suis ravi de l’utiliser, et je n’ai aucune raison d’envisager un changement.
Peut-être ferais-je un article sur l’aspect un peu plus technique de comment je déploie mon blog.

En tout cas, j’ai adoré recevoir ces messages. N’hésitez pas à m’écrire également ! Vous pouvez le faire ici.


  1. def Content Management System : système de gestion de contenu. Il s’agit d’un logiciel en ligne grâce auquel il est possible de créer, de gérer et de modifier facilement un site web, sans avoir besoin de connaissances techniques en langage informatique. définition par SalesForce ↩︎