J’ai traité ce site comme un projet client, avec ma méthode habituelle : comprendre, concevoir, réaliser, transmettre. Ce texte en garde la trace.
D’où je partais
Jusqu’au 2 octobre 2026, adour.io présentait une agence éditoriale pour des « structures de charme » : hébergements, lieux d’événements, domaines viticoles du Sud-Ouest. Avec deux offres, Studio et Studio+.
Cette spécialisation ne me ressemblait pas. Adour est devenu un studio de création digitale, avec deux offres autonomes : les sites internet et les outils sur mesure. Je ne me limite plus à un secteur. Je pars du besoin : présenter une activité, recevoir des demandes ou des réservations, vendre, ou gagner du temps avec un outil.
Les anciennes adresses n’ont pas disparu : chacune renvoie vers la page nouvelle la plus proche. Le jour de la mise en ligne, j’ai vérifié 13 de ces renvois.
La direction « Lettres »
J’ai exploré plusieurs pistes graphiques. Je les ai comparées sur écran, animations comprises, puis j’ai retenu celle des lettres. Deux idées la portent.
La typographie vit. Sur ordinateur, les lettres des grands titres s’élargissent et s’épaississent autour du pointeur. Sans pointeur, une vague lente les parcourt deux fois, puis se pose. Sur téléphone, un appui fait gonfler les lettres sous le doigt.
Le point relie tout. Le point vermillon de « adour. » est à la fois le logo, les puces, le fil de progression et les boutons. Quand vous changez de page, un cercle de la couleur de la page suivante couvre l’écran. À l’arrivée, il se rétracte dans le point du logo.
Chaque page a son univers de couleurs : le bleu des outils, le sable de la méthode, le rouge profond de la page Nicolas. Les polices et les mouvements restent les mêmes partout. Et chaque page n’a qu’un seul mouvement qui lui est propre : il montre quelque chose, ou il répond à votre geste. Il ne sert pas de décor.
Les exemples animés de l’accueil et des pages d’offres sont des démonstrations fictives. Elles sont toujours signalées comme telles.
Des choix techniques, en clair
Un site statique
Les pages sont fabriquées une fois, à l’avance, puis servies telles quelles. Rien n’est calculé, rien n’est cherché dans une base de données quand vous arrivez. Il y a moins de pièces en jeu.
Des polices chez moi, allégées
Les quatre polices du site (Archivo, Fraunces, Instrument Serif et JetBrains Mono) sont hébergées sur adour.io. Votre navigateur ne les demande à aucun autre service.
J’ai retiré de chaque fichier les caractères dont le site ne se sert pas : de 27 à 38 % de poids en moins selon le fichier. J’ai gardé l’alphabet français complet, pour que ce que vous tapez dans le formulaire s’affiche dans la bonne police. Avant de valider, j’ai comparé l’affichage avant et après, image par image : aucune différence sur 1 408 comparaisons, à 7 tailles d’écran, dans les moteurs de Chrome et de Safari.
Aucun cookie
Le 2 octobre 2026, je n’ai relevé aucun cookie sur adour.io, ni dans le navigateur ni dans les réponses du serveur. Le site garde seulement, le temps d’un changement de page, la couleur de la transition. Il la range dans une mémoire du navigateur propre à l’onglet, et l’efface dès l’arrivée.
Pour compter les visites, j’ai choisi Cloudflare Web Analytics, qui selon Cloudflare n’utilise pas de cookie.
Une version mobile repensée
Ce n’est pas la version ordinateur en plus petit : chaque page a été revue sur téléphone. Le bouton « Menu » offre une cible plus large (89 × 48 px). Au toucher, le cercle de transition part du point touché et dure moins longtemps (600 ms au lieu de 780 ms). Les boutons du premier écran s’empilent sur toute la largeur.
Un détecteur automatique a parcouru les 12 pages du site, à 5 tailles de téléphone, avec les animations réduites : aucun texte superposé, coupé, hors de l’écran ou trop petit.
Les animations réduites, respectées
Si vous avez demandé à votre téléphone ou à votre ordinateur de réduire les animations, le site suit ce réglage : chaque page s’affiche complète, sans mouvement. Vous pouvez le vérifier vous-même.
Une page qui ne saute pas
Le texte reste invisible tant que les polices ne sont pas arrivées. Au début, les grands titres prenaient leur taille juste après, et le reste de la page descendait d’un coup. Maintenant, la page attend que le titre ait sa taille, puis tout paraît en même temps, déjà à sa place. Au plus 4 secondes d’attente, même si quelque chose échoue.
Ce que j’ai mesuré
Ce sont des mesures de laboratoire : un outil simule un appareil et une connexion. Ce ne sont pas des mesures de vrais visiteurs.
Lighthouse, le 2 octobre 2026
Lighthouse est l’outil de mesure de Google, intégré à Chrome. Je l’ai lancé sur les 11 pages du site, dans leur version de test (la préproduction), juste avant la mise en ligne. Deux modes : un téléphone simulé (le Moto G de Lighthouse, sur une connexion 4G lente simulée) et un ordinateur. Trois mesures par page et par mode ; je garde la valeur du milieu.
Résultats, après l’allègement des polices :
- Performance, une note sur 100 : de 96 à 100 sur téléphone selon la page, 100 sur toutes les pages sur ordinateur.
- Temps avant l’affichage du plus grand élément (en général le titre) : de 1,37 à 1,97 s sur téléphone, de 0,34 à 0,50 s sur ordinateur.
- Temps pendant lequel la page ne répond pas : 0 ms sur toutes les pages.
- Poids des pages sur téléphone : de 130 à 325 Ko selon la page, 189 Ko pour l’accueil. L’allègement des polices a retiré de 26 à 124 Ko selon la page.
- Accessibilité, une note sur 100 : 100 sur toutes les pages, sauf 96 pour la Méthode et pour l’accueil sur ordinateur.
Sur la Méthode, ce 96 vient d’un choix. Les étapes pas encore « allumées » ont un contraste de 3,1 à 3,5:1, c’est-à-dire l’écart de lisibilité entre le texte et le fond. C’est au-dessus du minimum de 3:1 que je me suis fixé pour cet effet. Sur l’accueil, deux petites étiquettes manquaient de contraste : je les ai corrigées après la mesure.
La stabilité de la page
Lighthouse mesure aussi ce qui bouge pendant l’affichage. Le score vaut 0 quand rien ne bouge ; Google le juge bon sous 0,1. Le 2 octobre, sur téléphone, quatre pages dépassaient ou approchaient ce seuil : 0,121 pour la Méthode, 0,106 pour le cas thérapeute, 0,080 pour les mentions légales et 0,081 pour la confidentialité.
Après le correctif décrit plus haut (la page attend que le titre ait sa taille) :
- avec Lighthouse : 0 sur la Méthode, le cas thérapeute et la page Sites internet (0,068 avant) ;
- avec mon propre script de mesure (moteur de Chrome, connexion lente et processeur ralenti simulés, valeur du milieu de 3 chargements), à 3 tailles de téléphone : 0,000 sur la Méthode, le cas thérapeute, les mentions légales et la confidentialité.
Le correctif ne retarde pas l’affichage : le temps avant l’affichage du plus grand élément est le même avant et après, sur les trois pages mesurées.
Je n’ai pas relancé toute la série Lighthouse après ce correctif : les notes de performance plus haut datent d’avant.
Ce que je n’affirme pas
- Une bonne mesure technique ne dit rien de ce qu’un site rapporte.
- Je n’ai pas mesuré la fréquentation : la mesure d’audience n’était pas encore active le jour de la mise en ligne.
- Ces chiffres viennent du laboratoire. Les mesures de vrais visiteurs viendront plus tard, et je les publierai avec leur date.
- Une note Lighthouse varie d’une mesure à l’autre. C’est pour cela que je garde la valeur du milieu de trois.
- Les contrôles automatiques passent par les moteurs de Chrome et de Safari. Sur un vrai appareil, je n’ai testé que mon iPhone.
Et pour votre site ?
Vous avez déjà un site ? On regarde d’abord ce qui fonctionne et ce qui manque. Selon le cas, je propose une amélioration ciblée ou une refonte, chiffrée dans le devis.