Om je bezoekers in je formulier meerdere keuzes aan te bieden kan je gebruik maken van 3 type formulier elementen: een selectbox (single of multiple), een lijst met radio buttons of een lijst met checkboxes. Aan de hand van een pizza bestelformulier zal ik de verschillende mogelijkheden verder uitwerken.

Checkboxes
Met de volgende code maak je een checkbox:

1) Het type is checkbox.
2) Door alle checkboxes dezelfde naam te geven (name) groepeer je ze bij elkaar in het formulier.
3) In het value attribuut geef je de waarde mee die vanuit het formulier verstuurd moeten worden.
4) Zet achter elke checkbox de tekst die je wilt laten zien aan je bezoekers.

Dit ziet er als volgt uit:

Eerder heb ik toegelicht hoe een internetformulier werkt. In dit artikel meer over twee soorten velden die zichtbare teksten kunnen verwerken. Het input veld (type text) en de textarea. Onderdelen van formulieren worden controls genoemd. Hoe werken ze en wanneer gebruik je ze?

Input veld – type = text
Een input veld voor korte teksten is het input type=text veld. Denk hierbij aan velden voor voornaam, achternaam, e-mail etc. Voor wachtwoorden gebruik je een ander veld, het input type="password". Je maakt het input type=text veld als volgt:

Het effect hiervan is:

Voornaam

1) Zoals je kunt zien zet ik de uitleg van het veld ervoor in het label element.
2) Door het input element als type 'text' mee te geven geef je aan er teksten in ingevuld kunnen worden.
3) Het name attribuut heb je nodig het element een unieke naam te geven.
4) Met het value attribuut kan je al een waarde meegeven. Normaal gesproken laat je dit leeg, tenzij je de waarde al weet.
5) Met size geef je de zichtbare lengte van het veld op.
6) En met maxlength bepaal je hoeveel tekens er maximaal in het veld ingevuld kunnen worden.

In de begintijd van internetformulieren zag je vaak teksten in deze elementen als 'Type hier uw naam'. Dat hoeft tegenwoordig niet meer.
De weergave van het element kan je met CSS aanpassen. Met behulp van Javascript kan je ook beinvloeden wat je bezoekers wel of niet kunnen invullen. Hierop zal ik in een ander artikel nader ingaan.

Het gebruik van een internet formulier maakt je leven een stuk gemakkelijker. Het stelt je in staat om te communiceren met je bezoekers, informatie te verzamelen en daarmee in je bedrijf allerlei werkprocessen aan te sturen. De grens tussen een website en software wordt daarmee soms moeilijk aan te geven.
Het eerste formulier dat de meeste mensen op een website plaatsen is het contactformulier. Ben je benieuwd waaraan zo'n formulier het beste kan voldoen? Lees dan mijn eerdere artikel over richtlijnen voor een contactpagina.

Hoe werkt een formulier op internet?
Met speciale code kan je een HTML formulier maken. De informatie die je bezoeker hierin invult wordt naar een server gestuurd. Deze kan er iets mee doen en vervolgens erop reageren. Dit ziet er ongeveer zo uit:

Het is hierbij niet zo dat de verbinding met de website constant is. Bij elke pagina wordt deze opnieuw gelegd! Dat kan lastig zijn als je meerdere stappen hebt in een formulier. Maar hiervoor zijn allerlei oplossingen bedacht, zoals cookies en sessies. Hierop zal ik in een later artikel terugkomen.

POST en GET methode
Voor het versturen van een formulier zijn er 2 manieren (methodes): POST en GET. De eerste raad ik je aan te gebruiken, omdat dit er speciaal voor gemaakt is. Het verschil zit in de codering van de data die je verstuurt.

Met GET verstuur je informatie via het internet adres: de URL. Een URL heeft een beperkte lengte, dus op een gegeven moment zit deze vol. Bovendien moet je extra inspanningen verrichten om alle karakters goed via een URL door te geven weer te ontcijferen. Bijvoorbeeld: naam=Theo%20Bakker is de weergave van 'Theo Bakker' in een URL. De HTML code is voor dit type formulier:

Vandaag vroeg een vriendin van me of het mogelijk was om een slideshow te laten zien op haar website. Natuurlijk… maar welke?? Er zijn er nogal wat! Een leuk onderwerp voor een artikel on-the-side. We delen een paar mogelijkheden met je die we hebben gevonden: SlideShow Pro en Lightbox.

Een pagina die natuurlijk niet mag ontbreken is de contactpagina. Met een aantal zaken moet je op deze pagina rekening houden: je adresinformatie, een goed contactformulier, een bedankpagina en FAQ's.