{"id":561,"date":"2014-02-19T14:59:35","date_gmt":"2014-02-19T13:59:35","guid":{"rendered":"http:\/\/paulchr.ablass.me\/blog\/?p=561"},"modified":"2014-02-19T14:59:35","modified_gmt":"2014-02-19T13:59:35","slug":"lesetipp-faux-bold-vermeiden-verschieden-fette-schriftschnitte-richtig-einbinden","status":"publish","type":"post","link":"https:\/\/paulchr.ablass.me\/blog\/2014\/02\/19\/lesetipp-faux-bold-vermeiden-verschieden-fette-schriftschnitte-richtig-einbinden\/","title":{"rendered":"Lesetipp: faux bold vermeiden &#038; verschieden fette Schriftschnitte richtig einbinden"},"content":{"rendered":"<p>Gerrit van Aaken erkl\u00e4rt in <a href=\"http:\/\/praegnanz.de\/weblog\/webfonts-fette-fehlerquelle\">Webfonts: Fette Fehlerquelle<\/a>, 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\u00f6rt und die leider oft falsch genutzt wird.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Gerrit van Aaken erkl\u00e4rt 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\u00f6rt und die leider oft falsch genutzt wird.<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_newsletter_tier_id":0,"jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false}}},"categories":[77],"tags":[38,42,39],"jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p2Vohc-93","jetpack-related-posts":[{"id":147,"url":"https:\/\/paulchr.ablass.me\/blog\/2013\/02\/26\/lesetipp-ueber-die-richtige-einbindung-von-webfonts\/","url_meta":{"origin":561,"position":0},"title":"Lesetipp: \u00dcber die richtige Einbindung von Webfonts","author":"Paul-Christian Abla\u00df","date":"26. Februar 2013","format":false,"excerpt":"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\u00e4rt, wie Schriften \u00fcber das Google Font Directory richtig eingebunden werden k\u00f6nnen. Ganz so trivial ist das n\u00e4mlich nicht, denn die Einbindung \u00e1 la Google Webfonts funktioniert\u2026","rel":"","context":"In &quot;Allgemein&quot;","block_context":{"text":"Allgemein","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/allgemein\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":139,"url":"https:\/\/paulchr.ablass.me\/blog\/2013\/02\/25\/font-face-svg-schriften-und-fragmentbezeichner\/","url_meta":{"origin":561,"position":1},"title":"@font-face, SVG-Schriften und Fragmentbezeichner","author":"Paul-Christian Abla\u00df","date":"25. Februar 2013","format":false,"excerpt":"Um SVG-Schriften mittels der @font-face-Syntax einzubetten, wird bekanntlich folgendes Css ben\u00f6tigt: @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\u00e4mlich in der Schriftdatei noch einmal auftauchen, n\u00e4mlich als Attributwert f\u00fcr id innerhalb dieses XML-Snippets:\u2026","rel":"","context":"In &quot;Css&quot;","block_context":{"text":"Css","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/css\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":568,"url":"https:\/\/paulchr.ablass.me\/blog\/2014\/03\/11\/domainuebergreifene-zugriffe-auf-webfonts-cors\/","url_meta":{"origin":561,"position":2},"title":"Domain\u00fcbergreifene Zugriffe auf Webfonts (CORS)","author":"Paul-Christian Abla\u00df","date":"11. M\u00e4rz 2014","format":false,"excerpt":"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\u00fccklicherweise gibt es mit Cross Origin Ressource Sharing (CORS) aber\u2026","rel":"","context":"In &quot;Webserver&quot;","block_context":{"text":"Webserver","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/webserver\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":357,"url":"https:\/\/paulchr.ablass.me\/blog\/2013\/08\/26\/aggressives-firefox-schriftcaching-mit-versionsnummern-austricksen\/","url_meta":{"origin":561,"position":3},"title":"Aggressives Firefox-Schriftcaching mit Versionsnummern austricksen","author":"Paul-Christian Abla\u00df","date":"26. August 2013","format":false,"excerpt":"S\u00e4mtliche Firefox-Versionen, die ich unter Ubuntu, Windows 7 und Mac OS X benutze, speichern einmal geladene Webfonts sehr aggressiv. Aggressiv bedeutet in diesem Fall, dass ein normales L\u00f6schen des Caches zum Neu-Laden der Schrift nicht ausreicht, stattdessen muss zus\u00e4tzlich noch der Browser neu gestartet werden. Da dies im Entwicklungsprozess doch\u2026","rel":"","context":"In &quot;Browser&quot;","block_context":{"text":"Browser","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/browser\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":700,"url":"https:\/\/paulchr.ablass.me\/blog\/2014\/07\/17\/schrift-metadaten-mit-ttxfonttools-bearbeiten\/","url_meta":{"origin":561,"position":4},"title":"Schrift-Metadaten mit TTX\/FontTools bearbeiten","author":"Paul-Christian Abla\u00df","date":"17. Juli 2014","format":false,"excerpt":"Nach der Installation von TTX\/FontTools folgt nun ein Beitrag zur Nutzung. Erzeugen der XML-.ttx-Datei TTX\/FontTools ist ein Kommandozeilentool, daher wird es ausschlie\u00dflich mit dem Terminal bedient und hat kein GUI. Das macht aber \u00fcberhaupt nichts, denn die Nutzung ist denkbar simpel: Mit $ ttx \/User\/paul.ablass\/Desktop\/SWBTH___.TTF wird der Befehl gegeben, die\u2026","rel":"","context":"In &quot;Tools&quot;","block_context":{"text":"Tools","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/tools\/"},"img":{"alt_text":"TTX\/FontTools in Aktion","src":"https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2014\/07\/ttx.png?resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2014\/07\/ttx.png?resize=350%2C200 1x, https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2014\/07\/ttx.png?resize=525%2C300 1.5x, https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2014\/07\/ttx.png?resize=700%2C400 2x"},"classes":[]},{"id":679,"url":"https:\/\/paulchr.ablass.me\/blog\/2014\/06\/09\/tool-sass-globbing-plugin\/","url_meta":{"origin":561,"position":5},"title":"Tool: Sass Globbing Plugin","author":"Paul-Christian Abla\u00df","date":"9. Juni 2014","format":false,"excerpt":"Mit Hilfe des Sass Globbing Plugins k\u00f6nnen viele scss-Dateien auf einmal importiert werden. Sehr hilfreich beim Import einzelner Mixin-Dateien, oder wenn es viele separate Stylesheets f\u00fcr einzelne Module gibt. Installation $ gem install sass-globbing Einbindung in config.rb require 'sass-globbing' Benutzung Um beispielsweise viele einzelne Modul-Stylesheets einzubinden: @import \"_mod*\";","rel":"","context":"In &quot;Tools&quot;","block_context":{"text":"Tools","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/tools\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts\/561"}],"collection":[{"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/comments?post=561"}],"version-history":[{"count":2,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts\/561\/revisions"}],"predecessor-version":[{"id":564,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts\/561\/revisions\/564"}],"wp:attachment":[{"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/media?parent=561"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/categories?post=561"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/tags?post=561"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}