Нестандартные шрифты: Необычные шрифты — каталог бесплатных шрифтов, которые Вы можете скачать

Шрифт 

Содержание

Как использовать необычные шрифты | Блог Смартпринт.рф

Шрифт — элемент дизайна, не акцентирующий на себе внимание, но влияющий на восприятие рекламного продукта в целом.  Необычные шрифты отлично смотрятся в логотипах, названиях, но для текста они не годятся.

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

Шрифт Rounds

Выбор шрифта зависит от того, на какую эмоцию вы хотите настроить потребителя.

Факторы, влияющие на восприятие шрифта:

  • Цвет шрифта
  • Пропорции шрифта

Цвет шрифта. Экспериментами с цветом текста (основной текст) лучше не увлекаться  и выбрать стандартный вариант «черное на белом/белое на черном». В противном случае глаза читающего быстро устанут. Цветовое выделение подходит для акцентирования внимания на заголовках и призывах к действию.

Пропорции шрифта. Есть узкие и широкие шрифты. Этот фактор играет важную роль, когда нужно вместить определенное количество текста, либо текст должен занимать определенное количество площади рекламного носителя по законодательству (создание киноплакатов, упаковка табачной продукции).

Использовать лучше не больше 3-х разных шрифтов.

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

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

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

Serif     Шрифты с засечками– декоративными элементами, которые служат украшением буквы. Такие шрифты используют для печати основного текста. Считается, что при чтении такого текста глаза меньше устают.Sans Serif   Шрифты без засечек. Используются для вывода основного текста на экран. Цель та же — уменьшить утомляемость глаз при чтении с экрана.    Slab Serif Slab Serif (с горизонтальными засечками) имеет переход едва уловимый переход от более тонкой линии к более толстой. Подходит для длинных текстов, для печати детских книг.
Характеристика   ёмкий, изящный, мощный,  классический, универсальный		Характеристика:   современный, лёгкий, простой и корпоративный.Характеристика:   презентабельный, массивный, древний, дружелюбный.
Script   Каллиграфия, такой шрифт создается с помощью плавных линий и переходов. Подходит для названий, логотипов. Не рекомендуется использовать для длинных текстов.Blackletter   Blackletter имеет переходы от толстого к тонкому штриху, засечками и длинными завитушками. Стоит использовать шрифты этого семейства с особой аккуратностью, т. к. их экстравагантность не всегда уместна.Sign Painter   Эмитирует роспись кистью. Используется, как декоративный элемент, для создания длинных текстов также, как и Screipt  не подходит.
Характеристика:   классический, романтичный, приятный, теплый и мягкий.Характеристика:   сильный, жесткий, исторический, драматический и холодный.Характеристика:   винтажный, мягкий, рукописный, художественный и игривый.

Сервис typewolf  позволяет подбирать гармоничные шрифтовые пары и предлагает подборки шрифтов по различным направлениям.Так, например, среди популярных: «10 альтернатив Гельветике», «10 лучших бесплатных шрифтов не из Google Fonts», «10 лучших пар сериф + сан-сериф на Google Fonts», «10 необычных гротесков» и множество других полезных подборок.

Шрифт Metropolis. У шрифта две версии: латиница и кириллица.

Отличная шрифтовая пара только с латиницей.

Рукописный шрифт Menttion.

Похожие статьи:

Нестандартные шрифты на сайте | Golos.io Блоги

Представим себе ситуацию: вы хотите на собственном сайте использовать красивые, но нестандартные шрифты. Как быть? Вариантов, к счастью, больше одного.

Самый старый — картинки

Оперировать можно было только теми гарнитурами шрифтов, которые были на компьютерах посетителей сайтов. В противном случае любые «красивости», которых не нашлось в операционных системах зрителей сайта, браузер принудительно заменял на стандартные шрифты. Для шрифтов с засечками это чаще всего становилось семейство 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 прописываем стили, примерно так:
h2 { font-family: "Pollock1CTT", arial; ... }

