-
natio (sergey@opanasenko.com.ua / sadesign)
Набираем в разрядку
февраля 12, 2010
2.1.6 Набирайте в разрядку любую последовательность прописных и капительных букв, а так же длинные ряды цифр
«В некоторых текстах очень часто встречаются акронимы, например CIA (ЦРУ) и PLO (ООП), или такие аббревиатуры, как AD (н.э.) или BC (до н.э.). Нормальное значение разрядки в таких комбинациях капительных или прописных букв составляет 5-10% от кегля шрифта.
В цифровых шрифтах очень просто придать дополнительную ширину всем капительным знакам, таким образом разрядка добавляется автоматически. Ширины прописных выведены из расчета того, что они будут использоваться совместно со строчными, но тем не менее величины межбуквенных пробелов для текста, набранного только прописными буквами, могут быть автоматизированы с помощью таблиц кернинга.»
В CSS за разрядку отвечает свойство letter-spacing. Чтобы добавить 10% разрядки к тегу <abbr> пишем следующее:
ABBR {letter-spacing:0.1em}
Если создается статическая страница то можно расставить вручную <acronym> и <abbr> — утомительно, но выполнимо. Но если при создании сайта используется CMS то разработчик может использовать регулярные выражения для решения подобных вопросов.
Вот пример:
$search = '/\b([A-Z][A-Z0-9]{2,})\b/';
$replace = '<abbr>$1</abbr>';
$text = preg_replace($search,$replace,$text);
Эта функция ищет последовательности из более чем 3-х прописных символов, например CSS, HTML, W3C и обертывает их в тег <abbr>.
10 комментариев to “Набираем в разрядку”
Оставить мысль
12 февраля 2010 в 5:39 пп
Интересная мысль, нужно у себя прописать в стилях.
Только я вот протестировал и хорошо смотрится при 6%, а при 10% сильно «разлазятся» символы.
12 февраля 2010 в 5:58 пп
10% может оказаться очень полезным для больших кеглей :)
14 февраля 2010 в 12:03 пп
Семантичней использовать acronym вместо abbr, потому что ie6, ie7 не понимают abbr.
14 февраля 2010 в 12:15 пп
Вот нормальные сглаживания, только кернинг надо поправить img40.imageshack.us/img40...rendermarket.png
14 февраля 2010 в 4:41 пп
Серега обнови кешь, логотип переделал и проредил :)
14 февраля 2010 в 5:36 пп
Не Серега, используй мак-сглаживания. Вот сравни букву А: iurevych.com.ua/upload/re...ket-logo_n-a.png — справа я вставил маковскую, слева твоя из логотипа
14 февраля 2010 в 7:01 пп
Дык на маке и делал :) видать твой мак мачнее чем мой :)
Да и заметь у тебя начертание другое ;)
15 февраля 2010 в 9:16 дп
Да, я использовал Ариал. Но все равно сглаживания разнятся. Ты не используй фотошоп, просто набери буквы в браузере и захвати экран ;)
15 февраля 2010 в 9:17 дп
Еще важно после захвата с экрана перевести скриншот в Grayscale, потому что системные сглаживания по контуру буквы образуются цветными пикселями.
13 апреля 2010 в 2:47 пп
«вуз» тоже аббр.