HTML-Code für Mailto-Links: Einfach erklärt

Was ist ein Mailto-Link in HTML?

Ein Mailto-Link in HTML ist ein spezieller Hyperlink, der es dir ermöglicht, eine E-Mail-Nachricht direkt aus einer Webseite zu senden. Wenn du auf einen Mailto-Link klickst, wird eine neue E-Mail-Nachricht in deinem Standard-E-Mail-Programm erstellt, an die angegebene E-Mail-Adresse adressiert und mit der optionalen Betreffzeile und dem optionalen Nachrichtentext vorausgefüllt.

Wie funktioniert ein Mailto-Link?

Ein Mailto-Link besteht aus einer speziellen Syntax, die wie folgt aussieht:

<a href="mailto:[email protected]">Klicke hier, um eine E-Mail zu senden</a>

Wenn du auf diesen Link klickst, wird dein E-Mail-Programm geöffnet und eine neue E-Mail-Nachricht erstellt:

• An: [email protected]
• Betreff: (Keine Betreffzeile)
• Nachricht: (Kein Nachrichtentext)

Vorteile von Mailto-Links

Mailto-Links bieten mehrere Vorteile:

• Bequeme Möglichkeit, Kontakt aufzunehmen: Mailto-Links ermöglichen es dir, schnell und einfach eine E-Mail an den angegebenen Empfänger zu senden.
• Zeitersparnis: Mailto-Links sparen dir Zeit, da du den Empfänger nicht manuell eingeben oder den Betreff und den Nachrichtentext nicht kopieren und einfügen musst.
• Erhöhte Konversion: Mailto-Links können die Konversionsraten erhöhen, indem sie es dir leicht machen, mit Unternehmen oder Einzelpersonen in Kontakt zu treten.

Wie schreibe ich einen Mailto-Link in HTML?

Um einen Mailto-Link in HTML zu schreiben, folge diesen Schritten:

Syntax

Die grundlegende Syntax eines Mailto-Links lautet:

<a href="mailto:[email-Adresse]">[Link-Text]</a>

Ersetze [email-Adresse] durch die tatsächliche E-Mail-Adresse und [Link-Text] durch den Text, den du als Link anzeigen möchtest.

Beispiel

Hier ist ein Beispiel für einen Mailto-Link:

<a href="mailto:[email protected]">Kontaktiere uns</a>

Wenn ein Benutzer auf diesen Link klickt, wird sein Standard-E-Mail-Client mit einer neuen E-Mail-Nachricht geöffnet, die an die Adresse [email protected] adressiert ist.

Betreff und Text vordefinieren

Optionalerweise kannst du mit den Attributen subject und body einen Betreff und einen Textvorspann in die E-Mail einfügen:

<a href="mailto:[email protected]?subject=Anfrage zu meinem Blog&body=Hallo Herr/Frau Mustermann,
ich habe eine Frage zu Ihrem Blog-Artikel...">Kontaktiere uns</a>

Weitere Attribute

Zusätzlich zu den bereits erwähnten Attributen kannst du auch die folgenden Attribute verwenden:

• cc: Eine Kopie der E-Mail an eine zusätzliche Adresse senden
• bcc: Eine Blindkopie der E-Mail an eine zusätzliche Adresse senden
• charset: Den Zeichensatz der E-Mail angeben
• headers: Zusätzliche Kopfzeilen in die E-Mail einfügen

Attribute des Mailto-Links

mailto-Attribut

Das wichtigste Attribut ist mailto, das die E-Mail-Adresse festlegt, an die die Mail gesendet werden soll. Du kannst nur eine E-Mail-Adresse pro Mailto-Link angeben.

subject-Attribut

Mit dem subject-Attribut kannst du einen Betreff für die E-Mail festlegen. Dies ist nützlich, um dem Empfänger mitzuteilen, worum es bei der Nachricht geht.

body-Attribut

Das body-Attribut ermöglicht es dir, einen vordefinierten Text in die E-Mail-Nachricht einzufügen. Dies kann hilfreich sein, um zusätzliche Informationen oder Anweisungen bereitzustellen.

cc- und bcc-Attribute

Die Attribute cc (carbon copy) und bcc (blind carbon copy) ermöglichen es dir, weitere E-Mail-Adressen anzugeben, an die die E-Mail gesendet werden soll. Die Empfänger, die in das bcc-Feld aufgenommen werden, werden im E-Mail-Header für andere Empfänger nicht sichtbar sein.

Andere Attribute

Neben diesen Hauptattributen kannst du auch die folgenden optionalen Attribute verwenden:

• charset: Legt den Zeichensatz für die E-Mail-Nachricht fest.
• enctype: Legt die Codierung für die E-Mail-Nachricht fest.
• hreflang: Gibt die Sprache der E-Mail-Nachricht an.
• media: Gibt die Medientypen an, auf die der Mailto-Link angewendet werden soll.
• rel: Gibt die Beziehung zwischen dem Mailto-Link und dem aktuellen Dokument an.
• target: Legt das Fenster oder den Frame fest, in dem die E-Mail geöffnet werden soll.
• type: Gibt den MIME-Typ der E-Mail-Nachricht an.

Verwenden von Mailto-Links in HTML-Dokumenten

Sobald du deinen Mailto-Link geschrieben hast, kannst du ihn in dein HTML-Dokument einfügen. Dabei hast du zwei Möglichkeiten:

Inline-Links