И это всё! Шрифт уже будет отображаться в заголовках первого уровня, ну или где вы там его пропишите. Впрочем, если по каким-либо причинам шрифт всё-таки не подгрузится (вдруг сайт — донор завис), надпись откроется обычным эриалом. Плюсы те же, что и в прошлом примере, но вам не нужно заморачиваться с конвертированием шрифтов. Нравится — используете его и всё. Справедливости ради я должен предупредить, что не знаю наверняка как именно это реализовано. Не знаю, подгружается ли в данном случае шрифт на компьютер посетителя сайта или нет. Но в пору, когда диалапа становится всё меньше, а вам как создателям сайта для использования красивых шрифтов почти ничего не надо делать, считаю этот метод наиболее привлекательным.

Короткий вывод

На моём персональном сайте до недавнего времени использовались одновременно все три варианта — шапка сайта была оформлена картинкой, основной шрифт статей загружен на сайт, а вставки кода в статьях осуществлялись моноширинным шрифтом по третьему методу. На просторах интернета на сегодняшний день активно используются все три варианта, не исключено, что есть и другие. Во время, когда почти любые сайты создаются на основе тех или иных CMS, это тем более просто. Единственное, о чём хочется напомнить, что сама по себе возможность пользоваться чем-либо, не является обязательной. Старайтесь не злоупотреблять на своих сайтах количеством шрифтов. ))

Нестандартные шрифты

Нестандартные шрифты — компьютерные шрифты, расположение глифов в которых не соответствует общепринятым кодировкам. Такие шрифты могут включать в себя:
знаки экзотических систем письма;
технические символы;

декоративные символы.
пиктограммы;
Распространение нестандартных шрифтов началось одновременно с появлением в текстовых процессорах возможности переключения шрифтов — это позволяло неограниченно наращивать набор используемых знаков, не выходя при этом за рамки технологии 8-битных символов.
Нестандартные шрифты широко используются и при локализации игр: часто в играх применяется собственный шрифтовой движок, и, чтобы «вписаться» в его ограничения, иногда приходится корректировать кодировку. Изредка приходится «втискивать» в однобайтовую кодировку и русские буквы, и символы с умляутами например, имена поворотов в автосимуляторах — см. схему автодрома Интерлагос.
В то же время использование нестандартных шрифтов влечёт и очевидные неудобства: при отсутствии доступа к конкретному шрифту невозможно определить, какой символ должен изображаться, поэтому при переносе документа на другой компьютер все нестандартные символы могут превратиться в кракозябры то же самое происходит про просмотре веб-страниц на компьютере, где отсутствует конкретный нестандартный шрифт.

1. Юникод и нестандартные шрифты
Внедрение Юникода уменьшило потребность в нестандартных шрифтах, поскольку все широко используемые символы получили свои кодовые позиции. В Юникоде предусмотрена и возможность использования «пользовательских символов» — для них отведены отдельные области U+E000 — U+F8FF и U+FFF80 — U+10FFFF.
Наряду с этим существуют и такие шрифты, в которых нестандартные символы размещены «нелегально» — на позициях, отведённых для других символов. Особенно популярно размещение нестандартных символов в позициях 0x20 — 0xFF: это делает их доступными для программ, не использующих Юникод. Например, русские шрифты TrueType раньше часто делались так, что русские буквы занимали позиции U+00C0 — U+00FF позиции расширенной латиницы, вместо правильных U+0410 — U+044F — это позволяло, например, работать с кириллицей в ранних нерусифицированных версиях Windows.

