Ontworpen voor mobiel
Silktide laadt elke pagina op een gesimuleerd mobiel apparaat en controleert of deze daar überhaupt voor is ontworpen: of de pagina zich aanpast aan een smal scherm, of simpelweg een verkleinde desktopversie toont.
Waarom dit belangrijk is
Meer dan de helft van het webverkeer is mobiel. Een pagina die alleen op een desktop werkt, stelt het grootste deel van zijn publiek al bij de eerste tik teleur. Bezoekers die met piepkleine tekst en eindeloos in- en uitzoomen worden geconfronteerd, haken af. Zoekmachines, die eerst de mobiele versie van pagina's indexeren, rangschikken de site overeenkomstig.
Dit controle vangt het fundamentele probleem op — een pagina die helemaal geen mobiel ontwerp heeft — en niet problemen met de afwerking. Een pagina die slaagt, kan nog steeds kleinere mobiele problemen hebben die door andere controles worden afgedekt.
Hoe je dit oplost
De duurzame oplossing is , zodat dezelfde pagina zich aanpast aan elke schermbreedte. Als je site ouder is dan responsief ontwerp, betekent dit meestal een herbouw of een nieuw thema. De meeste moderne -thema's zijn standaard responsief. Concreet:
- Declareer in de head van elke pagina een mobiele :
<meta name="viewport" content="width=device-width, initial-scale=1">
- Gebruik flexibele lay-outs en -mediaquery's, zodat de inhoud op smalle schermen doorloopt in één kolom, in plaats van de pagina vast te zetten op een desktopbreedte.
- Houd de hoofdtekst op mobiel leesbaar — vermijd ontwerpen die de hele pagina verkleinen om deze passend te maken.
- Test op een echte telefoon of met de apparaatemulatie van je browser, bij breedtes tot ongeveer 320 pixels.
Hoe Silktide dit test
- Laad de pagina op een gesimuleerd mobiel apparaat.
- Controleer of de pagina een bruikbare viewport declareert. Een ontbrekende viewport, of een viewport die is vastgezet op meer dan 480 pixels, betekent dat de pagina niet slaagt — dit is het absolute minimum voor mobiele ondersteuning.
- Meet de zichtbare tekst: als meer dan 35% daarvan wordt weergegeven in een onleesbare grootte (minder dan 10 pixels na zoomen), slaagt de pagina niet.
- Meet hoe ver de pagina uitzoomt om op het scherm te passen: een zoomniveau van minder dan 60% van de normale grootte betekent dat de pagina feitelijk een desktoplay-out is en niet slaagt.
- Een pagina slaagt wanneer geen van deze problemen wordt aangetroffen. Silktide rapporteert ook hoeveel pagina's na verloop van tijd niet voor mobiel zijn ontworpen.
Problemen oplossen
Mijn pagina ziet er prima uit op mijn telefoon
Sommige pagina's lijken goed genoeg, maar voldoen toch niet aan een van de bovenstaande signalen — bijvoorbeeld door een viewporttag die is gegenereerd door een verouderde tool en een vaste breedte heeft. Bekijk de paginabron en controleer of de tag <meta name="viewport"> overeenkomt met de aanbevolen vorm.
De controle slaagt, maar mijn mobiele ervaring is slecht
Slagen betekent dat de pagina aan de basiseisen voldoet, niet dat deze optimaal is. Bekijk de gerelateerde controles voor kleine tekst, kleine tikdoelen en uitgeschakelde zoom.