Wer über Windows schreibt, braucht zur Darstellung der Windows-Taste ein Windows-Symbol. Trotz der großen Verbreitung des Betriebssystems “Windows” hat sich dieses Symbol keinen Platz im Unicode-Zeichensatz erobert.
Der Vorteil von Symbolen gegenüber Bildern ist neben der geringen Größe auch der Umstand, dass man die Zeichen beliebig skalieren und einfärben kann, was im Titelbild zu diesem Beitrag zum Ausdruck gebracht wird.
Wie man im ersten Kapitel des Skriptums “Windows 10” über die Geschichte von Windows 10 sehen kann, hat sich das Symbol im Laufe der Jahrzehnte laufend gewandelt.
Font “Marlett” (36 Symbole)
Windows verwendet für die Bedienungs-Symbole der Fensterfläche seit Windows 95 den Font “Marlett”, den man in jeder Windows-Installation findet. Der Font enthält alle Zeichen, die bei der Darstellung eines Fensters verwendet werden und als Zeichen für das W gibt es das frühere Symbol für Windows.
Belegte Zeichenpositionen
0123456789
W
abcdefghijklmnopqrstuvwxy
Dargestellte Zeichen
Um also in einem Text das Windows-Symbol in der Version Windows 95 zu verwenden. gibt man ein ‘W’ ein und formatiert es mit dem Font “Marlett”. Das funktioniert aber nur in Textbearbeitungsprogrammen; in Html-Dokumenten, nur dann, wenn der Leser den Font Marlett auch installiert hat.
Windows-Symbol im Unicode
Ein Windows-Symbol sucht man in im Unicode vergebens. Findige Autoren haben die Symbole 229eH und 3756H als einen tauglichen Behelf auserwählt. Auch im Beitrag über die Windows-Tastaturkürzel wird dieses Symbol verwendet.
⊞ ❖
| Word | HTML | Zeichen |
| 229E Alt+C | 0#x229E; | ⊞ |
| 2756 Alt+C | 0#x2756; | ❖ |
Font “Segoe MDL2 Assets” (331 Symbole)
Die Symbolwelt hat seit Windows 95 an Umfang deutlich zugelegt. Microsoft hat den Unicode-Zeichensatz Segoe MDL2 Assets entwickelt; dass es ein Symbol enthält, das an ein Fenster erinnert, ist eher ein Zufall.
Es ist ein Unicode-Font, die Symbole sind alle im benutzerdefinierten Zeichenbereich e000-ffff zugeordnet.
Scot Dorman hat eine Webversion von diesem Font erstellt, man kann daher die Symbole sowohl am Desktop als auch in Webseiten verwenden.
Man holt sich eine aktuelle Version von der Downloadseite und erhält die Datei mdl2-icons-master.zip. Diese Datei entpackt man und erhält ein Verzeichnis mdl2-icons-master, das man am Server speichert. Diese Datei wird im Header in die Html-Datei eingebunden:
<link href="/buero/mdl2-icons-master/css/mdl2-icons.min.css" rel="stylesheet">
In den vielen Symbolen gibt es auch das Symbol mdl2-view-all. Um es zu verwenden, schreibt man:
<p>Windows-Symbol: <i class="mdl2 mdl2-view-all"></i></p>
und erhält
Alle Symbole
Font Awesome (1437 Symbole)
Eine der mächtigsten Symbolbibliotheken ist Font Awesome. Man kann das Font-Paket lokal installieren oder von der Seite des Herstellers referenzieren.
lokal: Man holt sich eine aktuelle Version von der Downloadseite und erhält die Datei fontawesome-free-5.13.0-web.zip. Diese Datei entpackt man und erhält ein Verzeichnis fontawesome-free-5.13.0-web, das man am Server speichert. Diese Datei wird im Header in die Html-Datei eingebunden:
<link href="/buero/fontawesome-free-5.13.0-web/css/all.css" rel="stylesheet">
extern: Man kann auf die lokale Speicherung auch verzichten:
<link href="https://use.fontawesome.com/releases/v5.13.0/css/all.css" rel="stylesheet">
In den Tausenden Symbolen gibt es auch die Symbole fa-microsoft und fa-windows. Um sie zu verwenden, schreibt man:
<p><i class="fab fa-microsoft"></i> <i class="fab fa-windows"></i></p>
und erhält
Alle Symbole
Alles Symbole von Font Awesome können auch als Dekstop-Font installiert werden.
Links
- True-Type-Font “Marlett” (Wikipedia)
- Marlett Characters
- Windows – Tastaturkürzel
- Scott Dorman
- mdl2-icons
- Font-Awesome-Download (Webversion)
- Font-Awesome-Download (Desktop)
Franz Fiala
Letzte Artikel von Franz Fiala (Alle anzeigen)
- Neue Folgen im Physik-Universum - 18. Dezember 2023
- Große Dateien in WordPress - 17. Dezember 2023
- Wien-Panorama - 16. Dezember 2023
Sehr schöne Lösung!
Aber Vorsicht, wenn man DSGVO konform sein will, sollte man prinzipiell vorsichtig sein, wenn man Objekte von fremden Servern in seine Seite einbindet, weil man auf die Datenschutz Maßnahmen auf fremden Servern meist keinen Einfluss hat. Font Awesome z.B. gibt auf seiner “privacy”-Seite an, persönliche Daten einige Wochen zu speichern.
Ich glaube man sollte auf seiner “Datenschutz” zumindest erwähnen, daß Objekte wie Font Awesome verwendet und diese Datenschutz Richtlinien hat die von den eigenen Datenschutz Richtlinien abweichen können.
Das gilt natürlich auch für Google-Fonts oder externe Libraries und Frameworks…