Нестандартные шрифты на сайте
04.08.2015 1258 Пишу Ваш комментарий css, компьютерный практикум, шрифтыПредставим себе ситуацию: вы хотите на собственном сайте использовать красивые, но нестандартные шрифты. Как быть? Вариантов, к счастью, больше одного.
Самый старый — картинки
Оперировать можно было только теми гарнитурами шрифтов, которые были на компьютерах посетителей сайтов. В противном случае любые «красивости», которых не нашлось в операционных системах зрителей сайта, браузер принудительно заменял на стандартные шрифты. Для шрифтов с засечками это чаще всего становилось семейство Times, для шрифтов без засечек — Arial. Если же на вашем компьютере в те времена стояла не Windows, то с выбором шрифтов «по-умолчанию» могли быть варианты, но их тоже было не очень много. Оттого, верстальщики были вынуждены использовать на своих сайтах стандартные шрифты. Количество же надписей, набранных красивыми шрифтами, стремилось к нулю. Исключения делались лишь для «шапки сайта» или логотипа. В этом случае надпись красивым — читай нестандартным — шрифтом сохранялась в виде картинки. Весила подобная «надпись» порой десятки килобайт, а дело было в пору диалапа, и являлась собственно картинкой, а не надписью. Посему подобных фрагментов на сайтах было немного.
Загрузка
Следующим шагом был вариант с подгрузкой шрифтов. Выбиралась нестандартная гарнитура, затем её нужно было любыми средствами превратить в шрифт Open Type. Способов тоже было несколько, но различия были по месту обработки — локально на компьютере (ставились специальные программы-конверторы), или в сети — шрифт закачивался на особый сайт и там уже конвертировался. Разница состояла ещё и в качестве получаемого шрифта — при маленьких размерах буквы часто могли выглядеть коряво. Тем не менее, это уже были именно надписи, а не картинки. Для использования подобные шрифты требовалось загрузить на собственный сайт и особым образом прописать стили. Плюс очевиден, вы уже могли сделать больше красивых надписей на сайте и красиво оформлять статьи. Минус тоже очевиден, при подобном способе использования нестандартных гарнитур, они принудительно загружались вместе с самим сайтом на компьютер зрителя. Не устанавливались в систему, но сайт уже можно было смотреть красиво. Метод получил широкое применение, когда в больших городах диалапа становилось всё меньше.
Прописка
К счастью для разработчиков, есть и ещё один метод. Находим сайт с бесплатными шрифтами, что-нибудь вроде allfont.ru, на нём находим интересный шрифт, например, такой
и под самим шрифтом видим код для вставки на сайт. Прописываем в заголовочной части сайта <head>… </head> ссылку на шрифт, например, так:
<head> ... <link href="http://allfont.ru/allfont.css?fonts=pollock1ctt" rel="stylesheet" type="text/css" /> </head>
А в файле css прописываем стили, примерно так:
h1 { font-family: "Pollock1CTT", arial; ... }
И это всё! Шрифт уже будет отображаться в заголовках первого уровня, ну или где вы там его пропишите. Впрочем, если по каким-либо причинам шрифт всё-таки не подгрузится (вдруг сайт — донор завис), надпись откроется обычным эриалом. Плюсы те же, что и в прошлом примере, но вам не нужно заморачиваться с конвертированием шрифтов. Нравится — используете его и всё. Справедливости ради я должен предупредить, что не знаю наверняка как именно это реализовано. Не знаю, подгружается ли в данном случае шрифт на компьютер посетителя сайта или нет. Но в пору, когда диалапа становится всё меньше, а вам как создателям сайта для использования красивых шрифтов почти ничего не надо делать, считаю этот метод наиболее привлекательным.
Короткий вывод
На сайте вашего покорного слуги до недавнего времени использовались одновременно все три варианта — шапка сайта была оформлена картинкой, основной шрифт статей загружен на сайт, а вставки кода в статьях (и в этой тоже) осуществлялись моноширинным шрифтом по третьему методу. На просторах интернета на сегодняшний день активно используются все три варианта, не исключено, что есть и другие. Во время, когда почти любые сайты создаются на основе тех или иных CMS, это тем более просто. Единственное, о чём хочется напомнить, что сама по себе возможность пользоваться чем-либо, не является обязательной. Старайтесь не злоупотреблять на своих сайтах количеством шрифтов. ))