Эта заметка послужила поводом для небольшой реконструкции всей Кухни Сидорова.
Теперь во всех ее уголках железобетонные кавычки в виде "дюймов" заменены на изящный пластик в виде лапок.
-- Как хорошо на Кухне,
На кухне стало просто замечательно! восклицает теперь Петр.
Действительно, настоящее тире смотрится гораздо
лучше своей модели из двух дефисов:
Можно сказать, что терпение дизайнеров лопнуло! Хотя нормальный вывод тире, лапок и других специальных (но таких необходимых) типографских знаков и сейчас возможен не на всех платформах, унижение дизайнеров достигло черты, у которой Артемий Лебедев в конце 2000 года выпустил специальный 62 параграф своего ру/ководства (www.design.ru/kovodstvo) под названием Экранная типографика.
Данный параграф ру/ководства берет на себя смелость служить основным настольным (надесктопным) справочником по экранной типографике. К сожалению, уровень отечественных теоретических и практических исследований в области восприятия информации с экрана не превышает нулевой отметки. Поэтому приходится не только проводить подобные исследования, но и составлять стандарты.
Нижеприведенные правила учитывают специфику экранного чтения, русских типографских традиций, а также совместимости с разными платформами и кодировками. В данном параграфе рассматриваются особенности верстки только в применении к HTML (типографика и специфика набора для экрана, скажем, банкомата тоже интересная тема, но слишком мало кому нужная).
С недавних пор в Студии Лебедева все тексты в HTML должны обязательно верстаться в обогащенном варианте. Ни один текст не должен появиться на публике в сыром виде.
Артемий Лебедев
Вся Кухня Сидорова, включая кота Скриптовича, тоже проголосовала за!
Ниже приводится краткий справочник специальных символов.
название | знак | мнемоника | код |
амперсант | & | & NN1,2,3,4,6 | IE3,4,5 |
& NN1,2,3,4,6 | IE3,4,5 |
знак меньше | < | < NN1,2,3,4,6 | IE3,4,5 |
< NN1,2,3,4,6 | IE3,4,5 |
знак больше | > | > NN1,2,3,4,6 | IE3,4,5 |
> NN1,2,3,4,6 | IE3,4,5 |
неразрывный пробел | NN1,2,3,4,6 | IE3,4,5 |
  NN1,2,3,4,6 | IE3,4,5 |
