Приказивање текста - ЦСС-трикови

Anonim

text-renderingИмовина у ЦСС-у вам омогућава да одаберете квалитет текста преко брзине (или обрнуто) те омогућава да фино оптимизације туне сугеришући претраживачу како би требало да донесе текст на екрану. Рекао је још један начин у МДН:

text-renderingЦСС имовина даје информације за рендеринг енгине о томе шта ради оптимизације за време доношења текста. Прегледник прави компромисе између брзине, читљивости и геометријске прецизности.

Неке примере пре / после можете видети овде. Понекад је резултат само боље кернинг:

Неке датотеке фонтова садрже додатне информације о начину приказивања фонта. optimizeLegibilityкористи ове информације, а optimizeSpeedне користи их.

Пример

p.legibility ( text-rendering: optimizeLegibility; ) p.speed ( text-rendering: optimizeSpeed; )

Перформансе

Кад се каже да постоји компромис између брзине и прецизности, они се не шале. Постоје значајни проблеми са перформансама које треба размотрити. Вредно је цитирати тај чланак:

Заправо постоје значајни, ефективно фатални проблеми са перформансама (попут кашњења учитавања од 30 секунди или дуже) на мобилним уређајима када се користи оптимизеЛегибилити за дуге странице. Примените га само ако знате која ће бити максимална дужина текста. (Такође, избегавајте да га користите за Андроид клијенте, бар на старијим верзијама које сви још увек користе: његов приказивач фонтова често има врло чудне грешке када је овај режим омогућен.)

Обавио сам неко тестирање са Инстапапером како бих одредио приближна ограничења перформанси оптимизеЛегабилити. На пример, чланак од 5000 речи у Инстапапер-у за иОС користиће оптимизеЛегибилити само на уређајима са процесором класе А5 или већим. Да бих избегао проблеме на старијим иОС уређајима, не бих препоручио коришћење оптимизеЛегибилити слепо и безусловно на било којим страницама дужим од око 1.000 речи. И уопште не бих препоручио да га омогућите на Андроиду.

Примамљиво је учинити:

/* Probably not advisable */ body ( text-rendering: optimizeLegibility; )

Али будите опрезни око тога, чини се опасним, посебно када се примењује на произвољну страницу.

Подршка прегледача

Хром Сафари Фирефок Опера ИЕ Андроид иОС
4+ 5+ 3+ Можда пост-Блинк? Јок 2.3+? 3+?

Постоје разне грешке. Андроид питање са новим линијама. Цхроме има разне, укључујући размаке између слова. Сафари (и други) подразумева оптимизацију брзине уместо да одређује у лету.