2. Примеры нестандартных шрифтов
WordPerfect поставлялся с большим набором нестандартных шрифтов. В своё время химиками широко использовался редактор ChiWriter, который имел собственный шрифтовой движок со встроенным редактором — но в нём была только первая половина кодовой таблицы. Так что русские пользователи создавали нестандартный шрифт, соответствующий русской клавиатурной раскладке Q → Й и т. д.
Microsoft Windows включает несколько нестандартных шрифтов: Symbol греческие буквы и математические символы, Wingdings пиктограммы и декоративные символы, Webdings пиктограммы.
Компания ПараТайп выпускала ряд нестандартных шрифтов: для русского в старой орфографии, для «азиатской кириллицы», для грузинского, армянского, древнегреческого и т. п.

  • загружено несколько символьных шрифтов среди которых наиболее часто используются Wingdings и Webdings. Нестандартные шрифты Словарь шрифтовых терминов на
  • дополнительные или нестандартные шрифты управлять скоростью автоповтора, гасить экран по истечении времени, а также управлять переключением шрифтов и раскладок
  • призванный помочь разработчикам шрифтов в обеспечении совместимости при представлении естественных языков Европы. Шрифты которые включают глифы для всех
  • Стандартные шрифты при этом обычно слипались, и нужно было загружать собственные в BIOS более узкие шрифты обычно были прописаны вендором, но русские шрифты загружались
  • экранах и вывесках. В разработке шрифтов для использования в фильме Атака клонов включая мандалорские и геономические шрифты графический художник Филипп
  • каллиграфию и давшее начало готическим шрифтам в латинице, и уставное письмо, из которого развились славянские шрифты в кириллице. См. также: Стили китайской
  • комбинация клавиш Command Option S. Распознавание на веб — странице нестандартных шрифтов и их загрузка по мере необходимости Интеграция мультимедийных технологий
  • Quattro. Библиотека загружает графические драйверы BGI и векторные шрифты CHR с диска для обеспечения устройство — независимой поддержки графики
  • неупрощённым ключом 麥, но во многих шрифтах есть только иероглиф 麺 с упрощённым ключом. Релиз Mac OS X v10.5 Leopard включает шрифт Hiragino Mincho Pro N и Hiragino
  • и разъём для SD — карточек памяти. Присутствует интерфейс RS — 232, но нестандартные уровни напряжения затрудняют его использование. HP 50g широко известен
  • использовались шрифты с нестандартной кодировкой, т. н. dingbat fonts В итоге при попытке переноса документа в другую систему все нестандартные символы превращались
  • SKALICA. Также стоит отметить немного изменённый по сравнению с оригинальным шрифт полужирный Помимо модели 48К выпускалась и более дорогая модель Символ — 128К
  • пишется как это пиктограмма задняя сторона aemq пишется как нестандартные иероглифы, составленные по идеографическому принципу: ручьи mboq
  • грубый корпус с прямыми углами без плавных линий большие кнопки, крупные шрифты и выдвижная антенна нужна для лучшей работы FM — радио Дизайн был разработан
  • своего прямого назначения, порой используется для придания словам иных, нестандартных чтений к примеру, в ранобэ To Aru Majutsu no Index немалое количество
  • автомобильных наличием лишь двух букв. Данные номера также существуют для нестандартного места крепления. Они повторяют внешний вид автомобильных номеров: до
  • Слоговые шрифты для нескольких языков. Канадское слоговое письмо на сайте Tiro Typeworks. Включает шрифт Euphemia для всех языков и эскимосские шрифты разработанные
  • внедряли нестандартные для html теги, призванные улучшить внешний вид документа. Браузер был настолько распространённым, что нестандартные теги не вызывали
  • чёрный прямоугольник. В зависимости от типа ошибки и версии AmigaOS цвет шрифта и рамки прямоугольника может варьироваться — для обычной ошибки он является
  • глав иногда отмечены красными точками иллюминации и орнаментации нет. Шрифт в основе своей — островной минускул, но со множеством элементов скорописи
  • года газету начинают издавать два раза в неделю. Яркое оформление и нестандартная подача материала способствовали росту её популярности. Издание практически
  • то автомобиль зарегистрирован на физическое лицо. Для автомобилей с нестандартным местом крепления заднего знака и для большинства автомобилей производства
  • в которой были опущены многие нововведения версии 3.0, но добавлены нестандартные элементы, поддерживаемые браузерами Netscape Navigator и Mosaic. В версии
  • предложения из шести слов. При попытке игрока задать на выполнение нестандартную команду, не предусмотренную сценарием, игра отвечала сообщением о том
  • поддержка VFR в AVI и не предусмотрена, её можно использовать без создания нестандартных файлов, с помощью блоков нулевой длины для пропускаемых кадров. С помощью
  • протеиногенными, или стандартными, в некоторых белках присутствуют специфические нестандартные аминокислоты, возникающие из стандартных в процессе посттрансляционных
  • браузер использует для отображения символов МФА шрифт Arial Unicode MS, то, в связи с дефектами этого шрифта следующие некорректно составленные последовательности
  • регистре напр. Lytdybr нестандартное использование заглавных букв, смешение латиницы и кириллицы и другие игры с алфавитами и шрифтами и т. д.. Книга вошла
  • Компьютерная поддержка была разработана в 2004 году, и сегодня существуют шрифты методы ввода и подробные онлайновые словари. Существуют как конкурентные
  • с разметкой, когда профессиональный верстальщик может пользоваться нестандартными тегами, или вставлять javascript — код в разметку. В прессе часто выносится

