Nový Chrome 37, DirectWrite a Arial Narrow (SOLVED! Ale jinak, než byste čekali.)

Změna situace: Nový Chrome 38 přichází s podporou css3 parametru font-stretch známého z FF a tak řeší dále popisovaný problém. Tímto také padají dále uvedené návrhy oprav, kromě použití Google Fontu Open Sans Condensed.

Nový Chrome 37.xxx přichází (konečně?) s implementací DirectWrite, což má konečně vypisovat na Windows fonty hezky. Prý. Nicméně to přineslo malý problém – Chrome přestal „znát“ „Arial Narrow“ (a zřejmě i další). Patrně lze narazit na problém s nastavení DPI pro obrazovku a další překvapení.

Řešením bude nejspíš použití jiného fontu. Nicméně DirectWrite se dá vypnout nastavením flagu - chrome://flags/#disable-direct-write
(aktivace této položky znamená deaktivaci DirectWrite, trochu po haluzi)

Viz též:

• css - Chrome beta and canary builds not displaying Arial Black fonts - Stack Overflow
• Different font for facebook after Chrome update : techsupport
• Issues - chromium - An open-source project to help move the web forward. - Google Project Hosting
• Huge font in Chrome 37–Fórum služeb Google

P.S. (SOLUTION?):

Podle aktuálních zpráv se chová k fontu Arial Narrow takto hnusně Chrome i ve verzi 39. Je třeba tedy provést "opravu" webu. Font Open Sans Condensed by byl vhodný, ale je přeci jen odlišný a znamená to hotový web celý "přestylovat". Tudy (zatím) ne.

Pak je tu možnost použít Arial Narrow z AllFont.net. Tady mám poněkud pochyby o legálnosti. Nicméně vydáte-li se touto cestou, záhy narazíte na zablokování písma stahovaného přímo z AllFont.net přímo Chromem. Je třeba si styly a soubory písma (předpokládám, že budete potřebovat jak Arial Narrow, tak Arial Narrow Bold a i další řezy) stáhnout a nahrát na svůj web. Při zachování jména fontu "Arial Narrow" ale zřejmě dochází k nějaké kolizi - v MSIE je veškerý text najednou kurzívou a ve FF je to nějaké nepěkné. Pomohlo mi přejmenování písma na "Arial Narrow Spare". Při vhodném pořadí písem v definici "fint-family" pak písmo v MSIE vypadá pořád stejně, ve FF víceméně stejně a v Chrome je konečně Arial Narrow zase "narrow".

Výsledný kód tedy natahuje do webu samostatné css s písmem:

<link href="/css/font/arial-narrow.css" rel="stylesheet" type="text/css" />


Definici fontu je upravena takto (pokud požíváte "bold" je samostatný font potřeba, jinak je to rozplizlé):

@font-face {
  font-family: 'Arial Narrow Spare';
  font-style: normal;
  font-weight: 400;
  src: local('Arial Narrow Spare'), local('ArialNarrowSpare-Regular'), url(d0eb64ed2b91fe9a67f7800c1b14868b.woff) format('woff');
}


@font-face {

  font-family: 'Arial Narrow Spare';

  font-style: normal;

  font-weight: 700;

  src: local('Arial Narrow Spare Bold'), local('ArialNarrowSpare-Bold'), url(de76819016c676e170294c3f132497dc.woff) format('woff');

}

A definice font-family vypadá takto (font-stretch je pro FF pořád potřeba):

body,table,input,select,textarea,tt,input,button {font-size:14px; font-family: "Arial Narrow","Helvetica Narrow","Helvetica Condensed","Arial Narrow Spare","Arial CE",Arial,"Helvetica CE",sans-serif; font-stretch: condensed;}


(Arial Narrow, Arial Black, Wrong Font, Bad Fonts)