Een klikbare link maken in e-mail, documenten en HTML

Om een link klikbaar te maken, selecteer je de woorden die je in een link wilt veranderen, druk je op Ctrl+K (Cmd+K op de Mac) en plak je de bestemmings-URL. Die ene sneltoets werkt in Word, Outlook, Gmail, Google Docs, Notion en de meeste andere editors. In kale HTML schrijf je het met de hand: <a href="https://example.com">visit us</a>. Al het andere is weten waar een klikbare link werkt, waar nooit, en hoe je de link het aantikken waard maakt.

Een klikbare link is een hyperlink: zichtbare tekst (de ankertekst) gekoppeld aan een bestemmingsadres. Heb je een lang adres en wil je een schoon, traceerbaar adres, dan doet een korte link hetzelfde werk met minder rommel; de cornerstone over wat linkbeheer is behandelt branding, tracking en routering zodra de basis werkt.

De snelle manier om een link klikbaar te maken: Ctrl+K

Bijna elke rich-texteditor volgt hetzelfde patroon. Schrijf de woorden die je klikbaar wilt maken, selecteer ze, druk op Ctrl+K (Cmd+K op de Mac) of klik op het kettingschakelicoon, plak de URL en bevestig. Plak je een los adres dat met https:// begint en druk je op spatie of Enter, dan maken de meeste tools er zelf een link van, maar ankertekst met een hyperlink leest beter dan een naakt adres.

