Wat zijn breekpunten?
Breekpunten zijn de schermbreedtes waarop je opmaak verandert. Onder een breekpunt geldt de ene indeling, erboven de andere.
De meeste sites hebben er drie.
Meer levert zelden iets op en maakt je opmaak onoverzichtelijk.
De gangbare drie
Rond zeshonderd pixels van één naar twee kolommen, rond negenhonderd van twee naar drie en rond twaalfhonderd je maximale breedte.
Meer daarover lees je bij css.
Waarom niet op apparaten
Omdat er te veel formaten zijn. Kies je grenzen op het moment dat je ontwerp niet meer werkt, niet op de maat van een populaire telefoon.
Meer daarover lees je bij mobile first.
Hoe je ze bepaalt
Rek je browservenster langzaam uit en kijk wanneer het lelijk wordt. Daar hoort je breekpunt.
Meer daarover lees je bij hoe je test of je site responsive is.
Mijn vuistregels
- Drie breekpunten volstaan.
- Kies ze op je ontwerp, niet op apparaten.
- Werk van klein naar groot.
- Gebruik dezelfde grenzen op je hele site.
Die laatste voorkomt dat je secties op verschillende breedtes omslaan.
Zonder breekpunten
Er bestaan moderne technieken waarmee je opmaak vloeiend meeschaalt. Dan heb je er minder of geen nodig.
Meer daarover lees je bij frontend.
Waar het misgaat
Bij tabellen en brede afbeeldingen. Die passen zich niet vanzelf aan en vragen een eigen oplossing.
Meer daarover lees je bij waarom je site uit elkaar valt op een tablet.