Нестандартные шрифты: необычные шрифты на русском, необычные шрифты для ника, необычные шрифты онлайн скопировать, необычные шрифты на русском онлайн, шрифты скачать, необычные шрифты для инсты, необычные шрифты для фотошопа русские, русские шрифты для инстаграма

Необычные шрифты для ника.

Что вы думаете про шрифты Ариал и Вердана для. Font Face: подключение нестандартных шрифтов. Здравствуйте дорогие друзья! В данном посте хотел бы разобрать такой немаловажный момент в. Шрифты скачать. Нестандартные шрифты на холсте Canvas. Javascript форум. Я смотрю ваши сайты: вы используете нестандартные, редкие шрифты. Шрифты же выше Ариал или Вердана это самые базовые. Необычные шрифты для инсты. Как подключить любые шрифты для сайта Website. Необычные шрифты. mr BelladonaStencilG. 42 Кб. Необычные шрифты для фотошопа русские. Внедрение шрифтов в документы и презентации Служба. Вы можете скачать шрифт BERLIN SANS FB DEMI BOLD одним zip ​архивом, в архиве 1 шрифт. allshrift. Шрифт BERNARD MT CONDENSED. Favorite.

Необычные шрифты онлайн скопировать.

3 Способа подключения шрифтов на сайт CSS, Google Fonts. Юзай @font face. Вот кроссбраузерный генератор. Пользуюсь сам. Необычные шрифты на русском онлайн. Нестандартные шрифты на сайте или CSS свойство @font face. Наверняка у многих возникали проблемы с отображением шрифтов на устройствах, где данные шрифты не установлены. К счастью. Нестандартные шрифты в верстке: почему shit happens?. Нестандартные шрифты. 12.01.2019,:45. Здравствуйте, у меня шаблон yoomaster2, уже несколько дней пытаюсь разными способами.

Шрифты категории Необычные, скачать бесплатно на AllShrift.

Можно ли как то отображать на холсте нестандартные шрифты? при условии, что они заранее не установлены на компьютере. Сервисы для конвертации шрифтов онлайн, font@face генераторы. Существует множество нестандартных шрифтов, которые что многие нестандартные шрифты скорее всего не отобразятся в. Как подключить нестандартные шрифты для DLE WebForMySelf. Ранее тут же я писал о том, как забацать нестандартный шрифт у себя на сайте, но статью написал очень сыро и ограничено, тем более из вариантов​. Применение нестандартного шрифта на сайте Web. Если в исходном документе есть декоративные нестандартные шрифты. Если в вашем документе используются декоративные шрифты или.

Нестандартные шрифты на сайте с помощью CSS студия.

Фотошоп 79 Языковые 38 Всего шрифтов: 6070. Необычные русские шрифты. Rammstein Regular PF Playskool Pro 3D Regular. Список шрифтов для использования в HTML коде HD Systems. К html е подключен нестандартный шрифт. Запускаю эту у в Internet Explorer 11 ОС Windows 8.1 Enterprise. Если. Шрифты Дежурка. Более того, эта программа позволяет печатать PostScript шрифты на если вы собираетесь использовать нестандартные шрифты в Web ах и.

Нестандартные шрифты на android и других платформах.

Если в презентациях PowerPoint Вы используете нестандартные шрифты, важно сохранить их и после загрузки в облако iSpring. Читайте пошаговую​. Шрифты: как они работают Компьюарт. Default. ⓑⓤⓑⓢ. ᔕᗰOOTᕼIE. ꒟廾工刀乇丂乇 冊闩乍工闩. Crystal Clear. H͛a͛r͛r͛y͛ P͛o͛t͛t͛e͛r͛. ѕυи∂αу ¢υ∂∂ℓє. B⃣u⃣b⃣b⃣l⃣e⃣ B⃣o⃣x⃣.

Как подключить и оптимизировать нестандартные шрифты.

Чтобы выбрать для просмотра только кириллические шрифты, в фильтре слева в параметре Script необходимо выбрать значение Cyrillic для кириллицы. Подключение нестандартных шрифтов на сайте О WordSmall. Нестандартные шрифты. Если стандартного набора шрифтов недостаточно, его можно расширить на сайте можно использовать шрифты,. Нестандартные шрифты на е при помощи css свойства. Попробуем заменить его, скажем, шрифтом Open Sans от сервиса шрифтов Google. Идем на сайт сервиса Google Fonts и находим.

Textygram Красивые шрифты для Инстаграм.

Нестандартные шрифты с помощью font face. На протяжении многих лет, веб дизайнерам приходилось использовать на своих сайтах только. Нестандартные шрифты с помощью font face Блог про веб. Необычные шрифты отлично смотрятся в логотипах, названиях, но для текста они не годятся. Восприятие текста. Шрифт задает. Нестандартные шрифты в web, вместе с FontSquirrel CSS LIVE. Практически каждый дизайн использует нестандартные шрифты, вашему вниманию сервисы для конвертации шрифтов онлайн.ttf в.eot.woff и. Нестандартные шрифты Abbyy Finereader Файнридер. Нестандартные шрифты широко используются и при локализации игр: часто в играх применяется собственный шрифтовой движок, и, чтобы. Не отображаются нестандартные шрифты в IE11 с локалки. В нынешнее время все чаще можно встретить сайты где используются нестандартные шрифты. Это под стать современному.

Нестандартные шрифты Карта знаний.

В этой статье учимся встраивать нестандартные шрифты на свой сайт с применением конструкции @font face. Нестандартные. Как подключить нестандартные шрифты на сайт? Stack Overflow. Сохраняйте внедренные шрифты в документах Word и презентациях нестандартных шрифтов, а также в том случае, если вы предполагаете, что​. Метки нестандартные шрифты Заур Магомедов. Подключение шрифтов, на исправление иногда уходит много времени, покажу как я подключаю нестандартные шрифты. Нестандартные шрифты Joomla 3.x: Установка, обновление и. Один из ответов на вопрос Каким сегодня может быть шрифт с обратным контрастом? В Rever нестандартный набор начертаний: кроме прямого,.

Как использовать нестандартный шрифт на сайте.

Добрый день Сколько не работал с ВБ, так и не решил для себя вопрос шрифтов. У меня например, установлены на ПК шрифты. Как загрузить презентацию с нестандартными шрифтами в. Статьи на CMS Magazine: Как привязать нестандартные шрифты к проекту SiteEdit? Web конференция 14 ноября мск. Используем нестандартные шрифты на сайте Частный. Пытаюсь добавить свой текст на русском языке к названию товара. в файле моей темы catalogpl добавляю. Добавить на сайт нестандартный шрифт css Кабинет Веб. Подключение сторонных шрифтов для сайта Нестандартные кроссбраузерные шрифты Примеры подключения. Нестандартные шрифты на сайте Блоги. А значит, что нам надо подключить этот нестандартный шрифт к сайту и, если его нет у пользователя, загрузить на компьютер. В этом нам поможет css.

