Webdesign voor de iPad

13 NOVEMBER 2011 - Vroeger maakte men websites voor resoluties van 640 bij 480 pixels, daarna voor 1024 pixels breed zodat websites op hogere resoluties in ieder geval niet te groot waren. Tegenwoordig zijn de resoluties echter steeds meer verdeeld: van 1024 tot full HD; van tablet tot cinema display. Websites worden niet meer alleen weergegeven op laptop- en desktopcomputers, maar ook op mobiele devices als telefoons en tablets als de iPad.

Optimale weergave voor elk scherm

Het is dus zaak dat websites ook hier een optimale weergave bieden. Natuurlijk zijn de systemen die op deze apparaten draaien zo gemaakt dat mensen niet-geoptimaliseerde websites op een slimme manier kunnen gebruiken. Maar als webdesigner heb je de mogelijkheid om de lay-out speciaal voor deze schermen aan te passen. Omdat het slechts om aanpassing van weergave gaat, is dit een kleinere ingreep dan vaak verondersteld wordt. Het gaat immers enkel om een andere indeling in de layout, niet om aanpassingen in het systeem zelf. Een dergelijke layout wordt ook wel een „adaptieve lay-out” genoemd (of in vakterm: „responsive web design”). De lay-out past zich dan aan aan het formaat en oriëntatie (landschap of portret) van het scherm.

Tijdens de ontwikkeling van beeldschermen naar steeds hogere resoluties werd er in het begin nog vaak gebruik gemaakt van een zgn. „fluid layout”. Deze vorm van adaptieve lay-out beslaat altijd 100% van de breedte van het browservenster - hoe groot dit venster ook is. Er wordt dan geen rekening gehouden met het feit dat dit bij hoge resoluties geen mooie weergave meer geeft en bij zeer lage resoluties tot onleesbare pagina’s kan leiden. Om die reden kiezen webdesigners er tegenwoordig voor om de lay-out van een website trapsgewijs aan te passen. Er wordt dan een layout gemaakt voor verschillende reeksen resoluties. Zo heeft deze website een layout voor 320+ (mobiel), 720+ (tablet), 960+ (laptop/desktop), 1200+ en 1560+ pixels. Zodra nog hogere resoluties gebruikelijk worden, kunnen aanpassingen gedaan worden in de stijlbestanden zonder dat bezoekers met lagere resolutie last hebben van de aanpassingen. Ook voor schermen met een hogere pixelratio (meer pixels per vierkante cm) kunnen aangepaste stijlbestanden gemaakt worden, denk bijvoorbeeld aan scherpere afbeeldingen (hogere resolutie) voor telefoons als de iPhone 4 (eerste apparaat met een pixelratio van 2).

Blijf bij de tijd

Aangezien tablets en smartphones steeds meer gebruikt worden voor internet, is het zaak altijd goed bij te houden of uw website op deze apparaten correct weergegeven wordt. Het kan zijn dat uw website helemaal niet werkt op deze apparaten. In dat geval loopt u steeds meer mensen uit uw doelgroep mis, omdat de iPad en andere tablets zeer hard in populariteit toenemen terwijl het gebruik van desktop computers juist daalt.

Mail naar .(JavaScript must be enabled to view this email address) als je naar aanleiding van dit bericht vragen hebt. Ik kan je helpen om je website klaar te maken voor alle mobiele schermen van vandaag en morgen. Bellen kan ook: 050 - 72 000 27. Indien gewenst kun je vrijblijvend langskomen om de mogelijkheden te bespreken.