Projet développement web
Nina Carducci
Optimisation SEO, performance et accessibilité d’un site web de photographe existant.
Stack technique
Contexte
Nina Carducci est un site portfolio de photographe déjà existant. L’objectif du projet était d’en améliorer les performances, le référencement naturel et l’accessibilité sans reconstruire entièrement le site.
Objectifs
- Analyser les performances du site existant.
- Optimiser les images et améliorer les temps de chargement.
- Renforcer le SEO technique et la structure sémantique.
- Améliorer l’accessibilité et corriger les problèmes détectés par les outils d’audit.
- Conserver le rendu et les fonctionnalités du site.
Visuels du projet
Audit initial
- Performance.
- SEO.
- Accessibilité.
- Poids des ressources.
- Chargement des images.
- Structure HTML.
- Métadonnées.
Performance
- Optimisation des médias pour réduire leur poids et améliorer le chargement.
- Révision du chargement des images et des ressources.
- Réduction du travail inutile côté navigateur lors des optimisations ciblées.
SEO
- Title pertinent.
- Meta description.
- Structure sémantique.
- Attributs alt.
- Amélioration de la hiérarchie des contenus.
Accessibilité
- Navigation clavier.
- Focus visible.
- Attributs ARIA lorsque nécessaires.
- Textes alternatifs.
- Structure sémantique.
- Amélioration du carousel et contrôle de l’interaction clavier.
Challenge principal
Améliorer significativement les performances et le référencement d’un site existant sans dégrader son rendu ni son expérience utilisateur. L’optimisation devait conserver l’identité visuelle, le contenu, les interactions, le fonctionnement du carousel et le responsive.
Solution apportée
La démarche repose sur un audit, l’identification des problèmes les plus coûteux, l’optimisation des assets, l’amélioration du HTML et des métadonnées, la correction de l’accessibilité, puis une nouvelle vérification avec Lighthouse et Chrome DevTools.
- Audit
- Correction
- Mesure
- Nouvelle correction
Résultats
- Le site a été allégé et optimisé afin d’améliorer son chargement, son référencement technique et son accessibilité, tout en conservant l’expérience et l’identité visuelle existantes.
Améliorations possibles
- Poursuivre les tests sur plusieurs appareils et connexions.
- Automatiser certains contrôles d’accessibilité.
- Surveiller les Core Web Vitals en production.
- Ajouter des tests de non-régression.
- Poursuivre l’optimisation des ressources au fil des nouveaux contenus.