20 причин почему нужно использовать веб шрифты.

Июнь был богат на нестандартные дизайнерский бесплатности! Мы собрали все самое интересное. Вы найдете анимированные экшены и mockup. Как добавить на сайт какой то нестандартный шрифт. Особенности использования нестандартных шрифтов на сайте с использованием CSS и API Google Fonts. Используйте нестандартные шрифты с помощью Over для iOS. Нестандартные шрифты в этом случае более выразительные и кроме того их на порядок больше, так что есть из чего выбрать. А еще, шрифт является​.

30 красивых шрифтов для вашего логотипа Logaster.

Вам 3 способа, с помощью которых вы сможете подключить любые, самые разнообразные и нестандартные шрифты на свой сайт. Необычные Шрифты онлайн. Тут нам на помощь приходит несколько решений: нестандартное – используем сторонние библиотеки cufon, google fonts, и другие, или. Как использовать необычные шрифты в полиграфии Блог. Однако вариант с Google Web Fonts не всегда оказывается пригодным. Например, если дизайнер использовал шрифт, которого нет в. Семейства шрифтов. Проблемы использования нестандартных. Данный курс научит Вас созданию игр на Unreal Engine 4. Курс состоит из 12 модулей, в которых Вы с нуля освоите этот движок и. Нестандартные шрифты это Что такое Нестандартные. Очень важно выбрать красивый шрифт для дизайна логотипа. Здесь мы собрали бесплатные русские и другие шрифты для ваших.

Нестандартные шрифты. WYSIWYG Web Builder.

Такими являются, например: без засечек шрифт Arial, с засечками Times New Roman и моноширинный Courier New. Эти шрифты есть на всех. Шрифты, используемые на сайте. Fontface Нестандартные шрифты на сайте или CSS свойство @font face Очень часто в дизайн сайта гораздо лучше вписываются.

необычные шрифты онлайн скопировать, необычные шрифты на русском онлайн, необычные шрифты для фотошопа русские

Как правильно подключать шрифты при помощи CSS? Правило @font-face

Вам попался капризный заказчик, требующий «расписные» шрифты? Или вы просто создаете стильный тематический сайт, и кастомное написание текста подчеркнет вашу авторскую идею? Рассмотрим один из способов решения данной задачи.

Когда бывает нужно

Для начала рассмотрим наиболее оправданные случаи, в которых Вам могут понадобиться нестандартные шрифты.

  • Стильное меню.
  • Стильные заголовки.
  • Логотип. Создание логотипа – дело серьезное, много книг по этому поводу написано, долго специалисты этому делу обучаются… И автор не станет отбирать у людей их хлеб, но вставит свои пять копеек. Если ваш логотип представляет собой текст, то в целях качественной SEO оптимизации выводить его следует как ТЕКСТ.

Задача заключается в использовании нестандартных шрифтов, то есть таких, которые со значительной долей вероятности отсутствуют у пользователя вашего интернет-ресурса.

Пути решения

Как и в большинстве случаев, любое задание имеет несколько путей решения, и наше – не исключение. Поехали:

  • Картинка. Отсутствует гибкость настройки, ухудшается скорость загрузки страниц, увеличивается нагрузка на сервер, SEO вообще не при делах.
  • Flash. Дополнительные файлы для загрузки, нужны навыки работы в Flash-эдиторах (параметры текста менять тоже здесь), средняя SEO.
  • JS. Дополнительные внешние файлы (и все, что из этого вытекает), средняя SEO, текст невозможно скопировать.
  • Нестандартные font-ы средствами CSS

Истинный путь самурая, или «да здравствует CSS»

В решении поставленной задачи нам поможет css правило @font-face, которое позволяет подгружать к документу специфические шрифты и определить их настройки.

CSS:

@font-face {
    font-family: AlexBrush-Regular;    
    src: local("AlexBrush-Regular"), 
    url("./AlexBrush-Regular. otf "); 
 }

