Balise Viewport

Définition

La balise viewport est une balise meta HTML qui permet de contrôler l’affichage d’un site sur les écrans mobiles. Elle indique au navigateur comment adapter la page à la taille de l’écran, ce qui est indispensable pour le responsive design.

Points clés

Contrôle l’échelle et le zoom de la page sur mobile
Clé de l’adaptation responsive
Nécessaire pour être mobile-friendly

Importance

Sans balise viewport, un site s’affiche en version desktop sur mobile, entraînant un affichage cassé, un texte minuscule et un mauvais score UX. Google utilise cette balise pour déterminer si une page est optimisée mobile, ce qui impacte le SEO mobile.

Bonnes pratiques

Intégrer la balise : <meta name='viewport' content='width=device-width, initial-scale=1.0'>
Tester le rendu mobile avec Google Mobile-Friendly Test
Adapter la taille du texte et des boutons pour le confort utilisateur

Exemple concret

Un site de blog sans balise viewport s’affichait zoomé à 25 % sur mobile. Après ajout, le score Core Web Vitals mobile passe de 38 à 87.