Volgende opdrachten werk je uit in het aankoopformulier:

1. In Homepagina - verplichte HTML5-structuurelementen werd gevraagd om een header toe te voegen met de eerste hoofding, het navigatiemenu en een afbeelding. Zorg dat beide pagina’s een identieke header bevatten. Enkel de tekst in de eerste hoofding mag aangepast worden. Zorg dat de interne link in het navigatiemenu nog steeds correct werkt en controleer in Google Chrome dat de header niet ’visueel’ wijzigt als je tussen beide pagina’s wisselt.
2. Beide pagina’s moeten ook dezelfde footer bevatten.
3. Gebruik fieldset en legend om jouw formulier in twee of meer delen op te splitsen. Het bovenste deel informeert naar persoonlijke gegevens, het onderste deel bevat informatie over de aankoop of interesse in producten.
4. Gebruik elk van volgende componenten minstens één keer: checkbox, date, een drop-down menu en een tekstgebied (dit is niet hetzelfde als een tekstveld!).
5. Voeg bovenop het inputtype voor checkbox en date, nog minstens twee andere inputtypes toe. Door het juiste inputtype te gebruiken worden immers de nodige controles automatisch uitgevoerd.
6. Maak minstens twee inputs VERPLICHT.
7. Geef een suggestie voor de inhoud van bepaalde inputs.
8. Wanneer de gebruiker op een label klikt, moet die altijd direct in het bijhorend vak kunnen typen of moet de juiste optie aangevinkt worden.
9. Voeg een knop toe die het formulier volledig leegmaakt.

10. Voeg onderaan het formulier een verzendknop in de vorm van een afbeelding toe. In volgende paragraaf wordt nog verder op deze knop ingegaan.

    Tip: Formulier knoppen - Afbeelding als knop.

Het formulier ziet er in dit stadium nog heel ‘plat’ uit, en dat is perfect. Je hebt immers nog geen CSS gebruikt.