Ein kleines Symbol neben einem Text hilft Besuchern, sich schneller zurechtzufinden — ein Telefonhörer, ein Warenkorb, ein Pfeil. Icons sind ein unterschätztes Werkzeug. Es lohnt sich, zwei Dinge darüber zu wissen: wie man sie gut einsetzt und woher sie eigentlich kommen.
Warum Icons helfen
- Orientierung: Das Auge findet ein Symbol schneller als ein Wort.
- Verständlich ohne Sprache: Ein Warenkorb ist überall ein Warenkorb.
- Aufgeräumt und professionell: Ein paar gute Symbole wirken klar und vertrauenswürdig.
- Gut am Handy: Wo der Platz knapp ist, sagt ein Icon viel auf wenig Raum.
Wie du Icons gut einsetzt
- Sparsam: Nicht jedes Wort braucht ein Symbol. Zu viele Icons wirken unruhig.
- Einheitlich: Bleib bei einem Stil. Zehn verschiedene Icon-Stile sehen zusammengewürfelt aus.
- Mit Bedeutung, nicht als Deko: Ein Icon soll etwas erklären, nicht nur hübsch sein.
- Mit Text kombinieren: Ein Symbol allein ist oft mehrdeutig (eine Lupe — Suche oder Zoom?). Ein kurzes Wort daneben macht es eindeutig.
- Bei vertrauten Zeichen bleiben: Brief für E-Mail, Hörer für Telefon, Pfeil für „weiter“. Keine kryptischen Symbole.
Woher deine Icons kommen — der unsichtbare Teil
Viele Websites holen ihre Icons aus großen Icon-Sammlungen. Dabei gibt es zwei Stolperfallen:
- Kosten und Lizenz: Manche bekannten Icon-Sets (etwa die Pro-Variante von Font Awesome) kosten Geld und haben Lizenzbedingungen, die festlegen, was du damit darfst.
- Externe Server: Oft werden die Icons — genau wie Schriften — bei jedem Seitenaufruf von einem fremden Server geladen, häufig einem US-CDN. Damit geht wieder die IP-Adresse deiner Besucher dorthin (mehr dazu im Beitrag Google-Schriften und Datenschutz).
Die offene Alternative
Es gibt freie, offen lizenzierte Icon-Sammlungen (zum Beispiel Phosphor, MIT-Lizenz). Ihre Vorteile:
- Kostenlos und ohne Lizenzfallen — du darfst sie frei nutzen und sogar anpassen.
- Selbst hostbar — die Icons liegen auf dem eigenen Server, kein Datenabfluss an Dritte.
- Genauso schön und vollständig wie kommerzielle Sets.
Was du tun kannst
- Frag nach, woher die Icons deiner Seite kommen: lokal oder von einem externen Server — und ob eine Lizenzgebühr fällig ist.
- Im Zweifel ein offen lizenziertes, selbst gehostetes Set bevorzugen. Das spart Geld und schützt die Daten deiner Besucher.
In drei Sätzen
- Icons helfen Besuchern, sich schneller zurechtzufinden — sparsam, einheitlich und mit Text kombiniert eingesetzt.
- Achte darauf, woher sie kommen: kommerzielle Sets können Geld kosten, und extern geladene Icons schicken Besucherdaten an fremde Server.
- Offen lizenzierte, selbst gehostete Icons (wie Phosphor) sind kostenlos, frei nutzbar und bleiben bei dir.
Bei Tagfalter sind die Icons von Haus aus offen lizenziert und liegen lokal — kostenfrei, ohne Lizenzfallen und ohne Datenabfluss an Dritte.
Quelle: https://tagfalter.rothirsch.tech/icons-auf-deiner-website-kleine-symbole-grosse-wirkung/