Le site d’ABD Web Studio

Le point de départ

ABD Web Studio avait besoin d’un site qui présente l’activité, la méthode et la façon de travailler, et qui fasse lui-même la preuve de ce qu’il annonce. Chaque page part de faits vérifiables : aucun contenu n’y a été inventé pour la remplir.

Les choix de conception

Une idée directrice, le sur-mesure. Le titre de la page d’accueil est ajusté à la largeur de l’écran, et une ligne de cote affiche sa mesure réelle. La page indique aussi son temps d’affichage et son poids, mesurés sur l’appareil du visiteur.
Un univers de poste de pilotage. Un fond graphite, un cyan vif réservé aux actions et aux mesures, une touche d’or dans l’emblème. Une seule famille de caractères, Archivo, dont la largeur variable sert du texte courant aux grands titres.
Des sections qui ne se ressemblent pas. Les services en texte, un sélecteur « Vous êtes… » par métier, la méthode posée sur une règle graduée avec ce que vous recevez à chaque étape, des engagements signés. Aucune grille de cartes identiques ni d’étapes numérotées.
Des contenus honnêtes. Les informations encore inconnues sont signalées « À fournir » plutôt que remplacées par des textes inventés.

Les choix techniques

Site statique généré avec Astro : aucun framework JavaScript dans le navigateur, seulement quelques scripts courts (menu mobile, formulaire, mesures de la page d’accueil). L’assistant du site ne charge sa logique qu’à la première ouverture.
Police auto-hébergée : aucune requête vers un service tiers pendant la visite.
Politique de sécurité du contenu (CSP) appliquée à chaque page.
Plan du site et fichier robots générés automatiquement.

Les vérifications

Mesures et tests réalisés en local le 10 octobre 2026, sur la version actuelle du site, à refaire en conditions réelles après la mise en ligne.

Affichage : contrôlé visuellement à 375 px (mobile), 768 px (tablette) et 1 440 px (bureau). Aucun défilement horizontal sur les sept pages, de 320 à 1 920 px de large. Menu mobile testé au clavier : le focus reste dans le menu ouvert, la touche Échap le referme et rend le focus au bouton, l’état est annoncé aux technologies d’assistance.
Accessibilité : audit automatisé axe-core (WCAG 2.2, niveaux A et AA) sans aucune violation sur les sept pages, en largeur bureau et mobile. Tous les contrastes de couleurs calculés sont conformes (4,5:1 au minimum pour le texte).
Formulaire : validation testée avec des champs vides, une adresse e-mail invalide et un message trop court.
Version de production : politique de sécurité active sans erreur dans la console, toutes les pages et tous les liens internes répondent, page 404 servie pour une adresse inconnue.
Poids : 106 Ko transférés à l’ouverture de la page d’accueil avec la compression Brotli, dont 88 Ko pour la police. La capture de la section Réalisations (11 à 29 Ko selon l’écran) ne se charge qu’au défilement.

Ces vérifications ont permis de corriger, avant la livraison, un bouton illisible dans le bandeau de contact, un décalage des titres dans la section Méthode et une espace manquante sur la page Contact. Une revue de code a ensuite conduit à sécuriser le menu pour les navigateurs plus anciens, à mieux gérer le focus au clavier et à rendre le titre d’accueil robuste à toutes les largeurs d’écran. La nouvelle identité sombre a été vérifiée de la même façon ; elle a conduit à réduire la taille des titres des pages intérieures sur les très petits écrans, où un mot long dépassait.

Ce qui reste à faire

Contenus à compléter : photo, adresse et numéro SIRET (en cours d’attribution).
Mise en ligne : nom de domaine, hébergement et clé du formulaire de contact.
Mesures en conditions réelles après la mise en ligne.