Eine Möglichkeit kleine Symbole, Icons oder Emojis in HTML-Seiten zu nutzen sind Icon-Fonts, in denen jeder Buchstabe aus einem Symbol besteht. Der Vorteil ist, dass diese Symbole mit der Schriftgröße skaliert werden. Beliebteste Icon-Font dürfte Font Awesome sein, die eine große Zahl an Icons bietet. Nachteil ist die komplexe Verwendung, wenn man zugänglich arbeiten möchte: man braucht unter Umständen den Codepoint statt des Names eines Zeichens und vor allem sollte man das vorgeschlagene Anti-Pattern eines leeren Elements nicht verwenden:
<i class="fa fa-$name"></i>An dieser Stelle ist mindestens ein sprechendes title-Attribut notwendig.
Unter Verwendung entsprechenden HTML-Codes können Icon-Fonts natürlich auch konform eingesetzt werden. Allerdings kann die Font-Datei im Vergleich zur Anzahl der auf einer Seite verwendeten Symbole sehr groß sein, so dass die Verwendung einzelner Symbole sinnvoll sein kann.
Und dann ist die Frage, ob es nicht schon fertige Symbole in einem der Unicode-Blöcke gibt, die standardmäßig auf vielen Systemen verfügbar sind und damit die Verwendung externer Ressourcen obsolet machen.
Unter anderem auf der Startseite werden einige Symbole verwendet, die in der Tat Unicode-Zeichen sind:
Basierend auf Wikipedia eine Liste nützlicher Unicode-Blöcke für Icons: