a tiny little archive
Gelegentlich werden Webfonts von einer anderen Domain/ einem anderen Server eingebunden (Cross Origin Request). Im Zuge dessen kann es vorkommen, dass der Zugriff auf diese Dateien auf Grund der Einhaltung der Same-Origin-Policy abgelehnt wird und die Schriften nicht geladen werden. Glücklicherweise gibt es mit Cross Origin Ressource Sharing (CORS) aber eine Methode, um diese Cross …
„Domainübergreifene Zugriffe auf Webfonts (CORS)“ weiterlesen
Gerrit van Aaken erklärt in Webfonts: Fette Fehlerquelle, wie das Einbinden von unterschiedlich fetten Schnitten einer Schrift funktioniert. Eine sehr gute, aktuelle, deutsche Zusammenfassung zu einer Technik, die zum Handwerkszeug eines Frontend Developers gehört und die leider oft falsch genutzt wird.
Im Smashing Magazine gibt es zwei sehr gute Artikel zum Thema @font-face. In Avoiding Faux Weights And Styles With Google Web Fonts wird erklärt, wie Schriften über das Google Font Directory richtig eingebunden werden können. Ganz so trivial ist das nämlich nicht, denn die Einbindung á la Google Webfonts funktioniert nicht richtig im IE 7 …
„Lesetipp: Über die richtige Einbindung von Webfonts“ weiterlesen
Um SVG-Schriften mittels der @font-face-Syntax einzubetten, wird bekanntlich folgendes Css benötigt: @font-face { font-family: „Open Sans Regular“; src: url(„../fonts/open-sans-regular/OpenSans-Regular-webfont.svg#OpenSansRegular“) format(„svg“); } Spannend ist der Fragmentbezeichner hinter dem Dateinamen, von mir fett hervorgehoben. Normalerweise sollte dieser nämlich in der Schriftdatei noch einmal auftauchen, nämlich als Attributwert für id innerhalb dieses XML-Snippets: <font id=“OpenSansRegular“ horiz-adv-x=“1171″> Tja. Normalerweise. …
„@font-face, SVG-Schriften und Fragmentbezeichner“ weiterlesen