Ein Inline-Link öffnet die E-Mail-Anwendung des Lesers sofort, wenn er auf den Link klickt. Dies ist eine einfache und schnelle Möglichkeit, Mailto-Links zu verwenden. Um einen Inline-Link zu erstellen, füge einfach den Mailto-Link in dein HTML ein:

<a href="mailto:[email protected]">Kontaktiere uns</a>

Verlinkter Text

Mit verlinktem Text kannst du einen Teil des Texts in deinem Dokument in einen Mailto-Link verwandeln. So kannst du dem Link einen aussagekräftigeren Aufruf zum Handeln geben. Um verlinkten Text zu erstellen, verwende das folgende Format:

<a href="mailto:[email protected]">Kontaktieren Sie uns noch heute</a>

Öffnen in einem neuen Tab

Manchmal möchtest du vielleicht, dass der Mailto-Link in einem neuen Tab oder Fenster geöffnet wird. Dies verhindert, dass der Leser deine Seite verlässt. Um einen Mailto-Link in einem neuen Tab zu öffnen, füge das Attribut target="_blank" hinzu:

<a href="mailto:[email protected]" target="_blank">Kontaktiere uns</a>

Vorteile der Verwendung von Mailto-Links

mailto-Links bieten zahlreiche Vorteile, die dich bei der Kommunikation per E-Mail unterstützen:

Benutzerfreundlichkeit

• Mailto-Links sind für den Benutzer äußerst bequem. Mit nur einem Klick auf den Link wird ein neues E-Mail-Fenster geöffnet und die E-Mail-Adresse des Empfängers ist bereits ausgefüllt.

Direkte Kommunikation

• Mailto-Links erleichtern die direkte Kommunikation mit bestimmten Personen oder Abteilungen. Du kannst sie auf deiner Website, in Newslettern oder in sozialen Medien bereitstellen, um die Kontaktaufnahme zu vereinfachen.

Keine Umleitung

• Anders als bei Kontaktformularen, die auf eine Zwischenseite weiterleiten, verweisen Mailto-Links direkt auf das E-Mail-Programm des Benutzers. Dies spart Zeit und reduziert Frustration.

Anpassung

• Mailto-Links können mit zusätzlichen Attributen angepasst werden, um beispielsweise den Betreff der E-Mail festzulegen oder eine Kopie an eine weitere E-Mail-Adresse zu senden.

Tracking und Analyse

• Einige E-Mail-Marketing-Plattformen bieten die Möglichkeit, Mailto-Links zu tracken. So kannst du die Leistung deiner E-Mail-Kampagnen analysieren und Optimierungen vornehmen.

Einschränkungen bei der Verwendung von Mailto-Links

Trotz ihrer Einfachheit unterliegen Mailto-Links einigen Einschränkungen:

Spam und Phishing

Mailto-Links können missbraucht werden, um Spam und Phishing-E-Mails zu versenden. Cyberkriminelle können gefälschte Mailto-Links erstellen, die zu Phishing-Websites führen, die persönliche Informationen wie Passwörter oder Bankdaten abgreifen sollen.

Fehlendes Tracking

Im Gegensatz zu anderen Verknüpfungen ermöglichen Mailto-Links kein Tracking. Wenn du auf einen Mailto-Link klickst, wird die E-Mail-Anwendung geöffnet, ohne dass Informationen über den Klick erfasst werden. Dies kann es schwierig machen, die Wirksamkeit von Marketingkampagnen zu messen.

Kein automatisches Ausfüllen

Bei Mailto-Links werden keine Informationen zum E-Mail-Empfänger automatisch ausgefüllt. Der Benutzer muss die E-Mail-Adresse manuell eingeben, was zu Fehlern führen kann.

Inkompatibilität mit mobilen Geräten

Auf mobilen Geräten können Mailto-Links inkompatibel sein oder zu Verwirrung führen. Wenn ein Benutzer auf einen Mailto-Link auf einem Smartphone oder Tablet klickt, wird möglicherweise nicht die richtige E-Mail-App geöffnet.

Zugänglichkeitsprobleme

Mailto-Links können für Benutzer mit eingeschränkter Mobilität oder Sehbehinderungen schwer zugänglich sein. Sie funktionieren möglicherweise nicht mit Bildschirmlesegeräten und können für Personen mit Sehbehinderungen schwierig zu erkennen sein.

Folge uns

Neue Posts

Node.js NVM: Antworten auf die häufigsten Fragen

Entwicklung

Professionelle Gmail-HTML-Signaturen: Erstellen, Gestalten und Nutzen

Marketingstrategien

Die vollständige Anleitung zu poczta wp: Alles, was Sie wissen müssen

Sicherheit und Datenschutz

HTML-Content: Der ultimative Leitfaden zur Erstellung ansprechender Webseiten

SEO-Optimierung

Das HTML-Title-Attribut: Ein Leitfaden zur Optimierung von Titeln für SEO und Benutzerfreundlichkeit

Online-Marketing

HTTP-Statuscodes: Ihre Bedeutung und Verwendung im Web

Einführung in HTTP-Statuscodes

Besucherzähler für Websites: Tracking Ihres Website-Traffics für Erfolg

SEO-Optimierung

Beschleunigen Sie die Dateneingabe mit HTML Datalist

Webentwicklung

HTML in PUG konvertieren: Einfach und schnell gemacht

Webentwicklung

HTML Section vs. Div: Die entscheidenden Unterschiede und wann man was verwendet

Webentwicklung

Beliebte Posts