Wat is de juiste grootte van mijn website

'Hoe groot moet ik mijn website maken?', wordt vaak aan mij gevraagd door opdrachtgevers.
Een goede vraag, want als de site groter is dan de breedte van het scherm komen er horizontale scrollbars in beeld. Dat is niet fraai.

Er zijn verschillende oplossingen voor dit probleem.

Fluid Layout

Door middel van CSS (Cascading Style Sheets) is het mogelijk een layout te programmeren die altijd het complete venster benut.
Wordt het venster vergroot of verkleind dan schaalt de layout mee. Dit is lange tijd een prima oplossing geweest.

Fixed Width

Een ander uitgangspunt is te stellen dat de website niet kleiner mag worden dan een bepaalde breedte.
De maat voor deze fixed width websites werd bepaald door de scherm resolutie. Jaren geleden, toen idereen nog met een 800x600 scherm werkte, bouwde je de website zo dat de pagina plus een verticale scrollbar niet meer dan 800 pixels breed was.

Centreren

Natuurlijk werkt dit niet voor iedere bezoeker. Mensen met een kleiner scherm kregen nog steeds de horizontale scrollbars te zien. De constante irritatie, veroorzaakt door het scrollen, zal de aanschaf van een groter scherm gerechtvaardigd hebben.
Voor de bezoekers met een grote scherm, werden de pagina's netjes gecentreerd.

Oei, ik groei

Na de 800 bij 600 pixels schermen was het maatje 1024 x 786 px een 'standaard' voor webpagina's. Ook deze website is voor die schermgrootte geoptimaliseerd.
De volgende grafiek van Statcounter laat zien dat in de periode van maart 2009 tot september 2011 het gebruik van de 1024 schermen sterk afneemt (in Nederland). De grotere schermresoluties winnen marktaandeel.

Nu de schermen nog groter worden, levert het toepassen van de fluid layout CSS oplossingen problemen op. Webpagina's gaan rommelig worden. Het juist toepassen van witruimtes rondom teksten, koppen en afbeeldingen is zeer belangrijk voor de leesbaarheid van een (web)pagina.

In de grafiek is ook te zien dat de resolutie 1366 x 768 pixels de grootste stijger is. Wordt het tijd om alle websites te gaan optimaliseren voor 1366 pixels?

De grafiek komt van de Global Stats website van Statcounter. Klik hier om naar de Global Stats te gaan

Alle artikelen