Таким образом мы исключаем необходимость наличия выбранного нами шрифта в ОС посетителя.

Конструкция такого вида позволяет подключить TrueType (ttf) и OpenType (otf) шрифты.

Интересно: OpenType обладает бо́льшими по сравнению с TrueType возможностями предпечатной подготовки и поддерживает бо́льший набор символов при меньшем размере файла.

Казалось бы, на этом тему можно было и закрыть, но есть одно НО… Вспомним о наших «особенных» друзьях, а именно о браузерах семейства IE. Для внедрения нестандартного шрифта в IE шрифт должен быть в Embedded OpenType (eot) формате.

Это мало не единственный случай, когда особенность IE приносит больше пользы, чем вреда. Дело в том, что eot формат подразумевает:

  • Шифрование. В файл заносятся данные об адресе проекта, так что украсть шрифт и залить себе на сайт у злоумышленников не получится.
  • Компрессию. Файл шрифта сжимается, тем самым уменьшаются временные затраты на загрузку.

Приняв к сведению выше сказанное, модифицируем наш пример:

CSS:

@font-face {
   font-family: AlexBrush-Regular;
   src: local("AlexBrush-Regular "),
   url(./ AlexBrush-Regular.eot);
}
 
@font-face {
    font-family: AlexBrush-Regular; 
    src: local("AlexBrush-Regular"), 
    url("./AlexBrush-Regular. otf "); 
 }

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

CSS:

@font-face {
    font-family: " AlexBrush-Regular ";
    src: url("AlexBrush-Regular.eot");
    src: url("AlexBrush-Regular.eot?#iefix") format("embedded-opentype"),
    url("AlexBrush-Regular.svg#JournalRegular") format("svg");
    url("AlexBrush-Regular.woff") format("woff"),
    url("AlexBrush-Regular.otf ") format("truetype"),
  }

Важно!!!

  1. Гибкость. Настройка и изменение параметров текста не составляет труда.
  2. Скорость. Минимальное число дополнительных файлов для загрузки, не тормозит страницу как такое же количество элементов на js и Flash.
  3. SEO. Текст остался текстом – плюсы очевидны.
  4. Пример работоспособен в браузерах начиная с: IE4, Op, Fx3.5, Cr2, Sa1.
  5. Перед применением шрифта нужно провести его оптимизацию (читайте послесловие).
  6. При использовании покупных шрифтов нужно побеспокоится об их безопасности.
  7. Если пропускная способность канала связи маленькая, то пока не подгрузится файл шрифта, пользователь либо увидит простой шрифт на месте нестандартного, либо не увидит ничего в принципе.

Послесловие.

Оптимизация шрифта

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

В результате таких стараний файлы шрифтов могут перевалить за отметку десятков мб. А нужно ли нам такое разнообразие? Ведь для придания пикантного стилевого оттенка, нам (в зависимости от ситуации) не обязательно нужны знаки препинания, разнообразные символы. По правде говоря, и разные начертания не всегда нужны. Или допустим, вы оптимизируете свой сайт строго под рунет, без латыни можно обойтись…

Ну, суть Вы уже уловили. Шрифт нужно оптимизировать:

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

Как это сделать? На просторах интернета существует целый ряд сервисов, позволяющих выполнить необходимые операции, например: font-face Generator, Online Font Converter, Web Font Optimizer и др.

Защита

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

При приобретении шрифта Вы получаете право применять его в вэб, но если шрифт с Вашего ресурса выкачает злоумышленник, то ответственность за причинённый разработчику вред понесёт хозяин сайта. Как защитить свой font?

В IE все продумано до нас – защита в формате eot уже встроена. Для всех остальных обозревателей однозначного решения пока нет.

Существуют, конечно, новые разработки – например, формат WOFT, в котором вопрос защиты снимается аналогично eot, но к сожалению, он пока не может похвастаться полной поддержкой в браузерах.

Также вы можете просто применить бесплатные шрифты.

Оценок: 5 (средняя 5 из 5)

Нестандартные шрифты на сайте