SEO блог Антона Тишкова

По мере того, как ходовые браузеры развиваются растёт популярность идеи подключения нестандартных шрифтов в дизайн сайта. Стандартные Arial, Tahoma и Times New Roman уже надоели и мешают дизайнерам, загоняя их в искуственные рамки. Сейчас скорость интернета позволяет подключить шифты и добавить к "весу" сайта лишние 100-300 килобайт. В этом посте я приведу пару примеров яркого использования шрифта и советы по подключению нестандартных шрифтов.


http://www.kitchensinkstudios.com/


http://www.paramount-visions.com/


http://scandalousdirt.com/



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

Однако при интеграции сторонних шрифтов неизбежно появляются две серрьёзны прошблемы!

1. Вес/объём/размер веб-страницы сильно увеличивается, особенно, если подключать свои форматы шрифтов для каждого браузера (.eot, .woff, .ttf и .svg). Есть два решения этой проблемы:
а) Сервис Google Webfonts даёт возможность подключить шрифты с их сервера. Особенность этого решения в том, что сервис Google сам определяет браузер посетителя и отдаёт файл шрифта конкретно под этот браузер, таким образом пользователь скачивает только один из четырёх файлов с шрифтами.
б) Есть ещё один интересный сервис Font Squirrel, который позволяет сгенерировать все четыре формата файлов с шрифтами и, что самое главное, выкинуть из файлов шрифтов ненужные символы, что существенно уменьшит размер веб-страницы с подключёнными нестандартными шрифтами. Я бы советовал использовать этот вариант, польскольку при использовании Google Webfonts может возниктнуть проблема с НЕотображением шрифтов в браузере Opera, который весьма популярен среди русскоязычных пользователей интернета.

2. Как правильно подключить? Есть множество вариантов, как с помощю CSS и @font-face подключить вои шрифты, но пока нет стандарты для всех браузеров. Варианта так же два и связаны они с уже упомянутыми сервисами:
а) Сервис Google Webfonts даёт возможность подключить шрифты вставкой одной строчки кода в шапку сайта.
б) Сервис Font Squirrel при генерации файлов с шрифтами выдаёт код для вставки в файл со стилями, в котором уже учтены все особенности браузеров.

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