|
параграф | § | § NN3,4,6 | IE3,4,5 |
§ NN1,2,3,4,6 | IE3,4,5 |
copyright | © | © NN1,2,3,4,6 | IE3,4,5 |
© NN1,2,3,4,6 | IE3,4,5 |
registered | ® | ® NN1,2,3,4,6 | IE3,4,5 |
® NN1,2,3,4,6 | IE3,4,5 |
знак градуса | ° | ° NN3,4,6 | IE3,4,5 |
° NN1,2,3,4,6 | IE3,4,5 |
левая елочка | « | « NN3,4,6 | IE3,4,5 |
« NN1,2,3,4,6 | IE3,4,5 |
правая елочка | » | » NN3,4,6 | IE3,4,5 |
» NN1,2,3,4,6 | IE3,4,5 |
нижняя лапка | | „ NN2,3,4,6 | IE3,4,5 |
|
многоточие | … NN2,3,4,6 | IE3,4,5 |
||
один. откр. кавычка | | ‘ NN1,2,3,4,6 | IE3,4,5 |
|
один. закр. кавычка | | ’ NN1,2,3,4,6 | IE3,4,5 |
|
левая лапка | | “ NN2,3,4,6 | IE3,4,5 |
|
правая лапка | | ” NN2,3,4,6 | IE3,4,5 |
|
жирная точка | | • NN2,3,4,6 | IE3,4,5 |
|
средняя точка | · | · NN3,4,6 | IE3,4,5 |
· NN1,2,3,4,6 | IE3,4,5 |
среднее тире | | – NN2,3,4,6 | IE3,4,5 |
|
длинное тире | | — NN2,3,4,6 | IE3,4,5 |
|
trademark | | ™ IE3,4,5 |
™ NN2,3,4,6 | IE3,4,5 |
плюс-минус | ± | ± NN3,4,6 | IE3,4,5 |
± NN1,2,3,4,6 | IE3,4,5 |
номер | № | № NN4,6 | IE3,4,5 |
Следует отметить, что если для специального знака в кодовой таблице есть мнемоническое обозначение, которое поддерживается браузерами, то оно предпочтительнее цифрового кода. Ведь цифровой код определяет конкретное место символа в таблице и может быть разным в разных кодировках.
Знаки < и > служат для обрамления тегов, поэтому для показа на экране их приходится кодировать.
Текст предыдущего абзаца записан в
Знаки “<” и “>” служат для обрамления тегов, поэтому для показа на экране их приходится кодировать.
Но чтобы показать эти коды пришлось закодировать амперсант:
Знаки &#147;&lt;&#148; и &#147;&gt;&#148; служат для обрамления тегов, поэтому для показа на экране их приходится кодировать.
Пробел &nbsp; потому и называется неразрывным, что браузеру запрещается использовать его место для разрыва строки при автоматическом форматировании текста.
Вот характерные случаи использования этого символа (рекомендации Дмитрия Кирсанова):
вид | код |
№ 13 | № 13 |
§ 1 | § 1 |
вид | код |
a) Первый пункт | a) Первый пункт |
1. Первый пункт | 1. Первый пункт |
вид | код |
220 в | 220&nbsp;в |
1024 байт | 1024&nbsp;байт |
вид | код |
XXI век | XXI век |
2001 г. | 2001 г. |
вид | код |
Пиксел это точка на экране. | Пиксел — это точка на экране. |
Ok! | — Ok! |
вид | код |
32 541 | 32 541 |
4 937 543 246 | 4 937 543 246 |
вид | код |
Windows 2000 | Windows 2000 |
Photoshop 5.5 | Photoshop 5.5 |
вид | код |
Иван пошел в лес | Иван пошел в&nbsp;лес |
Там за горизонтом | Там за горизонтом |
Некоторые браузеры могут разрывают строку не только на месте пробела, но и на позиции других знаков, например, дефиса. Для предотвращения нежелательного переноса используют тег NOBR.
вид | код |
<NOBR>9-87-74</NOBR> | |
<NOBR>во-первых</NOBR> |
Дмитрий Кирсанов в свой книге Веб-дизайн пишет:
Всего существует четыре типа кавычек: «французские» (иначе называемые «елочки»), немецкие (лапки), английские обычные, или двойные, и английские одинарные. В русском языке традиционно применяются французские «елочки», а для «кавычек внутри кавычек» немецкие лапки.
Дмитрий Кирсанов
Артемий Лебедев считает, что одноуровневые (верхние) лапки стали de facto стандартов за последние 10 лет (из частной переписки).
На Кухне внимательно посмотрели на немецкие и английские лапки и решили, что английские более красивые.
Во всяком случае, знаком "дюйма" для кавычек мы больше пользоваться не будем.
Тире в
Тире в середине предложения окружается: слева неразрывным, а справа обычным пробелом.
Код предыдущего абзаца записывается так:
Тире в середине предложения окружается: слева — неразрывным, а справа — обычным пробелом.
Эта кодировка (American Standart Code for Information Interchange) восьмибитная (однобайтовая), но охватывает только 128 символов. Она включает латинский алфавит, цифры и основные знаки пунктуации. Все остальные стандартные кодировки совместимы с ней, то есть, размещают на первых 128 местах те же символы и в том же порядке. Вот почему люди часто говорят ASCII, хотя реально используют совсем другие кодировки.
Первый стандарт кодирования русских букв (Код Обмена Информации 8 битный).
Кодировка применялась еще в
Кодировка Windows (Code Page 1251). Содержит русские буквы.
Или альтернативная кодировка. Или
ISO (International Standart Organization) международная
организация по стандартизации для упорядочивания
ISO-8859-1 латиница с дополнительными символами
ISO-8859-5 кириллица
ISO-8859-6 арабский алфавит
ISO-8859-7 греческий алфавит
ISO-8859-8 иврит
Кодировка
В эту кодировку входят символы немецкого, французского, испанского и других алфавитов. Но русских букв в ней, конечно, нет!
Стало понятно, что для кодов всех на свете символов одного байта никак
не хватит! Так была придумана двухбайтовая кодировка Unicode. Эту
кодировку обязаны понимать браузеры, начиная с
В этой кодовой таблице (65 636 знакомест) есть все: китайский, корейский, японский и даже русский! Все живые, мертвые языки и 30% пока еще свободного места.
Unicode совместим с ASCII. Это означает, что первые 128 мест заняты под те же самые символы.