Retour au portfolio

Changelog

Historique des versions et de l'amélioration continue

Version 0.14.0 4 Mars 2026 Perf & Fixes

Optimisation & Performances

  • Suppression de l'Alpha Blending : Remplacement des opacités et couleurs avec transparence par des couleurs pleines solides dans les fichiers CSS. Cela améliore le rendu navigateur en allégeant les calculs de composition, notamment en Dark Mode.

Correctifs & Données

  • Encodage des caractères : Correction de pannes globales de rendu UTF-8 (mojibakes et accents littéraux perdus) sur la page Recommandations et Changelog.

Version 0.13.0 3 Mars 2026 Refinement

Harmonisation - Système de Design Global

  • Synchronisation CSS : Alignement complet de shared.css sur style.css. Intégration des déclarations @font-face manquantes (Lufga, Space Grotesk, Recoleta Alt) et synchronisation des variables de tokens (social-proof, bordures dark mode).
  • Cohérence visuelle : Portabilité de la barre de défilement personnalisée et des styles de sélection de texte sur l'ensemble des sous-pages du portfolio.

Correctifs - Ergonomie & Responsive

  • Responsive Modale : Correction du défaut de centrage et de troncature de la modale d'accessibilité sur les petits écrans (iPhone 5s, Redmi Note 11s) via une méthode de positionnement inset: 0 plus robuste et des largeurs basées sur calc().
  • Typographie projet : Correction du bug de fallback sur les titres H1 des pages projets qui n'affichaient pas la police Recoleta par défaut.

Version 0.12.0 3 Mars 2026 Improvement

Accessibilité globale — Modale & préférences persistantes

  • Modale d'accessibilité universelle : Injection du bouton de paramètres et de la modale d'accessibilité sur toutes les pages HTML du site (404.html, transparence.html, changelog.html, recommandations.html, sncf-voyageurs-ter.html, style-guide.html). Les réglages (son, typographie dyslexie, animations réduites) persistent désormais via localStorage sur l'ensemble du site.
  • Typographie Dyslexie : Intégration de la police Atkinson Hyperlegible du Braille Institute comme alternative typographique accessible, avec espacement accentué.
  • Icônes mode sombre/clair : Correction du bug d'affichage des icônes soleil/lune sur les sous-pages — passage d'une logique style.display bloquée par la CSP à une logique purement CSS via :root[data-theme].
  • Harmonisation CSS : Migration des styles de la modale d'accessibilité (dialog.a11y-modal, interrupteurs, variables de couleurs) de style.css vers shared.css pour une cohérence visuelle complète sur toutes les pages.

Sécurité — Révision de la politique CSP

  • CSP adaptée au contexte portfolio : Simplification de la Content-Security-Policy dans .htaccess — suppression des directives trop restrictives incompatibles avec les extensions navigateur. La politique retenue (frame-ancestors 'none' + HSTS + nosniff) offre une protection proportionnée à un site statique sans données utilisateur.
  • Suppression des headers superflus : Retrait de X-Frame-Options (redondant avec frame-ancestors), Referrer-Policy et Permissions-Policy non nécessaires pour un portfolio statique.

Version 0.11.0 2 Mars 2026 Improvement

Audit holistique — Correctifs P1 & P2

  • Design System — Tokens CSS (P1) : Remplacement de toutes les valeurs px « magiques » résiduelles par des variables CSS dans projects.css (.site-footer, .contact-actions--centered, .journal-link) et style.css (.greeting, .hero-text, .description, .availability) pour garantir la cohérence de la grille de 8px.
  • Nettoyage inline styles (P2) : Suppression des 17 attributs style="margin-top: 0;" présents sur chaque .changelog-section-title dans changelog.html — remplacés par une règle CSS dédiée dans projects.css respectant la séparation des préoccupations.
  • Landmark ARIA vide (P2) : Suppression du <footer class="page-footer"></footer> vide dans changelog.html — un landmark sans contenu est une violation RGAA (critère 12.6).
  • AEO — Sémantique LLM (P2) : Encapsulation de la liste de compétences (.skills-list) dans un <section aria-labelledby="skills-heading"> dans index.html pour faciliter l'extraction sémantique par les moteurs IA et LLMs.
  • Sécurité & CSP (P2) : Migration des derniers styles inline (.footer-links et .performance-badges) vers les feuilles de styles externes, permettant la suppression de la directive 'unsafe-inline' dans la Content Security Policy (CSP) via .htaccess.

