Parent : [[INDEX-WEB-UIUX]]

Front-End Checklist — Qualité et bonnes pratiques frontend

Source

Site : https://frontendchecklist.io
Repo GitHub : https://github.com/thedaviddias/Front-End-Checklist
MCP server : https://mcp.frontendchecklist.io
Auteur : David Dias
Licence : Open source (MIT)

Résumé

Front-End Checklist est un corpus de 385 règles réparties en 11 catégories couvrant les bonnes pratiques frontend modernes. C'est un outil de quality gate avant lancement, pas un guide de création de site de A à Z.

Les 11 catégories

Catégorie	Ce qu'elle couvre
Accessibility	WCAG, design inclusif
CSS	Styling, responsive, optimisation
HTML	Markup sémantique, structure
I18n	Localisation, langues
Images	Optimisation, responsive images
JavaScript	Patterns modernes, organisation
Performance	Core Web Vitals, rendering
Privacy	Consentement, tracking, données
Security	Bonnes pratiques sécurité
SEO	Meta tags, search optimisation
Testing	Stratégies de test et QA

Checklists prêtes à l'emploi

Launch Checklist — avant mise en prod
SEO Audit — audit référencement
Performance Quick Wins — gains rapides perfs
Accessibility Essentials — WCAG core

Pourquoi l'utiliser

Gate avant ship : complète parfaitement KNOW-PAT-143 et KNOW-PAT-155.
Couverture large : HTML, CSS, JS, SEO, perf, a11y, sécurité, privacy, images, i18n, testing.
Agent-friendly : MCP server pour intégrer les règles dans les workflows IA/code review.
Open source : 73K+ stars, maintenu, communauté active.

Ce que ça ne remplace PAS

Design / UX : pas de direction créative, de recherche utilisateur, ni de design system.
Backend / API : ne couvre pas l'architecture serveur, la base de données, l'authentification.
Déploiement / DevOps : ne traite pas l'infra, le CI/CD, le monitoring.
Stack choice : ne choisit pas le framework (React, Vue, etc.) — voir KNOW-PAT-197.

Quand l'utiliser

Moment	Usage
Avant chaque ship	Passer la Launch Checklist
Code review	MCP server pour vérifier les règles critiques
Audit qualité	SEO Audit + Accessibility Essentials
Optimisation	Performance Quick Wins

Intégration proposée dans notre workflow

Phase design : utiliser KNOW-REF-004/KNOW-REF-005 pour l'ancrage visuel.
Phase dev : appliquer KNOW-PAT-111 (design tokens), KNOW-PAT-142 (ARIA), etc.
Phase pre-ship : passer Front-End Checklist + KNOW-PAT-143 + KNOW-PAT-155.
Phase post-ship : Lighthouse/axe pour les preuves (KNOW-PAT-145).

Références liées

[[KNOW-PAT-143]] — Checklist qualité rendu — gate avant ship (web/UI)
[[KNOW-PAT-155]] — Gate excellence — master checklist avant demo ou ship
[[KNOW-PAT-145]] — Vérification Lighthouse + axe — preuves de qualité rendu
[[KNOW-REF-004]] — Catalogue de galeries d'inspiration web design
[[KNOW-PAT-197]] — Stack Chooser 2026