Амперсанд является вещью присущей в основном латинской типографике, но тем не менее штука это красивая. В этом коротком очерке я расскажу о том, как можно использовать амперсанд на веб-страницах как в текстовой, так и в нарисованной (pre-rendered) форме.
Если дизайнер заботится о видимости написанного текста поисковыми системами, он наверняка будет использовать элемент
amp и пытаться подбирать более-менее безопасную гарнитуру.Здесь и далее примеры идут с весьма крупным кеглем. Использование тех же амперсандов на 12pt выглядит намного менее впечатляюще.
Для красоты используется обычно курсивный амперсанд. Так уж получилось, что в большинстве гарнитур именно курсивный амперсанд является более красочным.
Часто антиквенный амперсанд используют с рублеными гарнитурами (обратное явление автором не наблюдалось).
Хорошие амперсанды бывают даже там, где их совсем не ждешь.
Для веб-типографики шрифтов с красивым амперсандом действительно мало. Автор для красивого амперсанда на веб-странице использует нечто подобное:
.amp
{
font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif;
font-style:italic;
font-weight:normal;
line-height:inherit;
}
Это, кстати, весьма известный стиль, и много сайтов именно его используют. Вот примерная иллюстрация того, во что этот стиль может обернуться:
Веб-дизайнеры – люди неглупые, и давно просекли что вешать этот класс на каждый амперсанд вручную – это нонсенс. Для такой рутинной задачи существует автоматизированное решение.
Шрифтов не так много чтобы использовать «лучший амперсанд на свете» поэтому приходится довольствоваться тем, что есть. Единственная альтернатива – это конечно генерировать картинку. Например, вы сейчас читаете пост где все амперсанды – картинки, да и заголовки – тоже.
Если вы например генерируете заголовки на стороне сервера как PNG, или используете другую технологию замещения (sIFR, SVG, экзотика), то вы можете использовать абсолютно любой амперсанд который у вас имеется. Тут можно создать нечто презентабельное даже без особого воображения:
Естественно, что в данном случае нужно экспериментировать, и смотреть что к чему подходит. Например если вы пишете что-то медицинское, можно взять амперсанду которая формирует «сердечко», а если что-то эзотеричное то можно брать амперсанду которая похожа на «нечто», и пусть все гадают.
Почитать про то что такое амперсанд и почему он нафиг не нужен в нашей родной типографике можно у Лебедева. Также эту тему освещает сайт Adobe. В типографических курилках тема встречается часто—можно найти много интересных ссылок, например тут. А вообще рекоммендую гуглить. Например вот тут есть хороший список красивых амперсандов, в т.ч. и в бесплатных шрифтах. Автор сам утянул себе парочку – так, про запас.
Вот пока и все. Кажется мой редактор справился с автогенерацией картинок. Ура, товарищи!
