Web-Font-Tests mit lateinischen, kyrillischen und asiatischen Zeichen

Erstellt am: 24.Mai 2016 | Letztes Update: 29.Nov 2016 | von: | Kategorie(n): Design, Merkzettel, Test, UI/UX

Web-Font-Tests mit lateinischen, kyrillischen und asiatischen Zeichen

Diese Test zeigt lateinische, arabische, kyrillische und asiatische Zeichen in verschiedenen Schriftstärken, um die Auswirkungen der CSS-Eigenschaft font-weight auf Webfonts und Browser-Fall-back-Fonts aufzuzeigen. In diesem Beispiel ist es der Web-Font Roboto von Google. Nachfolgende Liste listet die möglichen Schriftschnitte auf.

Übersicht der Schriftschnitte des Webfonts Roboto von Google

Roboto

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Grumpy wizards make toxic brew for the evil Queen and Jack.

Web-Font-Tests mit lateinischen, arabischen, kyrillischen
und asiatischen Zeichen

In dieser Tabelle sind auch Schriftstärken bemustert, die nicht vom Webfont angeboten werden.

Schriftstärke lateinisch (Europa) Han-Schrift (China) Arabisch Hangul (Korea) Hiragana (Japan) Kyrillisch (Russland)
thin (100) ABC 阿贝瑟 بوج ㅂㅏㅊ べあせ АБӴ
thin (200), fehlt ABC 阿贝瑟 بوج ㅂㅏㅊ べあせ АБӴ
light (300) ABC 阿贝瑟 بوج ㅂㅏㅊ べあせ АБӴ
normal (400) ABC 阿贝瑟 بوج ㅂㅏㅊ べあせ АБӴ
medium (500) ABC 阿贝瑟 بوج ㅂㅏㅊ べあせ АБӴ
bold (600), fehlt ABC 阿贝瑟 بوج ㅂㅏㅊ べあせ АБӴ
bold (700) ABC 阿贝瑟 بوج ㅂㅏㅊ べあせ АБӴ
bold (800), fehlt ABC 阿贝瑟 بوج ㅂㅏㅊ べあせ АБӴ
ultra-bold (900) ABC 阿贝瑟 بوج ㅂㅏㅊ べあせ АБӴ

Fazit

Der Browser zeigt die erwartete Reaktion. Die lateinischen, kyrillischen und griechischen Zeichen werden wie vorgesehen, durch den Webfont Roboto abgebildet. Die fehlenden 600er- und 800er-Schnitte werden durch die 700er und 900er ersetzt. Der fehlende 200er wird durch den 100er ersetzt.

Asiatische und arabische Zeichen werden durch die Fallback-Lösung der Grundeinstellungen des Browsers abgebildet. Es wird nur zwischen bold (≥ 600) und normal (≤ 500) unterschieden. Im Google Chrome 50, Firefox 46 und Internet Explorer 11 wird ab einer Stärke von 600 die Schrift als Fettschnitt ausgegeben.

Nach oben

Schreibe einen Kommentar

Diese Beiträge könnten Sie ebenfalls interessieren

Beiträge aus der gleichen Kategorie

Über den Autor

Hier schreibt Ingo Förster, UX-Professional und -Stratege über User Experience-Design. User-Interface-Design, Web-Design & Programmierung, manchmal auch über Online-Marketing und alles was zum täglichen Brot eines UXlers gehört.

Ingo hat durch seine selbständige Tätigkeit viel Erfahrung in zwei Hauptbereichen sammeln können. Zum einen in im weiteren Sinne Interaction Design mit allen Disziplinen, angefangen mit Grafischer Gestaltung für Web, Programmierung von Internet-Auftritten mit Typo3, Wordpress oder Magento eCommerce und Usability-Konzepten für Touch-Bedienung. Randbereiche wie SEO und Online-Marketing wurden regelmäßig bearbeitet.

Ingo interessiert sich für Webtechnologien, Touch-UIDs und erleichterte Bedienverhältnisse in Software. Ingo ist im Bereich Multimedia lehrend tätig gewesen.