Einen E mail Link in HTML erstellen

PDF download PDF herunterladen
unter Mitarbeit von wikiHow Staff

PDF download PDF herunterladen

Wenn du eine eigene Webseite betreibst, ist es immer super für die Besucher deiner Seite, wenn sie eine Möglichkeit haben, dich zu kontaktieren. So können Fragen oder andere Anliegen direkt und einfach geklärt werden. Eine Kontaktmöglichkeit sollte also auf keiner Webseite fehlen. Hier lernst du Schritt für Schritt, wie du einen E-mail-Link zu deiner Webseite hinzufügst, indem du einfache HTML Codes verwendest.

Vorgehensweise

PDF download PDF herunterladen
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/9\/95\/Create-an-Email-Link-in-HTML-Step-1.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-1.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/9\/95\/Create-an-Email-Link-in-HTML-Step-1.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-1.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Das Attribut <a href= ist der Anfang, den du für deinen Link brauchst, denn es ist das Attribut, das deinem Browser vermittelt, dass es sich bei dem nächsten Item um einen Link handelt.
    • Bevor du deinen Link erstellst, solltest du natürlich dein HTML-Dokument schon mit den üblichen Tags vorbereitet haben.
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/6\/6f\/Create-an-Email-Link-in-HTML-Step-2.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/6f\/Create-an-Email-Link-in-HTML-Step-2.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    nach dem "=" Zeichen. Dieses Attribut zeigt deinem Browser, dass es sich bei dem folgenden Link um eine E-mail Adresse handelt und nicht um beispielsweise eine andere Webseite.
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/6\/62\/Create-an-Email-Link-in-HTML-Step-3.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/62\/Create-an-Email-Link-in-HTML-Step-3.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Dein HTML-Code sollte also nun aussehen wie folgt <a href="mailto:maxmustermann@beispiel.de" .
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/76\/Create-an-Email-Link-in-HTML-Step-4.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/76\/Create-an-Email-Link-in-HTML-Step-4.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    So erhält die E-mail automatisch den Betreff, den du vordefiniert hast. Wenn du eine Betreffzeile hinzufügen möchtest, tippe ein Fragezeichen (?) nach der eingegeben E-mail Adresse, dann tippst du "subject" (ohne die Anführungszeichen) und ein Gleichheitszeichen (=) und gibst dann in Anführungszeichen deine Betreffzeile ein.
    • Dein Code sollte dann also so aussehen: <a href="mailto:maxmustermann@beispiel.de?subject="Text der Betreffzeile""
    • Versuche zu vermeiden, in der Betreffzeile andere Zeichen als alphanumerische zu verwenden.
    • Auch, wenn es nicht so häufig verwendet wird, kannst du noch Informationen hinzufügen, damit die Betreffzeile automatisch über die mailto Syntax ausgefüllt wird. Dies wird aber meistens verwendet, wenn die E-mail an einen Server in einem Roboter geleitet wird, damit sie besser gefiltert werden kann.
    • Du kannst auch den Text der E-mail, sowie die Empfänger der Durchschriften (cc und bcc) bereits vordefinieren. Setze einfach ein Fragezeichen (?), gefolgt von "body", "cc", oder "bcc", dann ein Gleichheitszeichen (=) und den Text oder die E-mail Adresse, die du verwenden möchtest in Anführungszeichen.
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/34\/Create-an-Email-Link-in-HTML-Step-5.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/34\/Create-an-Email-Link-in-HTML-Step-5.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Bisher besagt der HTML-Befehl, welche E-mail Adresse verlinkt werden soll und ob z.B. eine Betreffzeile hinzugefügt werden soll oder nicht. Mit der ">" Klammer am Ende zeigst du dem Programm, dass keine weiteren Befehle ausgeführt werden sollen, wenn der Link angeklickt wird.
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/b4\/Create-an-Email-Link-in-HTML-Step-6.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/b4\/Create-an-Email-Link-in-HTML-Step-6.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Jetzt kannst du den Text formulieren, auf den der Benutzer klicken muss, um den E-mail Link zu öffnen. Den Text tippst du nach der Klammer, die zum schließen den Links verwendet wird (">"). Der Text kann so lang oder so kurz sein, wie du möchtest. Du kannst auch einfach deine E-mail Adresse wiederholen, damit die Benutzer dann auf diese klicken können. Oft wird z.B. "hier" verwendet, z.B. im Kontext von "Klicken Sie hier".
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/5\/55\/Create-an-Email-Link-in-HTML-Step-7.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-7.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/5\/55\/Create-an-Email-Link-in-HTML-Step-7.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-7.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Damit schließt du den HTML-Befehl ab. Du musst den Anker-Link unbedingt schließen, damit alles funktioniert wie es soll.
    • Der komplette HTML E-mail Link sollte in etwa so aussehen <a href="mailto:maxmustermann@beispiel.de?subject="Text der Betreffzeile"">Klicken Sie hier, um mir eine E-mail zu schicken!</a> .
  8. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/0\/03\/Create-an-Email-Link-in-HTML-Step-8.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-8.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/03\/Create-an-Email-Link-in-HTML-Step-8.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-8.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Wenn du noch weitere HTML-Codes zu vervollständigen hast, arbeite weiter an diesen. Denke daran, deine Arbeit in regelmäßigen Abständen zu speichern!
    Werbeanzeige

Tipps

  • Der HTML Tag <a> kann in unterschiedlichen Weisen verwendet werden. Am effektivsten kannst du ihn nutzen, wenn du dich über alle Verwendungsarten informierst.
  • Anker-Links müssen in den Body (<body>...</body>) deines HTML-Dokumentes eingefügt werden. Füge sie am besten nirgendwo anders ein, denn sonst kann es zu Fehlermeldungen kommen. Wenn du den Anker-Link z.B. in die Kopfzeile deines HTML-Dokumentes einfügst, kann es sein, dass sich das E-mail Programm schon direkt beim Laden der Webseite öffnet, selbst im Vorschau-Modus.
Werbeanzeige

Warnungen

  • Wenn du eine E-mail Adresse im Internet öffentlich teilst, solltest du damit rechnen, auch viele Spam E-mail zu bekommen.
  • Überprüfe, ob die E-mail und der Name korrekt sind.
  • Wenn Benutzer keinen E-mail Service auf ihrem Computer installiert haben, können sie auch keine E-mail über den Link schicken.
Werbeanzeige

Verwandte wikiHows

Kommentare in HTML Code einfügen
Ein Hintergrund Bild in HTML einfügen
HTM Dateien öffnen
Eine einfache Webseite mit HTML gestalten
HTML Dateien bearbeiten
Die Farbe einer Schaltfläche in HTML ändern
Bilder mit HTML einfügen
Text in HTML blinken lassen
Eine Webseite mit einfachem HTML hacken
Ein Dropdown Menü mit HTML und CSS erstellen
Text in HTML zentrieren
Einen Download Knopf auf einer Webseite erstellen
Mit HTML innerhalb von einer Seite verlinken
In HTML eine Linie einfügen
Werbeanzeige

Referenzen

  1. http://www.zaposphere.com/html-email-links-code/

Über dieses wikiHow

In anderen Sprachen
Diese Seite wurde bisher 20.569 mal abgerufen.

War dieser Artikel hilfreich?

Werbeanzeige