Авторизация Регистрация

Здесь пока все ясно :)

Хелп лист будет формироваться из ваших вопросов.

 

Кернинг

2.1.8 Применяйте кернинг последовательно и умеренно или отключите его совсем

«Кернинг — изменение пространтсва между определенными парами букв, служит для упорядочивания межбуквенных пробелов. Например в таких словах как Washington или Toronto, в сочетаниях букв Wa и To применяется кернинг.»

230px-Kerning.svg[1]

В настоящее время нет рабочего механизма в CSS или HTML для конкретной работы с кернингом. Однако веб не требует таблично точных значений кернинга, а таблицы кернинга встроены в сам шрифт. В этих таблицах определено, какие пары необходимо корректировать и в какой степени, в зависимости от операционной системы.

Ручной кернинг может оказаться полезным при наборе заголовков, использовании курсива в тексте и в особых местах с знаками препинания.

Значение кернинга во многом зависит от семейства шрифта, для одного он требуется в другом он будет лишним. Иногда целесообразным оказывается не применять кернинг — отсутствие кернинга лучше его неграмотного использования.

Для ручной правки в «особых» местах нужно пользоваться inline элементом, таким как span и применять свойство letter-spacing, например:


Washington
and Toronto
.kern {letter-spacing: -0.1em }

Получаем:

Washington and Toronto

Используя регулярные выражения можем автоматизировать расстановку кернинга:


$search = '/(T)(o)|(W)(a)/';
$replace = '$1$3$2$4';
$text = preg_replace($search,$replace,$text);

На будущее

В текстовом модуле CSS3 добавлены свойства kerning-mode и kerning-pair-threshold, но эти свойства еще не полностью поддерживаются браузерами и не до конца описаны.

Вам также может быть интересным ↓

3 комментария на «“Кернинг”»

  1. Круто смотрится текст с кернингом.

    К кириллице это тоже применимо ?

  2. Да только в кириллице другие пары, к примеру: «Го»

    Немного стоит прокернить :-)

  3. Zel:

    неплохо было бы выложить именно буквенные пары для кирилицы :)

Добавить комментарий

Больше текстур

View Results

Loading ... Loading ...