a href: So bauen Sie Links auf Ihrer Website ein

a href wird dazu verwendet, externe und interne Links auf einer Website einzubauen. Die zulässigen Werte des HTML-Attributs href sind dabei genau definiert. Anwendungsbeispiele sind neben der Verlinkung auf andere Websites auch die Weiterleitung auf Mailadressen oder Telefonnummern.

Mit a href erstellen Sie externe oder interne Verlinkungen in einem HTML-Dokument. Richtig angewendet fügt sich das href-Attribut nahtlos in Ihre Website ein und erscheint dort in Form eines Hyperlinks. Besucherinnen und Besucher Ihrer Onlinepräsenz gelangen dann mit einem Klick auf eine andere Seite oder wechseln innerhalb Ihrer Website zu einem anderen Ziel. href steht dabei für „hyper reference“ und gibt das gewünscht Linkziel an. Der Einsatz von href-Attributen auf Ihrer Website bringt zahlreiche Vorteile mit sich. So schaffen Sie durch die hinterlegten Links eine bessere Strukturierung, erleichtern die Navigation oder stellen Zusatzinformationen zur Verfügung. Auch für SEO können Links vorteilhaft sein.

Die Syntax von href ist in HTML immer gleich und sieht aus wie folgt:

Jeder Baustein erfüllt dabei eine wichtige Funktion:

• Durch das a wird der Link eingeleitet. Das a weist dabei einen Ankertext aus. Dieses HTML-Tag definiert den Anfangs- und Endpunkt des Hyperlinks.
• Das href-Attribut wird innerhalb des Ankertextes eingesetzt und legt das Sprungziel des jeweiligen Links fest. Neben einer internen oder externen Website können hier beispielsweise PDF-Dokumente oder Bilder verlinkt werden.
• Innerhalb der Anführungszeichen wird die URL gesetzt, auf die der Link verweisen soll. Diese wird mit Domain angegeben, also z. B. „beispielseite.de“ für eine externe Seite oder „beispielseite.html“ für einen internen Link.
• Dahinter folgt der sichtbare Text, der später anklickbar ist.
• Zuletzt wird der Ankertext abgeschlossen.

Es ist genau bestimmt, welche Werte das Attribut href in HTML haben darf. Andernfalls erfolgt die Verlinkung nicht ordnungsgemäß. Die erlaubten Werte für href sind folgende:

• Eine absolute URL: Die absolute URL ist das klassische Beispiel für die Verwendung von a href. Sie leitet direkt auf eine externe Website weiter. Beispiel: href="https://www.ionos.de/digitalguide/www.beispielseite.de"
• Eine relative URL: Die relative URL leitet zu einer Datei innerhalb einer Website. Beispiel: href="https://www.ionos.de/digitalguide/default.htm"
• Link zu einem Element: Der direkte Link zu einem Element ist möglich, wenn dieses über eine definierte ID verfügt. Sie haben so die Möglichkeit, ausgewählte Bereiche Ihrer Website intern zu verlinken. Beispiel: href="#section3"
• Andere Protokolle: href eignet sich auch für weitere Protokolle, etwa wenn Sie einen direkten Link zu einer vorgegebenen E-Mail-Adresse setzen möchten. Dies funktioniert über mailto:. Andere mögliche Protokolle sind u. a. https://, ftp:// oder file:.
• Skripte: Auch Skripte, z. B. JavaScript, sind erlaubte Werte für a href. Beispiel: href="javascript:alert('Haben Sie weitere Fragen?');"

Es gibt also zahlreiche Anwendungsmöglichkeiten für a href, die Sie auf Ihrer Website implementieren können. Im Folgenden zeigen wir Ihnen einige der gängigsten Anwendungsfälle für href in HTML.

Möchten Sie mit href ein Bild als Link auf eine Unterseite setzen, verwenden Sie dafür folgenden Code:

Um eine E-Mail-Adresse zu verlinken, verwenden Sie mailto: als Zusatz direkt vor der Adresse. Das sieht so aus:

Klickt die Besucherin oder der Besucher nun auf den Link, öffnet sich ihr bzw. sein Standardprogramm für E-Mails und fügt die angegebene Adresse (mustermann@beispielseite.de) automatisch als Empfänger ein. Alternativ hat sie bzw. er die Möglichkeit, die angegebene E-Mail-Adresse mit einem Rechtsklick zu kopieren und selbst in das Programm oder an einer anderen Stelle einzufügen.

Auch eine Telefonnummer können Sie mit a href verlinken. Das ist gerade dann sinnvoll, wenn jemand Ihre Seite über das Smartphone aufruft und direkt mit Ihnen in Kontakt treten möchte. Die Verlinkung sieht so aus:

Hierbei ist es wichtig, dass Sie hinter dem Telefonverweis tel: ein Pluszeichen und die internationale Vorwahl hinzufügen. Die Null der Ortsvorwahl fällt weg.

Sie können mit href auch auf ein JavaScript verlinken. Der entsprechende Code ist dieser:

Auch wenn Links durchaus sinnvoll für Ihre Seite sind, möchten Sie Ihre Besucherinnen und Besuchern dennoch nicht direkt wieder von Ihrer Website auf einen externen Online-Auftritt schicken. Aus diesem Grund kann es sinnvoll sein, den Link in einem neuen Tab oder einem neuen Fenster zu öffnen. So bleiben Nutzerinnen und Nutzer auf Ihrem Angebot und können eventuelle Zusatzinformationen später nachsehen. Der passende Code dafür sieht so aus: