Labo 04 - Responsive webdesign

Uitleg

Het doel van dit labo is na gaan en onderzoeken hoe je een website Responsive kan maken met verschillende schermgroottes en resoluties, bijvoorbeeld: hoe bij bepaalde website groottes van foto's veranderen. Dit kan aan de hand van Media queries, en natuurlijk andere elementen laten mee schalen of de groei laten limiteren vanaf een bepaalde grootte. En vervolgens de reglementen en kleurtheorie correct kunnen stijlen op de elementen, bijvoorbeeld een knop.

Handige links

OKLCH is een heel handige website om kleuren te kiezen. Hieruit krijg je dan een code die je in de CSS moet kopiëren.

ChatGPT heb ik af en toe gebruikt omdat ik niet altijd wist hoe ik moest starten aan een bepaalde opdracht/ welke functie ik daar voor moest gebruiken. Dan kopieerde ik de opdracht in chatGPT en hij gaf mij welk commando ik moest gebruiken en dan ging ik naar mozilla voor mij te verdiepen in dit commando.

Nadat ik door chatGPT de juiste commando gekregen heb, kan ik dit daarna opzoeken in de catalogus van Mozilla om te weten komen hoe dit werkt en zelf implementeren in mijn code. Want soms staat er hier te veel in om gewoon te zoeken naar welke commando juist gaat werken, daarvoor is chatGPT.

Op deze website kan je alle fonts gratis vinden en zijn gelicenseerd.

Reflectie

Goed

De HTML en basis CSS gingen heel vlot, aangezien we al veel hierop hebben geoefend. De typografie ging heel vlot eens je de commandos vond.

Slechter

Met oefening 2 (cards) had ik meer moeite, omdat de afbeeldingen moeilijk waren om op hun plaats te krijgen en dat ze de juiste grootte waren, maar dit is uiteindelijk gelukt.

Niet zeker

Oefening 1 ging op zich wel goed, maar iets lastiger omdat het de eerste keer is dat we moesten werken met Responsive websites. Hierdoor is het soms wat zoeken hoe het in elkaar zit. Uiteindelijk is dit nog vrij snel goed gekomen.