Zoom désactivé : pourquoi maximum-scale=1 ne doit jamais être publié

Le zoom par pincement est une fonction d'accessibilité fondamentale intégrée à tous les navigateurs mobiles : c'est ainsi qu'une personne malvoyante agrandit un texte trop petit pour être lu, sans aucun effort de la part du site. Quelques configurations de la balise meta viewport le désactivent complètement, et chacune d'elles échoue aux WCAG sans bénéfice réel.

C'est le critère de succès 1.4.4 des WCAG (Redimensionnement du texte), niveau AA.

L'erreur type

<!-- Désactive complètement le zoom par pincement -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

user-scalable=no comme maximum-scale=1 (ou toute valeur de maximum-scale trop proche de initial-scale) bloquent le zoom. Cette pratique était courante aux débuts du web mobile, pour éviter un zoom accidentel au double-tap, mais elle se paie directement par l'exclusion de toute personne qui a besoin de zoomer volontairement.

La correction

Il suffit de retirer les paramètres qui bloquent le zoom :

<!-- Autorise le zoom tout en fixant une échelle initiale raisonnable -->
<meta name="viewport" content="width=device-width, initial-scale=1">

Il n'existe pour ainsi dire aucun usage moderne où désactiver le zoom vaudrait son coût en accessibilité. Si le double-tap pour zoomer pose un réel problème d'ergonomie dans votre application (fréquent dans certaines interfaces très interactives), la correction consiste à traiter l'interaction en cause directement (par exemple via touch-action: manipulation sur les éléments concernés), et non à désactiver le zoom sur tout le site.

Pourquoi le verdict est ici parfaitement net

Contrairement à la plupart des vérifications WCAG, celle-ci n'a aucune zone grise : soit la balise meta viewport bloque la mise à l'échelle, soit elle ne la bloque pas, et aucune raison de conception ne justifie de la bloquer. C'est une correction d'une ligne dans un unique gabarit partagé, sans inconvénient, et l'un des changements d'une seule ligne les plus rentables lors d'un premier audit, pour tout site adaptatif qui traîne encore cette ancienne pratique.

Références officielles

• Deque University : meta-viewport