Labo 04 – Responsive Webdesign
Doelstellingen
- Je kan een webpagina responsive maken.
- Je kan mediaqueries toepassen.
- Je kan responsive images toepassen.
- Je kan elementen laten meeschalen met de venstergrootte.
- Je kan een tekst opmaken.
- Je kan een knop correct stijlen in kleur en met een correct contrast.
Omschrijving
In dit labo leer je responsive webdesign toepassen. Je werkt met media queries om je website aan te passen aan verschillende schermgroottes. Je gebruikt responsive images met het <picture> element om verschillende afbeeldingen te laden afhankelijk van de schermbreedte.
Je leert elementen laten meeschalen met de venstergrootte door gebruik te maken van relatieve eenheden. Daarnaast oefen je met tekst opmaken en knoppen correct stijlen met de juiste kleuren en contrast voor toegankelijkheid.
Reflectie
Wat ging goed?
- Responsive images met picture element.
- Media queries toepassen voor verschillende schermgroottes.
Wat was moeilijk?
- Elementen correct laten meeschalen.