• Home
  • /
  • Blog
  • /
  • HTML Link einfügen, 5 intelligente Möglichkeiten wie es geht

Offenlegung: Dieser Artikel kann Affiliate-Links enthalten. Als Affiliate erhalte ich eine Vergütung, wenn Du über diese Links einkaufst, ohne dass Dir zusätzliche Kosten entstehen.


Autor: Matthias

Aktualisiert: 27. Feb. 2024

HTML Link einfügen

Ich gehe hier auf Links ein, mit denen du dich näher zu beschäftigen hast, wenn du Websites für private oder kommerzielle Zwecke betreiben willst.

Welche Arten von Links gibt es:


1. interne Links

Einsatz: interne Links auf der Website, die auf die eigene Website leiten.

HTML Code - interne Links:

<a href="https://www.blog.com/beitrag-alpha">Beitrag Alpha</a>

Variante 2:

<a href="/beitrag-alpha">Beitrag Alpha</a>

Vorteil bei Variante 2: ändert sich die Domain, braucht der Link nicht geändert werden.

Hinweis für WordPress Nutzer: Mithilfe des Datenbank Plugin: Better-Search-Replace können zum Beispiel Links von „https://www.blog.com/beitrag-alpha“ auf „https://www.blog.com/beitrag-beta“ umgeschrieben werden. Damit hier keine Probleme auftreten, zum Beispiel weil Leerzeichen bei der URL-Eingabe übersehen wurden, zuvor ein Backup der Seite erstellen.


2. interne Anker

Einsatz: Im Beitrag auf eine bestimmte Stelle verlinken. Oder von außerhalb des Beitrags, direkt auf eine bestimmte Stelle im Beitrag verweisen.

HTML Code - interne Anker:

<a name="ankername">Beispieltext</a>

Hier wird das Wort mit im Text angezeigt.

Oder:

<a name="ankername"></a>

Hier wird nichts im Beitrag angezeigt. Der Anker kann platziert werden, ohne dass es auffällt. Platziere diesen an einer von dir gewünschten Stelle auf der Website.

Wie verlinkst du auf den Anker?

Setze einen Link wie folgt:

<a href="https://www.blog.com/beitrag-alpha/#ankername">Beitrag Alpha, Themenpunkt Anker</a>

Die URL mit Anker ist:

https://www.blog.com/beitrag-alpha/#ankername

Wenn der Besucher die Seite über diesen Link öffnet, wird er direkt zu dem Bereich geleitet, wo der Anker platziert ist. Damit kann der Leser direkt die Information einsehen, zu der du ihn führen wolltest.


3. externe Links, normal

Einsatz: Du verlinkst auf eine externe Website und möchtest, dass der Besucher weiterhin deine Seite offen hat, nachdem er den Link geklickt hat.

Du setzt hierfür das Attribut target="_blank" zusätzlich in den Link. Beachte das Leerzeichen vor dem Wort target.

HTML Code - externe Links:

<a href="https://www.blog.com/beitrag-alpha" target="_blank">Beitrag Alpha</a>


4. externe Links, no-follow

Einsatz: Du verlinkst auf eine externe Website und willst dabei nicht die Linkkraft weitergeben. Damit verlinkst du Affiliate-Links, wobei du hier noch zusätzlich das Attribut sponsored einfüget könntest.

Du kannst diese Links im selben oder in einem neuen Fenster öffnen lassen.

HTML Code - externe Links, no-Follow:

A. Seite im selben Fenster öffnen:

<a href="https://www.blog.com/beitrag-alpha" rel="nofollow">Beitrag Alpha</a>

B. Seite in neuem Fenster öffnen:

<a href="https://www.blog.com/beitrag-alpha" target="_blank" rel="nofollow">Beitrag Alpha</a>

C. Seite in neuem Fenster, maskiert mithilfe von JavaScript

<a href="#" onClick="window.open('https://www.blog.com/beitrag-alpha')" rel="nofollow">Beitrag Alpha</a>

Danke an Linkcode-Generator. Mithilfe dieser Javascript-Weiterleitung wird die Link-URL dem Besucher erst dann ersichtlich, wenn er darauf geklickt hat.

Ich habe den Code nochmals verändert, weil er bei mir nicht zum gewünschten Ergebnis führte. Ich hatte die Schriftgröße auf 110% zu stellen. Hier wie folgt der HTML-Code dafür:

<font face="Tahoma"><p style="font-size:110%;"><b>Link zur Website: <a href="#" onclick="window.open('//marketingblog.biz/extern/empfehlung/website-titel', '_blank')" draggable="false"><b>Website-Titel</b></a></b></p></font>

Hinweise:

  • Das Element <b></b> für fette Texte kann genutzt oder entfernt werden
  • Das Element <font face="Tahoma"></font> kann ebenfalls entfernt bzw. durch die auf der eigenen Website genutzte Schriftart ausgetauscht werden.

