meta-viewport-large
La balise meta viewport devrait autoriser un zoom jusqu’à 500 %
Vérifie que <meta name="viewport"> ne définit ni user-scalable=no ni un maximum-scale inférieur à 5 (500 %).
Applicabilité. S’applique aux éléments <meta name="viewport"> dotés d’un attribut content non vide.
Attendu. L’attribut content ne bloque pas le zoom avec user-scalable et ne définit pas de maximum-scale inférieur à 5 (500 %), lu comme le lisent les navigateurs, de la même façon que le lit meta-viewport-zoom-enabled. C’est l’équivalent plus strict de meta-viewport-zoom-enabled (qui impose le minimum AA de 200 % comme un fail normatif WCAG strict) ; cette règle ne repose sur aucun critère de succès WCAG : c’est une recommandation de bonne pratique, à titre indicatif, qui vise l’objectif plus élevé de 500 %.
Ce que rapporte un constat.
reasons: chaque réglage de l’attribut content qui limite le zoom, tel qu’écrit en minuscules, commeuser-scalable=nooumaximum-scale=2(inférieur à 5).
Ces champs de data.details aident à lire et à reproduire un constat. À part reasonCode et les quelques champs que la page Schéma de sortie donne comme stables, ils ne constituent pas un contrat stable : un champ peut être renommé ou supprimé dans une version mineure, ne vous appuyez donc pas dessus.
Exemples
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=5">
maximum-scale=5 (500 %) atteint déjà le plafond de bonne pratique visé par cette règle.
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
user-scalable=no empêche de zoomer au-delà de l’échelle de chargement de la page, en deçà de l’objectif de bonne pratique de 500 %.
Comment vérifier
Quand cette règle ne peut pas trancher, elle renvoie cantTell et laisse la question à une personne. Chaque question qu’elle peut poser figure ici sous son code de raison, avec les étapes pour y répondre. Un constat porte les mêmes étapes dans howToCheck, dans la langue de l’analyse. Voir Schéma de sortie.
VIEWPORT_ZOOM_BELOW_500
- Lisez le content de la balise meta viewport dans le code source de la page ; le rapport liste les réglages qui limitent le zoom, comme user-scalable=no ou maximum-scale=2.
- Ouvrez la page sur un téléphone ou dans l’émulation d’appareils du navigateur et zoomez en pinçant (ou avec le geste de zoom) aussi loin que possible.
- Notez si le zoom atteint 500 % et si le texte reste lisible.
Réussite. La page peut être zoomée à 500 %, sans user-scalable=no ni maximum-scale inférieur à 5.
Échec. Le zoom est bloqué ou s’arrête sous 500 %, ce qui manque l’objectif de bonne pratique allant au-delà du critère WCAG 1.4.4.