Verbinding mislukt. Probeer het opnieuw.

Naar inhoud springen
SEO Tools
Help en documentatie
UX / UI Kritieke impact Makkelijk 2 minuten

Viewport/mobiel display

De metaviewport zorgt voor een correcte weergave op mobiel.

Wat het is

De viewport-metatag vertelt de browser hoe de pagina moet worden geschaald naar de apparaatbreedte. Zonder dit wordt mobiel weergegeven op bureaubladbreedte en is alles "klein en uitgezoomd".

Waarom het belangrijk is

Google indexeert mobile-first – het evalueert voornamelijk de mobiele versie. Zonder een correcte viewport faalt de site in de mobiele bruikbaarheidstest, wat de ranking direct verlaagt, aangezien de meeste bezoeken via mobiel komen.

Hoe je het doet

  1. 1Voeg de standaard viewport-metatag toe aan <head>.
  2. 2Schakel zoom niet uit (maximum-scale=1 / user-scalable=no) — dit schaadt de toegankelijkheid.
  3. 3Controleer of de inhoud niet horizontaal overloopt en of de knoppen groot genoeg zijn (zie de UX-audit).

Voorbeeld

Goed
<meta name="viewport" content="width=device-width, initial-scale=1">

Conclusie

Een enkele regel in het hoofd, maar essentieel voor een mobile-first wereld. Zonder dit is de site vrijwel onbruikbaar op mobiel en Google bestraft dit zwaar. Test na de implementatie op een echte telefoon en in de mobiele bruikbaarheidstool.

Gerelateerde onderwerpen