Réparer une page inaccessible

Les huit défauts :

• pas d'attribut lang sur <html> ;
• un titre de page « Accueil » qui ne dit pas de quel site ;
• une <div> cliquable au lieu d'un lien ;
• une image sans alt ;
• un saut de <h1> à <h3> ;
• un lien « cliquez ici » ;
• un champ sans <label>, nommé seulement par son placeholder ;
• des tabindex positifs, et un bouton vide (sans nom accessible).

Version corrigée (le logo devient le lien vers l'accueil, la <div> un vrai lien dans un menu) :

<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Accueil — La Librairie du Campus</title>
</head>
<body>
  <header>
    <a href="index.html"><img src="logo.png" alt="La Librairie du Campus, accueil" width="160" height="48"></a>
    <nav aria-label="Navigation principale">
      <ul>
        <li><a href="catalogue.html">Catalogue</a></li>
      </ul>
    </nav>
  </header>
  <main>
    <h1>La Librairie du Campus</h1>
    <h2>Nouveautés</h2>
    <p><a href="catalogue.html">Voir tout le catalogue</a>.</p>
    <p>
      <label for="nom">Votre nom</label>
      <input id="nom" name="nom" type="text" autocomplete="name">
    </p>
    <p><button type="button">Rechercher</button></p>
  </main>
</body>
</html>

Elle passe le validateur sans erreur ; au clavier, l'ordre est : logo, Catalogue, lien « Voir tout le catalogue », champ, bouton.