Logo

Labo 4 - Responsive webdesign

Doel van de opgave

  • 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.

Resultaat

Beschrijving

In deze opdracht was het de bedoeling om een CSS-bestand te schrijven voor een bestaand HTML-bestand en verschillende oefeningen uit te voeren. De focus lag op het responsive maken van een webpagina door gebruik te maken van mediaqueries, schaalbare layouts en responsive afbeeldingen. Daarnaast werd aandacht besteed aan het laten meeschalen van elementen met de venstergrootte, het correct opmaken van tekst en het stijlen van een knop met een passende kleur en voldoende contrast.

Gebruikte links

Reflectie

Het grootste deel van deze opdracht was goed te doen, omdat veel onderdelen al aan bod waren gekomen in eerdere lessen of bij het maken van mijn portfolio. Zaken zoals het invoegen van een lettertype, het aanpassen van kleuren en het werken met display: flex verliepen vlot. Enkele onderdelen vond ik moeilijker, zoals het werken met @media voor het responsive maken van de website en het responsive opbouwen van de cards. Het onderdeel waar ik het meeste tijd aan heb besteed, was typografie. Dit was voor mij nieuw, waardoor ik vaak de PowerPoint van de theorieles moest raadplegen om dit correct toe te passen.