Head
Les Méta tags
<!-- Doctype HTML5 -->
<!doctype html>
<!-- Définit l'encodage des caractères pour le document -->
<meta charset="utf-8">
<!-- Demande à internet Explorer d'utiliser son dernier moteur de rendu -->
<meta http-equiv="x-ua-compatible" content="ie=edge">
<!-- Viewport pour le responsive web design -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Titre du document (pas plus de 65 caractères) -->
<title>Titre de la page - Moins de 65 caractères</title>
<!-- Meta Description (Moins de 150 caractères) -->
<meta name="description" content="Description de la page">
<!-- Favicon standard -->
<link rel="icon" type="image/x-icon" href="https://exemple.com/favicon.ico">
<!-- Le format .png est recommandé, 32x32 -->
<link rel="icon" type="image/png" href="https://exemple.com/favicon-32x32.png">
<!-- Apple Touch Icon - pas obligé mais recommandé -->
<link rel="apple-touch-icon" href="/custom-icon.png">
<!-- Aide à prévenir les problèmes de duplication de contenu -->
<link rel="canonical" href="http://exemple.com/2017/09/nouvel-article-a-lire.html">
Les tags HTML
<!-- Langage du site spécifié -->
<html lang="fr">
<!-- Direction de lecture -->
<html dir="rtl">
HTML
Bonnes pratiques
- On utilise bien les éléments sémantiques (header, section, footer, main..)
- Les pages d’erreur 404 et 5xx existent bien. Pour les 5xx, le css est directement intégré sur la page.
- Noopener : pour les liens extérieurs utilisant target=’_blank’, utiliser l’attribut rel=’noopener’ pour prévenir le tabnabbing.
- On enlève les commentaires présents dans le HTML pour nettoyer la page.
Tester son HTML
- On vérifie les erreurs éventuelles sur les pages du site avec https://validator.w3.org/.
- On refait une beauté au code et on repère les erreurs avec https://dirtymarkup.com/.
- On teste les pages sur tous les navigateurs.
- Pareil pour les navigateurs mobiles.
- On s’assure qu’il n’y a pas de liens morts avec https://validator.w3.org/checklink.
Source
https://github.com/thedaviddias/Front-End-Checklist (anglais).