{"id":357,"date":"2013-08-26T18:42:03","date_gmt":"2013-08-26T16:42:03","guid":{"rendered":"http:\/\/paulchr.ablass.me\/blog\/?p=357"},"modified":"2013-10-29T21:35:43","modified_gmt":"2013-10-29T20:35:43","slug":"aggressives-firefox-schriftcaching-mit-versionsnummern-austricksen","status":"publish","type":"post","link":"https:\/\/paulchr.ablass.me\/blog\/2013\/08\/26\/aggressives-firefox-schriftcaching-mit-versionsnummern-austricksen\/","title":{"rendered":"Aggressives Firefox-Schriftcaching mit Versionsnummern austricksen"},"content":{"rendered":"<p>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 eher unsch\u00f6n ist, bin ich dazu \u00fcbergegangen eingebundene Webfonts mit einer Versionsnummer innerhalb des <code>@font-face<\/code>-Blocks zu versehen. Beim \u00c4ndern der Schrift erh\u00f6he ich die Versionsnummer manuell und zwinge Firefox so, die Schrift neu zu laden. Klappt wunderbar und ist wesentlich entwicklerfreundlicher als das Schlie\u00dfen und Wieder\u00f6ffnen des Browsers.<\/p>\n<pre><code>@font-face {\r\n    font-family: '[Iconfont-Name]';\r\n    src:url('..\/fonts\/[Iconfont-Name]\/[Iconfont-Name.eot]?1.0');\r\n    src:url('..\/fonts\/[Iconfont-Name]\/[Iconfont-Name.eot]?1.0#iefix') format('embedded-opentype'),\r\n        url('..\/fonts\/[Iconfont-Name]\/[Iconfont-Name.woff]?1.0') format('woff'),\r\n        url('..\/fonts\/[Iconfont-Name]\/[Iconfont-Name.ttf]?1.0') format('truetype'),\r\n        url('..\/fonts\/[Iconfont-Name]\/[Iconfont-Name.svg]?1.0#[Fragmentbezeichner]') format('svg');\r\n    font-weight: normal;\r\n    font-style: normal;\r\n}<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>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 eher unsch\u00f6n ist, bin ich [&hellip;]<\/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":[81,77],"tags":[38,115,116],"jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p2Vohc-5L","jetpack-related-posts":[{"id":147,"url":"https:\/\/paulchr.ablass.me\/blog\/2013\/02\/26\/lesetipp-ueber-die-richtige-einbindung-von-webfonts\/","url_meta":{"origin":357,"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":357,"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":561,"url":"https:\/\/paulchr.ablass.me\/blog\/2014\/02\/19\/lesetipp-faux-bold-vermeiden-verschieden-fette-schriftschnitte-richtig-einbinden\/","url_meta":{"origin":357,"position":2},"title":"Lesetipp: faux bold vermeiden &#038; verschieden fette Schriftschnitte richtig einbinden","author":"Paul-Christian Abla\u00df","date":"19. Februar 2014","format":false,"excerpt":"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.","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":492,"url":"https:\/\/paulchr.ablass.me\/blog\/2014\/01\/21\/schoeneres-subpixelrendering-in-chrome-bald-verfuegbar\/","url_meta":{"origin":357,"position":3},"title":"Sch\u00f6neres Subpixelrendering in Chrome bald verf\u00fcgbar","author":"Paul-Christian Abla\u00df","date":"21. Januar 2014","format":false,"excerpt":"In absehbarer Zeit wird einer der nervigsten Bugs im Chrome unter Windows verschwinden (Feuerwerk!): Das Schriftrendering wechselt in B\u00e4lde von GDI zu DirectWrite, womit fehlerhaft dargestellte Schriften wie im obigen Bild der Vergangenheit angeh\u00f6ren sollten. In der Chrome Canary (Version 34) mit den aktivierten Flags --enable-direct-write und --no-sandbox (mehr dazu\u2026","rel":"","context":"In &quot;Browser&quot;","block_context":{"text":"Browser","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/browser\/"},"img":{"alt_text":"Schriftrendering von Firefox (oberhalb der Linie) und Chrome (unterhalb der Linie) unter Windows","src":"https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2014\/01\/schriftvergleich-firefox-chrome.png?resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2014\/01\/schriftvergleich-firefox-chrome.png?resize=350%2C200 1x, https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2014\/01\/schriftvergleich-firefox-chrome.png?resize=525%2C300 1.5x, https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2014\/01\/schriftvergleich-firefox-chrome.png?resize=700%2C400 2x"},"classes":[]},{"id":592,"url":"https:\/\/paulchr.ablass.me\/blog\/2014\/03\/21\/svn-remove-rueckgaengig-machen\/","url_meta":{"origin":357,"position":4},"title":"svn remove r\u00fcckg\u00e4ngig machen","author":"Paul-Christian Abla\u00df","date":"21. M\u00e4rz 2014","format":false,"excerpt":"Dateien, die mittels svn remove gel\u00f6scht wurden, k\u00f6nnen schnell und einfach mit dem folgenden Befehl wiederhergestellt werden: $ svn export [Link\/zur\/Datei\/im\/Projektarchiv]@[Versionsnummer] Die Revisionsnummer bezieht sich dabei auf die letzte Revision, in der die Datei noch existierte. Wenn also mit Revision 43 die Datei index.html gel\u00f6scht wurde, w\u00e4hlt man folglich Revision\u2026","rel":"","context":"In &quot;Versionsverwaltung&quot;","block_context":{"text":"Versionsverwaltung","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/versionsverwaltung\/"},"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":357,"position":5},"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":[]}],"_links":{"self":[{"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts\/357"}],"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=357"}],"version-history":[{"count":2,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts\/357\/revisions"}],"predecessor-version":[{"id":359,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts\/357\/revisions\/359"}],"wp:attachment":[{"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/media?parent=357"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/categories?post=357"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/tags?post=357"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}