Finitions SEO, UX & Architecture

  • Refonte du Guide de Style : Migration intégrale des styles internes et inline de style-guide.html vers une feuille de style externe dédiée style-guide.css. Adoption de classes sémantiques (BEM-light) en remplacement des propriétés CSS directes.
  • Métadonnées Auteur (humans.txt) : Liaison systématique du fichier humans.txt dans le <head> de toutes les pages via la balise link rel="author", renforçant l'identité numérique et l'AEO.
  • Amélioration UX Page 404 : Ajout du Journal de bord dans la liste des ressources de secours sur la page d'erreur 404 pour réduire le taux de rebond.
  • Nettoyage sémantique Recommandations : Suppression des titres <h2> redondants dans recommandations.html. Utilisation de aria-label sur les <article> pour maintenir une accessibilité exemplaire sans pollution visuelle.
  • Maintenance & Liens morts : Retrait définitif de toutes les références vers les pages obsolètes (Journal de bord et Accessibilité/Éco-conception en HTML séparé).
  • Identité visuelle — Harmonisation Typographique : Application systématique de la police Recoleta (via la variable --font-heading) sur tous les titres principaux (h1) des sous-pages (Recommandations, Changelog, Études de cas) pour garantir une cohérence de marque Premium avec la page d'accueil.

Version 0.10.0 28 Février 2026 Improvement

Navigation Footer — Séparateurs visuels

  • Séparateur « | » entre les liens : Ajout d'un pipe visuel entre les liens du footer (Engagements | Recommandations | Version 1.0.0) via le pseudo-élément CSS ::after sur .journal-link:not(:last-child), sans modification du HTML sémantique.
  • Correction de l'espacement : Suppression du padding horizontal sur .journal-link et neutralisation du gap du conteneur flex via .footer-links { gap: 0 !important }, afin que les margin du pipe soient symétriques (8px de chaque côté).
  • Propagation sur toutes les pages : Ajout du wrapper <div class="footer-links"> dans les cinq sous-pages (transparence.html, recommandations.html, sncf-voyageurs-ter.html, journal-de-bord.html, accessibilite-eco-conception.html) et intégration des règles CSS dans projects.css pour que les sous-pages (qui ne chargent pas style.css) bénéficient aussi du séparateur.

Version 0.9.9 28 Février 2026 Fix

Affichage SVG

  • Spécificité d'affichage SVG : Remplacement de l'utilisation de l'attribut HTML `hidden` au profit de déclarations de style "inline" (`display: none;` et `display: block;`) en JavaScript pour le basculement fiable et réactif du bouton Mettre en Pause / Lecture du "Phrase Rotator" sur la page d'accueil, court-circuitant ainsi les potentielles surcharges provenant d'autres règles CSS de la page.

Version 0.9.8 28 Février 2026 Feature

Accessibilité : Contrôle Utilisateur

  • Panneau d'accessibilité : Ajout d'une modale permettant d'activer une typographie adaptée (dyslexie), de couper le son et de désactiver les animations.
  • Contrôle des animations : Bouton interactif Pause/Lecture ajouté pour le texte défilant du Hero Header.
  • Conformité RGAA 4.1.2 : Amélioration ARIA des boutons à bascule (switch) pour les lecteurs d'écran.

Version 0.9.7 27 Février 2026 Fix

Harmonisation Étude de cas SNCF

  • Correction Layout : Résolution des problèmes d'alignement et de disposition sur la page sncf-voyageurs-ter.html. Centrage corrigé pour le contenu principal, la zone de contact et le footer, afin d'assurer la cohérence avec le reste du site.
  • Ajustement Flexbox : Modification du comportement d'affichage de body.case-study pour restaurer un flux de document normal, réparant ainsi un conflit visuel issu des restructurations CSS récentes.

Optimisation de la page Transparence

  • Badges de performance : Déplacement des indicateurs (EcoIndex et PageSpeed) du footer vers l'en-tête de la page Transparence et mutualisation de leur CSS dans la feuille de styles commune.
  • Ancrage et Navigation : Ajout d'une marge de défilement (scroll-padding-top) et d'un défilement doux (scroll-behavior: smooth) sur le document pour corriger le fait que le menu masquait les titres de la section une fois l'ancrage activé.
  • Structure CSS : Nettoyage d'une erreur (accolade superflue) dans style.css rétablissant la bonne application des media queries d'accessibilité.

Version 0.9.6 27 Février 2026 Improvement

