Tooltips für HTML-Tags erstellen

Mit einem zusätzlichen Attribut kannst du ganz leicht Tooltips für HTML Tags erstellen. Dieser Tooltip erscheint dabei nur dann, wenn der Nutzer mit dem Cursor über das Element fährt. Es wird dann meist als kleines, gelbes Fenster neben dem Mauszeiger angezeigt.

 

Tooltips für HTML Tags erstellen

Um ein Element in HTML mit einem Tooltip zu versehen, musst du lediglich das Attribut title="..." einfügen.

 

Beispiel:

<a href="https://webmasterparadies.de" title="Zu Webmasterparadies.de wechseln">Webmasterparadies.de</a>

 

Erklärung:

Das obige Beispiel erzeugt einen Link. Fährt der Anwender nun mit dem Mauszeiger über diesen Link, erscheint als Tooltip „Zu Webmasterparadies.de wechseln“.

Du kannst das Design des Attributs jedoch nicht mit CSS anpassen. Die Darstellung ist abhängig vom System des Nutzers. Auf Windows PCs wird es dabei meist als kleines, gelbes Fenster dargestellt:

Beispiel eines Tooltips für HTML
So sieht ein Tooltip in Chrome unter Windows aus (anklicken zum Vergrößern).

 

Verwendung von title

Das Attribut title="..." kann in den meisten HTML Tags eingebunden werden. Man nutzt es, um dem Nutzer weitere Informationen zu einem Element zur Verfügung zu stellen.

Man erläutert bspw. Abkürzungen mit dem title Attribut (<abbr title="World Wide Web">WWW</abbr>). Du darfst das Attribut dabei nicht für Werbung oder anderen Spam verwenden. Suchmaschinen können die Inhalte des title Attributs auswerten. Somit sind die Suchmaschinen in der Lage, ein Element weiter in den Kontext der Website einzuordnen. Dies ist dabei vor allen Dingen aus SEO-Sicht relevant.

 


Dir gefällt dieser Artikel?

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.