Vaste Computer

Er was een tijd dat je er op kon rekenen dat je bezoeker op een vaste computer naar jouw website keek. Die tijd is nu over en komt nooit meer terug. Nu gebruikt een groot gedeelte van de surfers een mobiel toestel.

Mobiele toestellen

De oudere mobiele toestellen konden wel naar het web, maar hun functionali­teit liet te wensen over. Toen kwam de iPhone en alles veranderde volledig. Het werd betaalbaar om mobiel internet te gebruiken. De smartphone is overal, bijna iedereen heeft er één en niet alleen de jongeren. Als je deze verandering negeert, zul je de bezoekers van je site een minder goede ervaring geven, misschien zelfs zo erg, dat ze naar een andere site gaan. Veel bezoekers gebruiken de telefoon ook thuis om te surfen, het ding staat altijd aan, de PC moet je misschien eerst nog opstarten.

Smartphone

Bedenk dat de smartphone meestal geen toetsenbord en muis heeft en dat de invoer daardoor lastiger zal zijn dan op een normale computer. We moeten de bezoeker wel dezelfde informatie leveren als op een vaste computer. Soms kunnen we meer leveren als we het mogelijk maken om een telefoonnummer klikbaar te maken en te voorkomen dat je dit nummer opnieuw moet invoeren in de telefoon. Verder kunnen we de ingebouwde GPS gebruiken om de inhoud aan te passen op de plaats waar de bezoeker is en hem naar een vestiging in de buurt te sturen. Het raadplegen van de ingebouwde klok geeft de mogelijkheid om te zeggen dat de vestigingen van onze bank nu gesloten zijn, maar dat er een geldautomaat  op het volgende adres beschikbaar is.

Mobiele versie

Sommige sites hebben daarvoor een tweede versie, die speciaal voor kleinere schermen is ontworpen. Dit geeft een betere ervaring op een mobiel toestel, maar heeft het nadeel dat je de inhoud op twee plaatsen moet bijwerken en loop je het risico dat er verschillen ontstaan tussen de twee versies. Eén versie is gemakkelijker te onderhouden.

Responsive website

Een responsive website gebruikt een eenvoudigere layout, als het op een mobiel apparaat wordt weergegeven. Hierdoor blijft de inhoud goed leesbaar. Ook heeft het vaak een aangepast menu en meer ruimte voor de links, zodat je de keuzes ook gemakkelijk met de vinger kan maken. Het maken van een ontwerp voor een specifieke publiek was altijd al belangrijk, maar een ontwerp voor het mobiele web is nog complexer, want je moet de site ontwerpen voor veel verschillende doelgroepen en mobiele apparaten en dat allemaal op een klein schermpje. Het is echter wel de bedoeling dat een mobiele gebruiker over de zelfde informatie kan beschikken als iemand op een vaste computer al mag je het wel anders presenteren. Dit alles maakt dat de ontwikkeling van een responsive site wat meer tijd kost dan een ‘oude’.

Mobile first

In het begin maakten webdesigners een ‘normale’ website en als het ontwerp helemaal klaar was, deed hij misschien nog een paar aanpassingen om het er op een mobiel apparaat wat beter uit te laten zien. Mobiel was geen integraal onderdeel van het ontwerp­proces. Tegenwoordig neem je het mobiele deel vanaf het begin in het proces op. Ook maken steeds meer ontwerpers van websites deze volgens de ‘mobile first’ methode. Ze beginnen met het opzetten van de mobile versie van de site en ontwikkelen de delen van de desktop-versie later. Dit voorkomt dat je bijvoorbeeld eerst een grote foto naar het toestel stuurt, dan ontdekt dat het om een smartphone gaat en vervolgens een kleiner exemplaar stuurt. De telefoon heeft dan beide foto’s ontvangen, gooit de eerste weg en gebruikt de tweede. Voor het menu wordt op een klein scherm alleen een button getoond, het menu alleen na een klik op die knop. Ook kun je grote fotosliders weglaten en de afbeeldingen op een aparte pagina zetten, zodat de bezoeker er bewust voor kan kiezen. Focus op dat wat echt belangrijk is voor de gebruiker en plaats dat bovenaan het scherm. Je wilt niet door allerlei aanbiedingen moeten scrollen voordat je het adres of de openingstijden van de winkel kunt vinden.