Design System & Architecture CSS

  • Design Tokens : Implémentation complète d'un système de variables sémantiques (Design Tokens) à l'échelle globale. Les espacements (grille de 8px), les teintes (primitives et abstraites), et les rayons de bordures sont désormais gérés de manière centralisée dans :root.
  • Typographie Fluide : Remplacement des valeurs statiques de texte et des media queries par des fonctions clamp() pour assurer une fluidité typographique transparente entre mobiles et grands écrans.
  • Accessibilité des contrastes : Ajustement fin des teintes de survol et des badges (ex: couleurs de la balise "Compétences" en #EEEEEE) pour garantir le ratio de contraste, y compris dans le thème sombre.

Version 0.9.5 25 Février 2026 Fix

Cohérence UI — Footers

  • Harmonisation des footers : Alignement de .version-link sur le style des liens de l'index — même font-size (0.85rem), font-weight (500) et opacity (0.85). Suppression du text-decoration: underline incohérent sur .page-footer a.
  • Espacement footer Recommandations : Remplacement des séparateurs . par • et compactage du HTML sur une ligne pour un espacement strictement uniforme entre les éléments inline.
  • Correctif .version-link : Passage en display: inline (suppression du padding: 8px) pour éviter un espace visuel asymétrique lorsque le lien est inclus dans du texte courant.

Version 0.9.4 25 Février 2026 Patch

Audit Scan 360 v4 — Correctifs P0 à P2

  • Sécurité (P0) : Suppression de l'email Gmail en clair dans le CSS d'impression — remplacé par attr(data-print-email) pour préserver l'obfuscation JS.
  • Sécurité (P0) : Suppression du faux encodage Base64 dans more.js — l'URL du Book PDF est désormais directe avec commentaire explicatif honnête.
  • SEO (P1) : Ajout de la balise og:title manquante dans index.html — optimise le partage sur LinkedIn, WhatsApp et Facebook.
  • AEO (P1) : Remplacement du schéma JSON-LD Person par CreativeWork sur la page étude de cas SNCF — meilleure indexation Knowledge Graph.
  • Compatibilité (P2) : Protection try/catch ajoutée sur localStorage.getItem hors IIFE pour éviter un crash en navigation privée Safari.
  • Compatibilité dark mode : Revert d'une régression sur la gestion des icônes soleil/lune — retour à style.display pour garantir leur visibilité à l'initialisation.
  • Accessibilité RGAA (P2) : Ajout du cite attribut sur le <blockquote> et de la balise <cite> sur la source Frédérique Maurel — conformité critère 1.1.
  • Performance RGESN (P2) : Réintégration de content-visibility: auto sur .social-proof — lazy rendering natif.

Optimisations Expertes

  • Meta description (OPT-01) : Correction de la virgule manquante et reformulation SEO plus explicite.
  • JSON-LD Person (OPT-02) : Enrichissement avec availableLanguage, address (Lyon / Auvergne-Rhône-Alpes) et ajout de CRO / UX Writing dans knowsAbout.
  • UX (OPT-06) : Toast accessible (role="status", aria-live="polite") après clic sur le lien email — informe l'utilisateur et propose LinkedIn en alternative si le client mail est absent.
  • RGPD (OPT-09) : La date de disponibilité validUntil n'est plus exposée en clair dans l'objet global JS — remplacée par un getter dynamique sur le DOM.
  • Accessibilité (OPT-10) : Focus sur le h2 du dialog Konami corrigé via :focus:not(:focus-visible) — outline conservé pour les utilisateurs clavier et lecteurs d'écran.

Version 0.9.3 25 Février 2026 Improvement

Optimisation Performance & Sécurité

  • Performance (CLS) : Élimination du Cumulative Layout Shift sur la section témoignages et amélioration du min-height du rotateur de phrases sur mobile.
  • Accessibilité (100%) : Correction du label-content-name-mismatch sur les labels ARIA et renforcement du contraste des couleurs sur le badge de disponibilité et les signatures.
  • Lighthouse : Atteinte du score cible de 100/100 en Accessibilité et SEO.

Version 0.9.2 24 Février 2026 Fix

Accessibilité et conformité RGAA 4.1.2

  • Contraste parfait (Critère 3.3) : Augmentation des opacités sur les liens secondaires (.case-link, .journal-link, et pieds de page) pour garantir un ratio de contraste d'au moins 3:1 avec leur arrière-plan.
  • Liens textuels explicites (Critère 10.6) : Ajout systématique d'un soulignement visible indépendamment de la couleur d'accent pour tous les liens injectés de manière fluide dans du texte classique.
  • Liens contextuels (Critère 6.1) : Ajout d'attributs ARIA stricts (ex: aria-label spécifique sur "Voir le projet") pour que les lectures hors de leur contexte visuel demeurent toujours claires pour les lecteurs d'écran.
  • Accessibilité des documents PDF (Critère 13.3) : Les liens vers les documents téléchargeables informent désormais explicitement l'utilisateur de l'extension de fichier et de l'ouverture dans une nouvelle fenêtre.

Composants de Navigation & UI

  • Uniformisation du Changelog : Création de cette page unique et versionnée permettant de documenter systématiquement toutes les implémentations pour plus de transparence technique.
  • Version Link : Les métadonnées du pied de page pointent désormais interactivement vers le Changelog.

Version 0.9.1 23 Février 2026 Improvement

Architecture structurelle

  • Harmonisation CSS : Harmonisation des espacements marginaux et des largeurs maximales parentes (alignement sur index.html) sur la totalité des sections principales du site (page « Transparence », « Recommandations » et vues documentaires).
  • Sémantique Recommandations : Refonte de la disposition sémantique sur la page de Recommandations. Implémentation complète de balises <figure> / <figcaption> afin de nouer le témoignage de retour client (blockquote) avec le nom et rôle de sa source attitrée pour le respect de la norme RGAA (Critère 9.4).

Ergonomie et Fluidité du parcours

  • Retour en Haut : Ajout fluide d'une ancre d'interaction `Retour en Haut` permettant un redressement scroll rapide sur les grands gabarits transversaux (telles que les pages « Bonnes Pratiques » et « Témoignages »).
  • Refonte totale du module Skip-link (lien d'évitement) : Remplacement de l'ancienne méthode de masquage CSS basée sur une animation (transform: translateY(-150%) qui provoquait des bugs de positionnement) par une méthode d'escamotage robuste inspirée du motif .sr-only (taille de 1px recadrée via clip) s'affichant en position fixed au clavier.

Version 0.9.0 Février 2026 Improvement

Refonte des principes Transparents

  • Remaniement de l'approche communicationnelle d'accessibilité vers un espace dédié. Remplacement de l'architecture modale « RGESN » en un répertoire exhaustif global des engagements Web et Dev.
  • Restructuration de l'index de contenu en huit catégories méticuleuses reflétant les standards majeurs de sécurité et d'ingénierie front-end.
  • Premières itérations architecturales pour un meilleur encadrement ARIA et sémantisme SEO en Single Page (révisant les fusions canoniques et descriptions de l'auteur).

Version 0.8.1 12 Février 2026 Patch

Design System & Typographie

  • Cohérence Typographique : Harmonisation des composants textuels et restauration de la typographie de marque (`Plus Jakarta Sans`) de façon consistante sur tous les nœuds de la page d'accueil (Hero section, animations rotatives et liens).
  • Performances d'affichage : Alignements de la nomenclature des polices hébergées localement avec les déclarations CSS pour garantir l'indépendance de chargement (Zéro tracker externe/Google Fonts).
  • Identité Verbale : Restauration du discours de marque originel sur les phrases rotatives (`app.js`) pour refléter précisément la philosophie d'interface ciblée par Grégory Desplaces.

Optimisation d'Impression (Print CSS)

  • Lisibilité Papier : Refonte du comportement physique de l'interface lors de l'impression : nettoyage des cibles interactives, passage en schéma colorimétrique strict (Noir & Blanc), et épuration des ancrages non pertinents pour un rendu net sur papier.

Version 0.8.0 11 Février 2026 Improvement

SEO Technique & Référencement IA (AEO)

  • Données Structurées : Enrichissement sémantique des structures de données (JSON-LD) avec la triple intégration des schémas WebSite, Person, et ProfessionalService pour maximiser la lisibilité algorithmique.
  • Métadonnées Réseaux Sociaux : Actualisation des balises métadonnées Open Graph (Facebook/LinkedIn) et Twitter Cards afin d'améliorer l'expérience de partage des URLs.
  • Crawl Budget : Affinage du contexte des robots d'exploration : validation des URLs canoniques, attributs d'accessibilité sur les icônes de structure, et configurations ciblées dans le robots.txt.

Version 0.7.0 10 Février 2026 Improvement

Mode Sombre & Ergonomie Globale

  • Thème Sombre Adaptatif : Implémentation complète d'un thème "Dark Mode" adaptatif, respectant à la fois les préférences du système d'exploitation et laissant un droit de forçage manuel à l'utilisateur via une interface de toggle dédiée.
  • Palette Réactive : Mise en place d'une architecture de variables CSS natives gérant des palettes sémantiques réactives selon le contexte d'éclairage.
  • Grille de 8px : Rationalisation des espaces sur une grille rythmique de 8 pixels, augmentant la clarté, l'aération et la cohérence de l'Information Architecture (IA).
  • Éco-conception : Mise en conformité RGPD (suppression des traceurs inutiles) et RGESN (allègement des actifs multimédias pour l'éco-conception).
  • Accessibilité Mobile : Retouches UI ciblées assurant un dimensionnement suffisant (Touch Targets) des icônes pour la navigation tactile.
↑ Retour en haut

Paramètres d'accessibilité

Désactive les effets sonores au survol et au clic.

Utilise la police Atkinson Hyperlegible plus lisible avec des espacements accentués.

Désactive les transitions CSS et les animations automatiques.