De viewport is het zichtbare gebied van de browser-pagina. De viewport-metatag vertelt de browser hoe de pagina geschaald wordt op mobiele apparaten, met als standaardwaarden width=device-width en initial-scale=1. Zonder deze tag zoomt een mobiele browser uit op de desktopbreedte. De CSS-viewport-units vw, vh, vmin en vmax zijn gebaseerd op de viewport-afmetingen.
Media Query
A
Frontend
Media Query
Met media queries pas je styles voorwaardelijk toe op basis van eigenschappen als schermbreedte, -hoogte, oriëntatie of resolutie. Het is de kern van responsive design. Voorbeeld: @media (min-width: 768px) { ... }.
A
Frontend
Responsive Design
A
Frontend
Responsive Design
Responsive design zorgt dat een website zich vloeiend aanpast aan verschillende schermformaten. Dit doe je met flexibele grids, media queries en relatieve units zoals %, em en rem. Zo werkt één codebase op desktop, tablet en mobiel.
A
Frontend
Mobile First
A
Frontend
Mobile First
Bij mobile-first ontwerp je eerst voor mobiele apparaten en schaal je daarna op naar grotere schermen. Deze aanpak dwingt focus op essentiële content en functionaliteit. Het resultaat is betere performance en een consistente gebruikerservaring.
A
Frontend
Een uitgebreide collectie begrippen voor elk niveau
Van HTML & CSS tot databases en security
Geschikt voor beginners en gevorderden
Ideaal als lesmateriaal of teambuilding tool
Fysiek aan de slag, zonder scherm