Refonte du site web

  27 Novembre 2023
 Actualités, Article, Savoirs

Refonte du site web

Mon site commençait réellement à devenir trop vieux, trop lent, et trop difficile à maintenir.
Cet article est assez technique. Il intéressera sans doute mes quelques clients travaillant dans l‘informatique.

J’ai donc entrepris il y a deux mois de ré-créer totalement ce site avec des technologies récentes et les toutes dernières versions de WordPress, Php et MySQL. Pour les scripts côté client, j’ai dû développer certaines fonctions en Javascript « vanilla » pour éviter de rajouter la lourdeur d’environnements supplémentaires ou d’un JQuery vieillissant.

J’ai limité aussi le nombre d’extensions (plugins) qui permettaient des effets d’animation divers tout en alourdissant les pages HTML en développant moi-même les fonctions qui manquaient.

On change de look ?.. Non 🙂

On me complimente souvent sur mon site, son look et son ergonomie.
Alors j’ai voulu garder le même aspect (amélioré quand même) et la même organisation. Plus tard, je pourrais facilement le faire évoluer, ce qui devenait très difficile avec l’ancien site.

Par contre, j’ai trouvé dans l’existant tout un ensemble de petits bugs et d’incohérences graphiques qui sont maintenant corrigés.

Au commencement… je n’avais pas le temps.

J’avais donc utilisé un thème existant, avec ses qualités et surtout ses défauts. Puis j’avais peu à peu amélioré ce thème avec mes propres styles, en ajoutant des fonctions qui court-circuitaient les problèmes du thème choisi, et apportaient des fonctions manquantes.

WordPress était à l’époque dans une version où les textes des articles étaient tapés comme dans un traitement de textes, ce qui était pratique, mais qu’on devait modifier en html constamment pour obtenir ce qu’on voulait. Les nouvelles versions utilisent un système de mise en page qui permet de créer plus vite un contenu graphiquement présentable, mais comme j’avais commencé avec l’ancienne version, je devais désactiver ces fonctions.

Enfin, j’utilisais une trop grande quantité d’extensions pour ajouter les fonctionnalités qui me manquaient et que je ne voulais pas redévelopper moi-même par manque de temps.

Des problèmes à chaque mise à jour des logiciels.

À chaque nouvelle version d’un des composants du site, c’était un ensemble de défauts qui se faisaient jour, me demandant du temps de développement pour que tout fonctionne comme avant.

Le thème utilisé notamment avait la fâcheuse habitude de vouloir changer son look d’une version à l’autre, semant le désordre dans l’aspect de tout le site.

À la fin, il y avait deux fois plus de code écrit par moi pour corriger le fonctionnement que le code fourni par le thème choisi.

L’heure du choix

J’avais deux solutions :

  • Écrire un thème à partir de zéro (je l’ai déjà fait 3 fois dans le passé) pour me libérer de celui utilisé.
  • Choisir un thème moderne et super léger, pour l’étendre avec mes propres modifications qui resteraient stables.

 Évidemment, la première solution était la moins bonne, car prenant beaucoup de temps et avait le défaut de m’obliger à adapter régulièrement mon code selon les nouveautés de WordPress qui continue d’évoluer. Le seul avantage étant de récupérer toutes les pages et tous les articles du site directement. Un autre désavantage étant encore une fois d’éviter d’utiliser WordPress de façon actuelle, avec « Gutenberg », son système de création de modèles FSE et de mise en page.

 La deuxième solution présente l’avantage de laisser les problèmes de mises à niveau aux créateurs d’un thème minimaliste et léger. De plus, étant minimaliste, si ce thème cessait d’être suivi, il serait facile d’en prendre un autre du même genre avec peu de temps de réadaptation.

Le défaut est d’être obligé de développer les fonctions inexistantes, mais de toute façon il m’aurait fallu le faire si j’avais créé un thème moi-même. Un autre défaut, qui devient une qualité, est d’être obligé de refaire TOUTES les pages, TOUS les articles et événements, en mode « mise en page » selon les nouvelles normes de WordPress. Une fois fait, cela devient une qualité, car malgré le temps passé à reproduire ces pages presque à l’identique, on peut désormais tout gérer selon les dernières versions et ajouter plus facilement d’autres pages.

Enfin, la recréation de l’ensemble permet de conserver partout une même cohérence graphique.

Les surprises

Faire soi-même les effets de menu et d’animation prend du temps, mais ce n’est pas un problème. Les vrais problèmes viennent de promesses non tenues de WordPress quant au « wysiwyg » qui n’est pas à la hauteur. En effet, les blocs de texte ou de fonctions fournis par WordPress sont rudimentaires et leurs réglages sont limités ; j’ai dû prendre une extension pour en ajouter d’autres plus performants. Puis j’ai dû développer les fonctionnalités qui n’existaient pas.

Avec ça, les mises en pages, contenant des verrues de blocs de shortcodes appelant mes fonctions, ressemblent donc peu à ce qui est effectivement affiché. Mais ça marche bien et reste facile.

Le multilingue n’est pas encore géré par WordPress. J’utilisais donc une extension plutôt bonne « Polylang » pour gérer les permutations français-anglais. MAIS cette extension était plus complète avec l’ancienne version de WordPress, pour retrouver les fonctions manquantes sur la nouvelle version, il faut payer un abonnement. Si je commence à devoir payer un abonnement pour chaque extension, pour simplement faire ce qui était gratuit auparavant, mon site va engloutir mensuellement une grande partie de mes revenus. J’ai donc là aussi développé les fonctions multilingues manquantes, et plutôt mieux, car certains bugs non résolus de l’extension n’existent pas chez moi.

Résultat

Il m’a fallu deux mois (en travaillant 2 jours par semaine sur ce site) pour tout refaire.
La migration m’a aussi réservé des surprises, car la nouvelle version de WordPress est plus difficile à adapter d’un site local (mon ordinateur de développement) à mon provider pour la production sur le net. Mais c’est bon, j’ai développé les scripts unix permettant d’automatiser le processus.

Il reste quelques petites choses, notamment au niveau du référencement pour lequel je dois redéfinir des mots-clefs sur chaque page. Quelques améliorations sur téléphone portable également, et d’améliorations typographiques par endroits. Mais ce n’est pas bloquant et peu se faire tranquillement alors que le site est déjà accessible.

Le nouveau site est là, un peu plus joli tout en gardant le même look général, plus cohérent, et beaucoup plus léger et réactif. Et surtout, il me sera beaucoup, beaucoup plus facile de le maintenir et de le faire évoluer.

Ceux parmi vous qui ont « l’œil » verront immédiatement la différence.

Parlons plutôt d’autre chose

Oui, ce site est fait pour parler de massage, d’énergies, de bien-être et de méditation.
Je ferme donc la parenthèse technique pour revenir à ce qui est réellement important.

Portez-vous bien, et à bientôt.

S’abonner
Notification pour
guest

0 Commentaires
Le plus récent
Le plus ancien
Commentaires en ligne
Afficher tous les commentaires
0
Vous pouvez laisser un commentaire.x