Опубликовано автор в категориях Полезности.

Думая о том, как будет выглядеть типографическое исполнений очередного проекта, я «прошелся» по уважаемым мною авторам, и нашел очень неплохие советы по работе с веб-типографикой.

Во-первых, хочу рассказать об очень, на мой взгляд, нужном и полезном онлайн-сервисе http://typetester.maratz.com/, который позволяет вам протестировать вид вашей шрифтовой подборки для сайта. Причем не только увидеть, но и сравнить с другими семействами шрифтов, начертанием размером, цветом, интерлиньяжем, кернингом, короче всеми атрибутами типографики.

Сервис для работы с элементами веб-типографики

Лично мне сервис очень понравился, и я его сразу записал в свой список полезностей.

Во-вторых, понравился перевод очень лаконичной и полезной статьи в блоге Design For Masters «Элементы веб-типографики». Не буду переписывать весь текст статьи, его вы сможете почитать по ссылке выше. Но думаю обязательно надо вставить в данную публикацию несколько полезных картинок из этой статьи. Думаю, их стоит отнести также к разряду постоянно используемых шпаргалок для веб-мастера, по типу рисунка с размерами баннеров.

Итак:

Картинка 1позволяет нам увидеть, как будут выглядеть шрифты при различных относительных размерах заданных в em. «Em» называется так потому, что 1em равен ширине строчной буквы «m» (equal m), при установках по умолчанию 1em равен 12pt.

Размер не ограничен целыми числами, к примеру, 0.8em отлично подходит для основного текста, и обычно будет равно 10pt.

Да, и не стоит путать pt(пункты) и px(пиксели).

Сравнение велечины шрифтов

Кликните по картинке, чтобы увидеть оригинал

Картинка 2 показывает нам, как будут выглядеть шрифты, при различных размерах и межбуквенном расстоянии

Расстояние между буквами

Кликните по картинке, чтобы увидеть оригинал

P.S.

Для всех, кому будет интересно более подробно изучить вопросы веб-типографики, советую прочесть цикл статей на Хабре Веб-типографика сегодня.

Оставить комментарий

  • (не будет показан)