Webpagina’s die zijn geoptimaliseerd voor gebruik op mobiele apparaten, verschillen van pagina’s die worden weergegeven op desktop- en laptopcomputers. De laatste zijn ontworpen voor grote schermen en nauwkeurig klikken met de muis, terwijl mobiele webpagina’s het formaat hebben voor kleinere schermen en onnauwkeurig tikken met de vinger. Mobiel
- Ontworpen voor kleinere schermen en onnauwkeurig tikken met de vingers.
Bureaublad
- Ontworpen voor grote schermen met nauwkeurig klikken met de muis.
Aangezien de meeste websitebezoeken afkomstig zijn van mobiele apparaten, hebben site-ontwerpers de taak om versies te leveren die werken met zowel mobiele apparaten als desktopcomputers. De meest gebruikelijke benadering is het gebruik van responsive webdesign, dat automatisch de juiste versie levert op basis van het apparaat en de schermgrootte van de gebruiker, zoals gedetecteerd door de browser. In ieder geval onderscheiden mobielvriendelijke webpagina’s zich op een aantal manieren van desktopversies.
Pagina-ontwerp: mobiele schermen hebben minder ruimte
Mobiel
- Smartphone- en tabletschermen hebben een diagonaal van 4 tot 10 inch.
- Inklapbare of uitbreidbare menuwidgets vervangen doorgaans zijbalken en omvangrijke kopmenu’s.
- Grafische afbeeldingen over de volledige breedte met gerechtelijk gebruik van ruimte tussen tekst.
Bureaublad
- De meeste desktopmonitoren meten diagonaal 19 inch tot 24 inch.
- Gesponsorde links en grote banneradvertenties komen vaker voor.
- Dichtere tekst met meer ruimte voor afbeeldingen.
Het meest voor de hand liggende verschil tussen desktop- en mobiele webpagina’s is het schermvastgoed. Hoewel de meeste desktopmonitoren diagonaal minstens 19 inch tot 24 inch meten, zijn tablets meestal rond de 10 inch. Smartphones zijn ongeveer 4 inch diagonaal. Door simpelweg uit te zoomen wordt een webpagina niet succesvol geconverteerd naar een mobielvriendelijke versie omdat het de tekst onleesbaar maakt en een extra stap vereist van de sitebezoeker. Ook wordt het nauwkeurig tikken op kleine elementen onmogelijk. Om het probleem op te lossen, kunnen ontwerpers zijbalken en afbeeldingen verwijderen die niet strikt noodzakelijk zijn. In plaats daarvan gebruiken ze kleinere afbeeldingen, vergroten ze de lettergrootte en vouwen ze inhoud samen in uitbreidbare widgets. Deze beperking van onroerend goed heeft geleid tot een heel ander soort denken bij webontwerpers. Ook vervangen inklapbare of uitbreidbare menuwidgets doorgaans zijbalken en omvangrijke kopmenu’s. In hun zoektocht om elke millimeter schermruimte te laten tellen, verwijderen ontwerpers overtollige witruimte, terwijl ze de leesbaarheid goed in de gaten houden. Een massa gesponsorde links en grote banneradvertenties werken gewoon niet op een telefoon of kleine tablet. In plaats daarvan komen kleine pop-upadvertenties vaker voor op mobiele webpagina’s. Lay-outs met tekst rond een afbeelding werken niet goed op mobiele apparaten. In plaats daarvan geven ontwerpers die afbeeldingen vaak de volledige breedte van het scherm en voeren ze de tekst eronder of boven uit. Evenzo verdeelt een goed webontwerp tekst in stukken voor de leesbaarheid; niemand wil stevige tekstmuren lezen. Dit wordt nog belangrijker op kleine schermen. Het oordeelkundig gebruiken van witruimte is cruciaal.
Paginabediening: Desktopprecisie versus mobiele blobs
Mobiel
- Grote tikgebieden of hotspots voor nauwkeurigere navigatie.
- Andere URL: voegt de letter “m” toe. Vaak een optie om de desktopversie van een site te bekijken.
- Inloggegevens hebben vaak speciale ruimte, soms met toegankelijkheid voor vingerafdrukken.
Bureaublad
- Nauwkeurigere links en knoppen op basis van cursors.
In tegenstelling tot een precieze muisaanwijzer op uw bureaublad, is de menselijke vinger een klodder, en tikken vereist grote doelen op het scherm voor hyperlinks. Mobielvriendelijke sites bieden grote tikgebieden (of hotspots) om nauwkeurige navigatie te vergemakkelijken. Mobielvriendelijke webpagina’s bevatten ook vaak de letter m in hun adressen; het mobiele adres van Facebook is bijvoorbeeld m.facebook.com. De mobiele URL wordt meestal automatisch voor je gekozen wanneer je surft met een mobiele tablet of smartphone. In sommige gevallen zie je een tikbare link waarmee je kunt overschakelen naar de normale desktopversie van de pagina. Inlog- en wachtwoordvelden die bedoeld zijn voor desktops en laptops worden klein en onbruikbaar op een telefoon, dus webuitgevers maken deze groter en geven ze soms hun eigen pagina’s voor gebruiksgemak. Inloggen met een vingerafdruk of een ander account, zoals Google of Facebook, wordt steeds gebruikelijker naarmate de apparaat- en servicemogelijkheden evolueren.
Waarom maakt het uit?
Mobiele webpagina’s zijn ontworpen voor draagbare apparaten en verschillen behoorlijk van pagina’s die zijn gemaakt voor lezen op een desktop. Hoewel u meestal de desktopversie van een webpagina op een mobiel apparaat kunt bekijken en vice versa, zijn ze anders ontworpen om de inhoud gemakkelijker te kunnen bekijken, lezen en navigeren.
