Не так давно я помню несколько вариантов, когда речь шла о веб-типографии. Варианты включали семейство шрифтов с засечками, семейство шрифтов без засечек, семейство шрифтов с одним интервалом и семейство курсивных шрифтов. Всего было чуть более 30 веб-безопасных вариантов шрифтов. Я отметил веб-безопасность, так как шрифты, используемые на веб-странице, должны были быть установлены на компьютер посетителя для рендеринга, который отличался от ПК к MAC, и для каждой собственной библиотеки шрифтов.
С улучшением свойств CSS этот ограниченный список представляемости веб-безопасных шрифтов улучшился за счет опций стилей, которые включали стиль шрифта (обычный, курсив, наклонный), вариант шрифта (обычный, маленькие буквы), шрифт вес (обычный, жирный, жирный, светлый, 100-900), размер шрифта, цвет, преобразование текста (с большой буквы, прописные буквы, строчные буквы, преобразование), высота строки и межбуквенный интервал. При эффективном использовании эти варианты стилей CSS могут помочь преобразовать текст из утилитарного в привлекательный.
При этом многие дизайнеры были разочарованы внутренними ограничениями стиля для веб-использования, ожидая того дня, когда параметры веб-шрифтов сравняются с разнообразием, доступным в дизайне печати. Изначально многие создавали графический текст для кнопок навигации, заголовков, рекламных баннеров и т. Д. (До сих пор используется для большинства логотипов), что, как мы знаем, сейчас не очень хорошо с точки зрения SEO. Создание текста во Flash также было популярным вариантом ... еще одна ошибка SEO.
Пару лет назад шрифты Cufon стали популярными. Шрифты Cufon используют правило CSS @ font-face, чтобы заменить текст по умолчанию выбранным шрифтом Cufon. По сути, файл JavaScript преобразует шрифт в векторную форму, которая затем переводится в VML (язык векторной разметки), который определяет форму шрифта. Проблема шрифтов Cufon заключается в том, что они не всегда визуализируются одинаково в каждом браузере, требуется JavaScript, а используемый интернет-браузер должен поддерживать используемый JavaScript. Я отмечаю это, так как около года назад шрифты Cufon перестали работать в IE. Если вы использовали шрифты Cufon и не были уверены в проблеме, хорошие новости ... файл JavaScript был обновлен, и вы просто заменили файл cufon-yui.js на самый последний. Это обновление работает как для статических, так и для сайтов CMS. Вы можете скачать его по адресу: https://www.2shared.com/document/O0Ku4S3n/cufon-yui.html
Пример используемого шрифта Cufon:
<script type = ”text / javascript” src = ”js / Droid_Sans.font.js”> </ script>
Итак, это подводит меня к самой последней опции Font. Текущий веб-стандарт должен использовать встроенные веб-шрифты. Веб-шрифты связаны с, и если вы немного поищете, вы обнаружите, что в настоящее время доступно множество вариантов веб-шрифтов. Adobe предлагает веб-шрифты, как и Google, и многие другие. Одним из преимуществ веб-шрифтов над шрифтами Cufon является забота о удобстве использования. Поскольку не у всех будет установлен новейший браузер или включен JavaScript из соображений безопасности, веб-дизайнеру необходимо убедиться, что предоставленный текст является наиболее общепринятым вариантом, но при этом он отвечает своим художественным целям представления. Инновационное использование типографики может помочь веб-разработчикам передать эмоциональное впечатление, а также выделить определенные области сайта, используя вариации шрифта, цвета, размещения и размера.
Внедрение шрифтов - это еще один вариант, часто встречающийся в использовании. В этом случае шрифт размещается самостоятельно (вызывается из папки на вашем веб-сайте или сервере), а затем связывается с использованием CSS-шрифта @ font-face.
Пример используемого веб-шрифта:
<link rel = ”stylesheet” type = ”text / css” href = ”https://fonts.googleapis.com/css?family=Tangerine”>
Шрифт применяется простым объявлением CSS:
тело {
семейство шрифтов: «Tangerine», с засечками;
размер шрифта: 48 пикселей;
текстовая тень: 4px 4px 4px #aaa;
}
Популярные параметры веб-шрифта
Google Web Fonts
https://www.google.com/webfonts
Существует множество вариантов веб-шрифтов (большинство из них размещены), и большинство веб-дизайнеров, с которыми я работал, используют Google для своих веб-шрифтов. Благодаря бесплатному сервису Google разработчики могут настраивать свои шрифты с открытым исходным кодом, а пользователи могут просматривать семейства шрифтов и добавлять свои избранные в свою собственную коллекцию. Это позволяет пользователям Google быстро выбирать любимый шрифт для использования в Интернете, со временем улучшать свою коллекцию и просматривать свои любимые стили в образце макета.
Adobe Web Fonts
https://html.adobe.com/edge/webfonts/
Adobe Edge Web Fonts предоставляет один бесплатный доступ к обширной библиотеке веб-шрифтов, которая стала возможной благодаря вкладам Adobe, Google и дизайнеров по всему миру. Шрифты обслуживаются Typekit, поэтому вы можете быть уверены в их высокой производительности и стабильности.
Typekit
https://typekit.com/
Платформа typekit для веб-шрифтов - «на основе подписки», начиная с $ 24,99 в год. Typekit дает пользователям возможность предварительного просмотра шрифтов во многих браузерах и операционных системах, что эффективно, поскольку типы различаются по внешнему виду в зависимости от браузера и платформы. У Typekit более 250 000 клиентов, включая The New York Times и Twitter.
Fontdeck
https://fontdeck.com/
Fontdeck предлагает каталог с тысячами шрифтов, которые улучшены для использования на экране. Цена, как правило, составляет 7,50 долл. США в год за каждый шрифт, цена определяется отдельно для каждого веб-сайта, и вы платите только за шрифты, которые являются живыми.
Webtype
https://www.webtype.com/
Webtype предлагает высококачественные веб-оптимизированные шрифты. Сервис гарантирует, что все гарнитуры автоматически обновляются и корректно отображаются в каждом браузере. Хотя цены не указаны на их веб-сайте (я ненавижу это), планы Webtype начинаются с 40 долларов в год для сайтов с менее чем 250 000 просмотров страниц.
Fontspring
https://www.fontspring.com/
Fontspring отличается от большинства поставщиков веб-шрифтов тем, что они предлагают загружаемые шрифты для самостоятельного размещения. Пользователи приобретают тип шрифта, который они могут использовать в любом количестве проектов без годовой платы. Этот сервис также предлагает шрифты приложений, которые можно использовать в мобильных приложениях.
Узнать что-то новое? Почему бы не уделить время и полюбить нас на Facebook 🙂
https://www.facebook.com/pages/E-Curtis-Designs/112211662171761
Узнать что-то новое?