Anmerkung: Ich bin selbst kein Coder. Für mich sind solche Dinge Neuland. Hier findet ihr weitere Möglichkeiten, den HTML Quellcode anzupassen*, z. B. die Farbe des Textes.

Diese HTML-Quellcode-Lösung macht nur Sinn, wenn die Affiliate-Link URL nicht sichtbar sein soll. Früher gab es ein Plugin, welches per Skript dazu in der Lage war, organische Links in Affiliate-Links umzuwandeln. Allerdings sah jeder im Quellcode, welche Partnerlinks sich auf der gesamten Website befanden. Daher entfernte ich dieses Plugin wieder. Heute ist es nicht mehr verfügbar.


5. sponsored Links

Einsatz: Du verlinkst auf eine externe Website, für dessen Link du bezahlt wurdest. Damit verlinkst du Affiliate-Links, wobei du hier meiner Ansicht nach das Attribut sponsored weglassen kannst.

HTML Code - sponsored Links:

<a href="https://www.shop.com/produkttitel" target="_blank" rel="nofollow sponsored">Produkt Alpha</a>


Ergänzungen


a) Affiliate Links markieren

Platziere nach dem Linktext zum Beispiel noch ein Sternchen. Am Ende der Seite platzierst du einen Hinweis, worum es sich bei diesem Link handelt, nämlich um einen Affiliatelink. Ich verlinke das mit einem Anker-Link auf der Datenschutz-Seite. Dort erläutere ich, worum es sich bei diesem Link handelt.

Aufgrund der Transparenz solltest du Werbelinks innerhalb von redaktionellen Content kennzeichnen.

Wenn du einen reinen Werbe-Artikel schreibst, kannst du darauf anfangs hinweisen und im Beitrag selbst kannst du dir die Link-Markierungen mit einem Sternchen dann sparen. Ich würde in diesem Fall am Ende des Artikels nochmal darauf hinweisen, dass du an jedem Sale den du vermittelst, weil jemand auf den Link im Artikel geklickt hat, eine Provision erhältst.


b) Bilder und Grafiken

Du kannst außerdem Bilder und Grafiken verlinken, worauf dieser Beitrag eingeht.


c) Links in Videos

Auch in Videos kannst du Links platzieren, was über YouTube allerdings eine gewisse Reichweite erfordert, um auf diese Funktion zugreifen zu können.

Nutzt du Vimeo, kannst du dort ab dem Plus Tarif (Vimeo Refer-a-Friend Angebot*), eine Headline, einen etwas längeren Text, sowie einen verlinkbaren Button und Text platzieren. Damit ist Vimeo für eigene Websites attraktiver, weil der Player nicht ablenkt.


d) Links im Newsletter

Die Links im E-Mail werden ohne spezielle Markierungen eingefügt. Du kannst und solltest einen Linktext wählen, der von der URL abweicht. Teste heraus, was besser funktioniert.

Affiliate-Links in Newslettern sind nicht zu kennzeichnen. Du kannst es tun, allerdings sind das die Empfänger nicht gewöhnt und die Klickrate erhöht es nicht.


HTML-Codearbeit heute meist überflüssig

Mit einer professionellen Web-Software oder einem Homepage Baukasten, kannst du die Links komfortabel einfügen und verwalten.

Wenn du Links professionell auswerten und damit noch mehr Dinge anstellen willst, als die Klickzahlen auswerten und das Link-Ziel von langen Affiliate-Links zu tarnen, setze auf eine Link-Management-Software.

Es ist sinnvoll wenn du weißt, was der Code im Web bedeutet und wie er sich zusammensetzt.

Zeit sparen kannst du, wenn du mit Drag&Drop Software arbeitest und dich darauf fokussierst, die Ladezeit gering zu halten, die Usability zu steigern und die Website für Desktop und Smartphone zu optimieren.

Offenlegung: Dieser Inhalt wird vom Leser unterstützt. Das heißt, wenn Du auf einige dieser Links klickst, erhalte ich möglicherweise eine Provision.

Veröffentlicht: 2023-05-28 | Zuletzt aktualisiert: 2024-02-27

Autor:

Matthias


Matthias’ schreibt über Online Marketing Themen, wie Content-, E-Mail- und Affiliate-Marketing. Er schätzt Menschen, die in ihrer Mitte sind. Sein Motto: „Jeden Tag finden Lernprozesse statt.“ Sogenannte „Fehler“ führen zu Erkenntnisprozessen und Erfahrungswerten.


  • Ähnliche Beiträge:
Affiliate Marketing, Keyword Aufrufe auf Wikipedia → Weniger Abrufe über SEO?
Torsten Jaeger’s Content Kong – Inhalte auf Autopilot von YouTube importieren

  • Kommentare
  • Hinweis: Es werden keine Kommentar-IP-Adressen gespeichert. Beachte die Netiquette.

    {"email":"E-Mail-Adresse ungültig","url":"Website-Adresse ungültig","required":"Pflichtfeld fehlt"}

    Diesen Beitrag empfehlen:

    >