Mailto link in HTML

In de HTML cursus hadden we het in de les over het maken van links heel kort over mailto links (of e-mail links). In dit artikel gaan we uitgebreider in op de mogelijkheden van mailto links in HTML.

Een standaard mailto link in HTML

Om een bezoeker een e-mail te laten sturen via een link in HTML gebruik je de volgende code:

<a href="mailto:gebruikersnaam@emailadres.nl">Stuur een e-mail</a>

In je browser ziet deze link er zo uit:

Stuur een e-mail

Als een bezoeker op de mailto link klikt, dan wordt het e-mailprogramma van de bezoeker geopend en het e-mailadres wordt automatisch ingevuld in het "Aan-veld" van de e-mail.

Ontvangers toevoegen

Je kunt eenvoudig andere e-mailadressen toevoegen door een komma te plaatsen en de e-mailadressen toe te voegen in de code:

<a href="mailto:gebruikersnaam@emailadres.nl,naam@provider.nl,webmaster@website.nl">Stuur een e-mail</a>

Als je ontvangers wilt toevoegen als CC (Carbon Copy) of BCC (Blind Carbon Copy) aan de mailto link dan plaats je een ? in de code en direct daarachter cc=naam@provider.nl, of bcc=naam@provider.nl:

<a href="mailto:gebruikersnaam@emailadres.nl?cc=naam@provider.nl">Stuur een e-mail</a>

Onderwerp toevoegen in de mailto link: subject

Op dezelfde wijze als hierboven bij de ontvangers, kunnen we een subject (onderwerp) toevoegen aan de e-mail door dit toe te voegen aan onze mailto link. We gebruiken hiervoor ?subject=Tekst:

<a href="mailto:gebruikersnaam@emailadres.nl?subject=Tekst">Stuur een e-mail</a>

Een voorbeeld van een mailto link waarin subject gebruikt wordt:

Stuur een e-mail

Body toevoegen in de mailto link

Ook kun je een tekst opgeven die in het body gedeelte van de e-mail komt te staan. Dat doe je door ?body=Tekst toe te voegen aan de mailto link:

<a href="mailto:gebruikersnaam@emailadres.nl?subject=Onderwerp&body=Tekst">Stuur een e-mail</a>

We hebben hier zowel een onderwerp opgegeven via subject als een body tekst via body. Het is mogelijk om meerdere parameters aan de mailto link toe te voegen door het &-teken te gebruiken. Zoals hierboven: "?subject=Onderwerp&body=Tekst".

In de browser ziet deze link er zo uit:

Stuur een e-mail

Byzondere tekens in de link

Niet alle tekens kunnen zomaar gebruikt worden in een mailto link. Zo mag je geen spaties gebruiken in de URL. Als je bijvoorbeeld een spatie wilt toevoegen in het body= gedeelte van de link dan moet je %20 typen in de code:

<a href="mailto:gebruikersnaam@emailadres.nl?subject=Onderwerp&body=Tekst%20komt%20hier">Stuur een e-mail</a>

Het resultaat:

Stuur een e-mail

Enkele tekens die je moet vervangen zijn:

• spatie -> %20
• & -> &amp;
• " -> &quot;
• = -> %3D
• : -> %3A
• @ -> %40
• ? -> %3F

Spam en mailto links

Een probleem met mailto links is dat ze opgepikt kunnen worden door spambots die het web afstruinen naar e-mailadressen. Het gevolg is dat een mailto link op een webpagina kan zorgen voor een hoop spam op dat e-mailadres. Om dit te bestrijden kun je het e-mailadres coderen. Ook kun je het e-mailadres vervangen door een afbeelding, maar dat heeft als nadeel dat bezoekers nog gewoon je e-mailadres moeten intypen.

Een andere oplossing is om een formulier te maken en bijvoorbeeld een PHP script te gebruiken voor het verwerken van de informatie. Met een formulier dat gewoon weer gebruik maakt van mailto in de code (zoals we doen in de les over het maken van een formulier) beschermen we het e-mailadres dus niet tegen spambots. Daarvoor is een server-side script nodig.

Lees ook:

• Formulier maken in HTML
• E-mailadres coderen

MijnHomepage Tip