ZOMDir > BlogNL

maandag 9 maart 2015

Browsersize at a Glance

Gedurende het ZOMDir project liepen er meerdere subproject(jes). 

Eén daarvan is Browsersize at a Glance. In feite een hele simpele website die aangeeft hoeveel ruimte er beschikbaar is voor een webpagina. Dat is handig om een idee te krijgen waar je voor responsive website designs eventueel een breekpunt moet plaatsen.

Beperk het aantal breekpunten

In de praktijk wil je zo min mogelijk breekpunten. Immers elk breekpunt erbij, betekend een extra ontwerp voor je website. Voor de websites behorende bij ZOMDir worden er meestal 3 en soms 4 ontwerpen gemaakt (bij voorkeur zo minimalistisch mogelijk). 

De praktijk leerde mij dat minimaal een ontwerp moet worden gemaakt voor:
  • Computer schermen smaller dan 730 pixels;
  • Computer schermen breder dan 730 pixels
  • De printpagina

Tip: Mocht je een website willen laten ontwerpen. Vraag dan altijd om de drie bovenstaande ontwerpen in plaats van één ontwerp. 

De keuze van 730 als breekpunt is enigszins arbitrair al vond ik het wel handig dat deze ergens ligt tussen de breedte van een smartphone en die van een tablet.

Een iPhone 4S (portrait mode) is 320 pixels breed. Een iPad (landscape) is 768 pixels breed. Op mydevice.io/devices kan je van allerlei andere apparaten de breedte terugvinden.

Tot slot. Als je je afvraagt waar een vierde ontwerp goed voor is. Dat is vaak voor de televisie, of voor hele smalle schermpjes zoals dat van de Nintendo DSi.

Succes maar weer met je website,
Hans

N.B. Browsersize at a Glance maakt gebruik van Javascript en is daarmee één van de weinige websites van ZOMDir die echt niet zonder Javascript kunnen.

--
ZOMDir.com is een startpagina en een Wiki
Ook jij voegt in 10 seconden een link toe
Voor meer informatie, ga naar Slideshare

Geen opmerkingen:

Een reactie plaatsen