Bandbreedte

De lagere bandbreedte van het mobile internet samen met een mogelijke beperking of kosten van het aantal verstuurde Mb’s maken het noodzakelijk om de website zo te ontwerpen, dat we zorgvuldig gebruik maken van de resources. Zelfs als je stylesheets gebruikt om een aantal dingen die niet op een telefoon werken te verbergen, laat je de bezoekers meer downloaden dan ze nodig hebben. Dit kan je bezoekers meer kosten dan alleen de verspilde tijd, want vaak betalen ze een prijs per Mb. Ook kan op een druk openbaar draadloos netwerk de snelheid veel lager zijn dan op het netwerk thuis.

Latency

Het mobiele web heeft een veel grotere latency dan die van het vaste net. De latency is de tijd die nodig is om een datapakket van het toestel naar de webserver te sturen en vervolgens het antwoord te ontvangen en weer te geven. Deze tijd wordt veroorzaakt door het grote aantal stappen, die een pakket door het netwerk moet nemen. Het signaal gaat eerst naar een GSM-mast, die het via een datalijn naar het schakelcentrum stuurt. Hierna gaat het via firewalls en gateways over het internet naar de webserver, die de webpagina aanmaakt en deze via een vergelijkbare weg terugstuurt. Al die stappen controleren de data op juistheid en vragen zonodig om herhaling. Dit is vooral bij kleinere datapakketten een aanzienlijke vertraging, aangezien de overhead per pakket gelijk is.

Verbetering

Om dit effect te verminderen kunnen we bij mobiel internet proberen kleine files te combineren tot grotere. We zien dit bij stylesheets, bij CMS-systemen zie je soms wel tien stylesheets en javascipts afhankelijk van het aantal gebrukte plugins. Ook voor icons en dergelijke files geldt dit. Deze combineren we dan tot één file en met behulp van een stylesheet tonen we juist dat stukje, dat nodig is. Voor het volgende icon gebruik je dan een ander deel van dezelfde file en is het dus niet nodig om opnieuw een file van het netwerk op te halen. Gebruik je css3 voor tekstschaduw, ronde hoeken en gradients, dan zijn er minder images nodig. Ook voor javascript geldt combineren. Iedere file die je opent kost tijd.

Hover

Denk ook aan de hover, dat is met de muis op een plaats gaan staan zonder te klikken. Dit werkt niet (altijd) op een mobiel apparaat. Je moet hier een voorziening voor maken, zodat je alle functies toch kunt gebruiken.

Geef een reactie

Het e-mailadres wordt niet gepubliceerd.

Je mag deze HTML tags en attributen gebruiken:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Deze website gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.

Meer artikelen over 'websites'

Mobiel internet

Mobiel internet verdringt vaste PC’s De tijd voor websites, die alleen op desktops werken, is voorbij. Je kunt onmogelijk het groeiend aantal mobiele gebruikers negeren. Het gebruik van mobiele toestellen heeft dat van vaste toestellen inmiddels ingehaald. Van de 7 miljard mensen op aarde heeft 77% een mobiel toestel. Dit gaat om 5.4 miljard mensen. […]
Lees verder

20 tips voor je mobiele website

Over je mobiele website Dit is het tijdperk van het mobiele internetgebruik. Steeds meer bezoekers maken gebruik van mobiele websites, dus is het belangrijk om te zorgen dat jouw website de gebruikers van deze toestellen een goede ervaring geeft. Als jouw website niet mobielvriendelijk is, wordt hij door Google minder gewaardeerd en later vermeld in […]
Lees verder

Sliders zijn slecht

Sliders Een van de meest voorkomende ontwerpfouten op websites is het toepassen van sliders, zeker op de homepage. Het gebruik van sliders, ook image carrousels of diavoorstellingen genoemd, is een handige manier om meerdere foto’s, video’s, afbeeldingen of tekstblokken op dezelfde plek op je website weer te geven.  De gedachte aan een grote, mooie, flitsende […]
Lees verder

De ‘over mij’-pagina

‘Over mij’, een ondergewaardeerde pagina Een lezer is net aangekomen op jouw homepagina, wat gaat hij nu doen? Hij is nieuwsgierig geworden naar jou, wie zit er achter dit bedrijf. Natuurlijk, de ‘over-mij’-pagina. Deze pagina is één van de meest ondergewaardeerde pagina’s tijdens ontwikkeling van veel websites. De ‘over mij’-pagina is de ziel van je […]
Lees verder

Accessibility

Wat is accessibility Bij accessibility gaat het over het verlenen van volledige, onbeperkte toegang tot een bepaald product of dienst, zoals bijvoorbeeld een website, voor mensen met een beperking. Accessibility is niet gelijk aan usability, al zijn er overlappende delen. Bij usability kijk je naar de bruikbaarheid van een website voor de gebruiker met of […]
Lees verder

Uniforme layout

Dit is één site Soms heeft de ontwerper van een website de pagina’s ervan onderling zo’n verschillende layout gegeven, dat de bezoeker niet meer zeker is, dat dit bij dezelfde site hoort. Er moeten rustpunten in het ontwerp zitten, waar de bezoeker zich op kan oriënteren. Denk daarbij aan: header menu formaat kleurschema kopregels lettertype […]
Lees verder

Zoekmachinevriendelijke url gebruiken

Zoekmachinevriendelijke url Beter voor mensen én zoekmachines Op het internet kom je vaak sites tegen, waarbij de pagina’s, die vanuit het menu worden gekozen, lange en onleesbare namen hebben als www.voorbeeld.com/index.php?page_id=33. Dit is een link, die mensen niet gemakkelijk zullen onthouden en geen betekenis voor zoekmachines heeft. Veel beter is het om als link www.voorbeeld.com/onze-producten […]
Lees verder

Hoe veilig is jouw website

Houd je website veilig Een website loopt continu het gevaar om door hackers te worden aangevallen. CMS-websites lopen een groter risico dan statische websites. Een CMS-website kun je op afstand aanpassen en aangezien die systemen heel veel worden gebruikt, weten sommigen de manieren om illegaal in zo’n site te komen. Toen je website werd gemaakt, […]
Lees verder

Bezoekerstellers geven inzicht

Tellen van bezoekers Het bijhouden van het aantal unieke bezoekers en bekeken pagina’s geeft een goed inzicht in het gebruik van de website. Je kunt hiermee behalve het aantal bezoekers ook bepalen, welke weg die bezoeker door de website aflegt. Met de informatie van de bezoekerstellers kun je de structuur van de site zonodig aanpassen. […]
Lees verder

Stockfoto’s gebruik ze met mate

Mensen houden er niet van Je wilt niet weten hoe allergisch mensen voor stockfoto’s zijn. Meestal doen de personen op de foto’s gespeeld enthousiast, juichen gemaakt, steken hun duim omhoog of maken acrobatische sprongetjes. Ze lijken met hun onnatuurlijke poses niet in de verte op de mensen, die bij het bedrijf werken of op hun […]
Lees verder

Kun je meteen zien wat jij doet

Wees duidelijk Als iemand op jouw site komt, is het hem dan meteen duidelijk op welke site hij is en wat jouw business is. En natuurlijk zonder te hoeven scrollen. Dit is vooral belangrijk bij sites als “Jansen b.v.” Gebruik hier een tag-line, die bijvoorbeeld zegt “Herenmode” of “Freelance secretaresse”. Wees hierin zo duidelijk mogelijk, […]
Lees verder