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:empfaenger@beispiel.com">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: empfaenger@beispiel.com
- 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:info@beispiel.de">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 info@beispiel.de 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:info@beispiel.de?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.
Weitere Einzelheiten findest du in: HTML-Button-Aktionen: Ein umfassender Leitfaden zur Verbesserung der Benutzerinteraktion
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:
Mehr dazu erfährst du in: So fügen Sie Links in HTML ein
<a href="mailto:info@beispiel.com">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:info@beispiel.com">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:info@beispiel.com" 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.
Für mehr Details, lies auch: HTML bearbeiten: Schritt-für-Schritt-Anleitung für Anfänger
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.
Verwandte Artikel
- So fügst du schnell und einfach Emojis in deine HTML-Dokumente ein
- HTML-Dropdown-Menüs: Erstellen Sie interaktive Navigationsleisten für Ihre Website
- HTML-Button-Href: So verlinken Sie Schaltflächen
- HTML: Eine Programmiersprache?
- Der ultimative Leitfaden zur Verwendung von HTML-Schaltflächen für Formulareingaben
- Kreuzfahrt im World Wide Web: Internet-gestützte Urlaubsplanung auf hoher See
- Erkunden Sie das
- HTML-Beispiele: Praktische Anwendung von HTML-Elementen
- Das HTML-Element
: Struktur und Verwendung - HTML DL-Element: Strukturieren Sie Begriffe und Definitionen im Web
- HTML-Tabs: Eine umfassende Anleitung zur Verwendung von Registerkarten in Ihren Webseiten
- Das HTML-Attribut "checked": So aktivieren Sie Kontrollkästchen im Handumdrehen
- HTML-Label: Das unsichtbare Element, das Eingabefelder definiert
- Das HTML
- HTML-Fortschrittsbalken: Visuelle Anzeigen für den Fortschritt
Neue Beiträge
Synchronisierung der Zeit unter Linux: Ein umfassender Leitfaden
Fehlerbehebung
Gigacube Admin: Zugang zu den erweiterten Einstellungen Ihres Routers
Fehlerbehebung
Linux Mint Themes: Personalisieren Sie Ihren Desktop
Open Source
Die besten Musikplayer mit Streaming-Unterstützung für Linux
Technologie
Neue Linux Distributionen 2025: Ein Blick auf die Zukunft der GNU/Linux-Welt
Technologie
Effiziente Optimierung von Linux auf alten Laptops
Technologie
Effiziente Methoden zum Taggen und Verwalten von Musik unter Linux
Open Source Software
Erfolgreiche Strategien zur Optimierung Ihres Gigacube Netzwerks
Technologie
Gigacube Portfreigabe Einrichten: Schritt-für-Schritt-Anleitung
Technologie
Strategien zur Anpassung von Linux Mint für verbesserte Benutzererfahrung
Technologie
Beliebte Beiträge
Mounten von ISO-Images unter Linux: Eine Schritt-für-Schritt-Anleitung
Anleitungen
LaTeX: Das mächtige Werkzeug für hochwertiges Dokumentenschreiben
Dokumentenerstellung
TCPdump-Beispiele: Paketakquise und Netzwerkdiagnose
Fehlerbehebung
Pseudocode Beispiel: Effektives Programmieren leicht gemacht
Softwareentwicklung
iCloud auf Linux: Eine Anleitung zur Nutzung des Apple-Cloud-Dienstes auf Linux-Systemen
Anleitungen
Die besten Linux-Musikplayer für Hörgenuss der Extraklasse
Benutzerfreundlichkeit
Zurücksetzen von Linux Mint: Schritt-für-Schritt-Anleitung
Anleitungen
Die vollständige Anleitung zu poczta wp: Alles, was Sie wissen müssen
Sicherheit und Datenschutz
Bilder Drehen in OpenOffice: Eine Schritt-für-Schritt-Anleitung
OpenOffice
PDFs unter Linux zusammenführen: Eine Schritt-für-Schritt-Anleitung
Open Source