• Word, Outlook: Ctrl+K, of rechtsklik en kies Link.
• Gmail: het linkicoon in de werkbalk van het opstelvenster, of Ctrl+K.
• Google Docs en Sheets: Invoegen, dan Link, of Ctrl+K.
• Slack: Ctrl+Shift+U (Cmd+Shift+U op de Mac) op geselecteerde tekst.
• Markdown (GitHub, Notion, Discord): [anchor text](https://example.com).
• HTML: <a href="https://example.com">anchor text</a>.

Sneltoetsen verschillen per appversie, dus als er een faalt, gebruik dan de knop in de werkbalk; die is er altijd. Ik heb Ctrl+K in mijn spiergeheugen en controleer de link toch nog één keer door erop te klikken voordat ik iets belangrijks verstuur.

Hoe een klikbare link werkt in HTML

Onder elke knop "link maken" zit één element. De anchor-tag heeft twee delen: de href (waar het naartoe gaat) en de tekst tussen de tags (waarop de lezer klikt).

<a href="https://example.com/pricing">See pricing</a>

De MDN-gids over het maken van links documenteert de rest. Drie details veroorzaken het meeste echte gedoe.

• Volledige of relatieve adressen. Een externe site heeft de volledige URL met https:// nodig. Voor pagina's op je eigen site blijft een root-relatief pad zoals /pricing werken als de pagina met de link verhuist.
• Openen in een nieuw tabblad. target="_blank" opent een nieuw tabblad. Doe dat bewust, voor externe links, en voeg rel="noopener" toe als je oudere browsers target.
• Springen binnen een pagina. href="#faq" scrolt naar het element met id="faq". Voeg hetzelfde fragment toe aan een volledig adres om dieplinken naar een andere pagina te maken.

Klikbare links voor e-mailadressen, telefoonnummers en downloads

Een link hoeft geen webpagina te openen. Het schema aan het begin van het adres bepaalt wat er gebeurt.

<a href="mailto:[email protected]?subject=Question%20about%20pricing"
  >Email us</a
>
<a href="tel:+15551234567">Call us</a>
<a href="/files/price-list.pdf" download>Download the price list (PDF)</a>

Een mailto:-link opent de mailapp van de lezer, en je kunt het onderwerp vooraf invullen na een ?; spaties hebben percent-codering nodig (%20). Een tel:-link belt op een telefoon en doet weinig op een desktop. Zeg wat de lezer gaat krijgen als het een bestand is: het type en de ruwe grootte ("PDF, 2 MB") besparen mensen met een trage verbinding een verspilde tik. Sommige links openen een vooraf ingevuld evenement in plaats van een pagina; een link om aan de agenda toe te voegen gebruikt dezelfde opmaak met een andere bestemming.

Schrijf ankertekst waar mensen iets aan hebben

De zichtbare woorden moeten zeggen waar de link naartoe gaat. Gebruikers van schermlezers springen vaak buiten context van link naar link, dus "klik hier" of een geplakt adres vertelt hun niets. Zoekmachines lezen dezelfde woorden.

• Goed: "lees de installatiegids".
• Zwak: "klik hier", "deze link", of het kale adres herhaald als tekst.

Laat links ook als links uitzien. Kleur plus een onderstreping is het veiligste signaal. Een lichtgrijze onderstreepte zin midden in een alinea wordt gemist, en een link in knopstijl is prima als de actie het punt van de pagina is.

Waar een klikbare link niet werkt

Dit is het deel waardoor mensen gaan zoeken. Sommige plekken tonen geen links, hoe je ze ook opmaakt.

• Instagram-bijschriften en -reacties: niet klikbaar. De profielbio heeft één linkvak, en Stories kunnen een linksticker dragen.
• TikTok-videobeschrijvingen: niet klikbaar. De profiellink is de gebruikelijke route.
• Gedrukt materiaal, slides en video: niets om aan te tikken, en daarvoor is een QR-code.
• E-mail in platte tekst: sommige clients tonen een geplakt adres als link en andere niet. HTML-e-mail met echte anchor-tags is de betrouwbare route.

Andere plekken gedragen zich anders: berichten op X, LinkedIn en Facebook maken van een geplakte URL meestal een link, al verkorten of tonen ze die soms als preview. Platforms veranderen dit, dus test met een concept voordat je een campagne eromheen plant.

Op plekken waar een kale URL alleen tekst is, moet de lezer hem typen. De oplossing heeft twee delen: zet de link waar links wel werken (het bio-linkvak of een link-in-bio-pagina) en maak het adres kort en gedenkwaardig genoeg om te typen of te herkennen. Een lange tracking-URL is daar kansloos; een korte merklink niet. De uitleg over een link toevoegen aan je Instagram-bio en de TikTok link-in-bio behandelen de platformstappen.

Waarom je link niet klikbaar is (en de oplossing)

Werk deze lijst op volgorde af. Hij dekt vrijwel elk geval dat ik heb gezien.

1. Het adres heeft geen schema. example.com/page kan platte tekst blijven waar https://example.com/page een link wordt. Voeg https:// toe.
2. Er staat een losse spatie of regeleinde in het adres. Plak het in een veld voor platte tekst om het te zien en verwijder dan de opening.
3. De editor staat in de modus voor platte tekst. Controleer in Gmail dat het opstelvenster niet op platte tekst staat; schakel in een CMS van de codeweergave naar de visuele, of andersom.
4. Het platform haalt links weg. Zie de lijst hierboven; geen opmaak lost dat op.
5. De link werkt maar gaat naar de verkeerde plek. Een typfout of een meegekopieerd trackingachtervoegsel. Klik er zelf op voordat je verstuurt.

Maak de klikbare link het klikken waard

Zodra de link werkt, maken twee upgrades hem beter. Verkort hem zodat hij schoon en aantikbaar is, en geef hem een merk zodat mensen hem vertrouwen. Een korte merklink is makkelijker te plaatsen in een bio, voor te lezen in een video of in een sms te zetten dan een kale URL met een querystring, en hij laat je klikken tellen en de bestemming later omleiden zonder het bericht te bewerken. Draagt het lange adres campagnetags, dan laat UTM-parameters uitgelegd zien wat elke tag doet voordat je ze achter een korte link verbergt.

Schrijf je HTML met de hand, houd dan de volledige URL in de href en laat de ankertekst de betekenis dragen. Zet je links in bijschriften, presentaties en drukwerk, grijp dan naar een korte link en een QR-code. Dezelfde bestemming, geplaatst waar hij echt gebruikt kan worden.

Lees de cornerstone-reeks

Dit hoort bij het tutorialcluster. De cornerstone is wat is linkbeheer. Voor de basis van verkorten is een URL verkorten het begeleidende artikel.

Gerelateerd op de blog

• Wat is linkbeheer? Het volledige plaatje
• Een URL verkorten: gratis, merklinks en bulk
• Een link toevoegen aan je Instagram-bio
• TikTok link in bio: de complete setup
• Link toevoegen aan agenda: bouw er een die overal werkt
• UTM-parameters uitgelegd