Je doet deze module natuurlijk niet in je eentje, maar met een groep. Misschien ken je nog niemand omdat je vrienden deze module niet doen. Het is hoe dan ook een goed plan om kennis met elkaar te maken. Doe daarom in de klas de volgende oefeningen:
- Brainstorm met een paar klasgenoten die je nog niet kent over wat jullie al weten over websites. Welke websites vinden jullie erg mooi? Waarom zijn deze juist mooi? Wat kun je erop doen? Welke technologie zit erachter? Wat zou een bepaalde website allemaal moeten kunnen? Waar moet een programmeur rekening mee houden?
- Bespreek welke websites jullie allemaal gebruiken. Zoek websites op als ze nog onbekend voor je zijn.
- Bespreek voor elke website of het alleen met HTML en CSS gemaakt zou zijn of ook met JavaScript.
- Ga eens samen na of de verenigingen of organisaties waar jullie lid van zijn (zoals een sportvereniging) een website hebben. Maak je daar vaak gebruik van? En waarvoor? Kun je zien hoe deze geprogrammeerd is?
- Zoek een website op die niet online zou mogen staan omdat hij zo slecht is. Wie kan de slechtste site vinden?
- Misschien heeft iemand van jullie al een site gemaakt. Bekijk deze.
Als het goed is ben je er in deze oefeningen een beetje achter gekomen wat jullie hobby's zijn en welke websites daarbij horen. Misschien zit er wel iemand in jullie groepje die al ervaring heeft met webdesign en die al veel kan vertellen over de technologie achter zo'n website. Als dat niet zo is, is dat nog geen reden voor paniek, hoor. Je leert in deze module alles wat je moet weten.
Na de leuke informatie van de expert is het nu tijd om zelf eens te gaan snuffelen op websites. Je kan namelijk al heel veel leren over webdesign in de browser zelf. Dit doe je door de **Developer Tools** te gebruiken. Om te beginnen kan je de **Inspector** gebruiken. Hiervoor kan je in de meeste browsers op F12 drukken. Op de website van Quadraam geeft dit met Google Chrome het volgende resultaat:
Het paneel aan de rechterkant van het scherm is geopend op het tabje Elements. Alle tekst die hierin staat is al programmeercode! Dit is namelijk de HTML van deze pagina. Wanneer je met je muis boven één van de regels zweeft dan zie dat het deel van de website gemaakt met die regel code grijs oplichten. Met de pijltjes links van de regels kun je de onderdelen binnen dat onderdeel zien.
Binnen de inspector kan je de webpagina ook aanpassen door dubbel te klikken op de tekst. Geen zorgen, dit verandert de webpagina alleen voor jou! Wanneer je de pagina ververst met de 
knop linksboven of met F5 dan zijn al je wijzigingen weer verdwenen. Je kunt zelfs hele onderdelen van de website verwijderen! Selecteer hiervoor gewoon een regel code en druk daarna op Delete.
De gemarkeerde knop in het plaatje activeert een modus waarbij je ergens op de website kan klikken, waardoor de regel code die daarvoor verantwoordelijk is wordt weergeven. Dit is handig om snel te vinden hoe een bepaald deel van de website in elkaar zit.
- Gebruik de inspector op https://www.quadraam.nl om te kijken hoe de website is opgebouwd. Welke tekst zit waarin? Waarom zou dit zo zijn?
- Probeer met de inspector een stuk tekst of andere code aan te passen. Wat gebeurt er als je alle tekst verwijdert uit een blok? Kun je op andere manieren de website apart eruit laten zien?
- Ga zelf naar een andere website toe en open de inspector daar weer. Wat is er anders aan de website? Probeer ook hier weer verschillende regels code te veranderen.
Naast de inspector zijn er in alle browsers ook nog andere gereedschappen ingebouwd om webdesigners te helpen bij hun baan. Zo kan bijvoorbeeld bijgehouden worden hoeveel geheugen een website gebruikt in het Performance tabblad of welke fouten er zijn in de code in het Console tabblad. Het is nu tijd om te leren hoe je zelf een website maakt.
Speciaal voor deze module is iemand geregeld uit het vak Webdesign die jullie iets gaat vertellen. Vraag bij de docent voor meer informatie.