Hervorgehobener Link
Über das Pattern
Hervorgehobene Links heben sich von einfachen Links durch die Textformatierung, einen angestellten Pfeil und die Animation dessen hervor.
Geeignete Anwendung
Hervorgehobene Links eignen sich als Call-To-Action und für die Verlinkung zu Seiten, die weiterführende Information beinhalten.
Ungeeignete Anwendung
Hervorgehobene Links sollten nur als Call-To-Action am Ende von anderen Pattern wie Stages, Cards oder Sections verwendet werden und nicht innerhalb von Fließtext. Ausnahmen sind Infoboxen und Quicklinks.
Anwendungsrichtlinien
- Generische Linktexte wie „Mehr erfahren“, „Weiterlesen“ oder „Hier klicken“ sollten vermieden werden.
- Text sollte kurz gehalten und nicht zweizeilig dargestellt werden
Parameter und Anwendung in Nunjucks
# Parameter
url: "string" # URL oder Anker
block: "Boolean" # (default: false) nimmt volle Breite ein
attributes: "object" # HTML-Attribute (z. B.: class, etc.), frei wählbar
flip: "Boolean" # (default: false) Icon links und nicht rechts vom Text anzeigen
# Anwendung
{% from "components/hervorgehobener-link/hervorgehobener-link.njk" import emLink with context %}
{% call emLink(url='/seite.html') %}
Text frei wählbar
{% endcall %}