Let’ посмотрим правде в глаза: Web-безопасных шрифтов очень ограничивает.Может быть, десятков шрифтов, что там достаточно широко принята для рассмотрения “ Web безопасно, ” и те, aren’ т точно захватывающим для много другого, чем тип кузова.Конечно, Грузия, Arial или Times New Roman прекрасно работать для основной части текста на вашем сайте, но что, если вы хотите что-то другое для, let’ скажем, заголовки?Или цитаты?Что то

У вас есть несколько вариантов.Многие люди просто выбирают более сложные CSS шрифт stacks, причем предпочтение отдается шрифты фронт.Но это по-прежнему оставляет большой кусок посетители видим тот же самый старый Web-безопасной fonts.

Войти динамический текст replacement.В дополнение к шрифтом стеки, почему бы не заменить заголовок текста с изображений, встроенные шрифты, или немного Flash?Методы, описанные ниже, легче, чем они кажутся.И конечным результатом является то, что подавляющее большинство пользователей будет увидеть красивую типографику вы хотите их видеть.Слово предупреждения, хотя: don’ T использовать динамический текст замены для всех текст на page.Все, что бы сделать, это замедлить и сорвать ваши посетители.Вместо этого, сохраните его для заголовков, пунктов меню, цитаты и другие небольшие кусочки text.

1.SIFR 2.0

sIFR (Scalable Inman Flash Replacement) был одним из первых динамические методы замены текста, разработанный весной 2005 года.Он использует JavaScript и флэш конвертировать любой текст, который назначает на странице любой шрифт Вы выбираете и был выпущен с открытым исходным кодом под CC-GNU LGPL license, так it’ бесплатно для тех, кто use.

SIFR полностью доступен для чтения с экрана, потому что он просто отображает оригинальный текст, если JavaScript или флэш-isn’ T включен.И из-за того, как текст отображается, если ваши посетители увеличить использование browser’. С текстом масштабирования вариант, заменить текст будет также увеличения (только при загрузке страницы, хотя, если они не увеличить позже)

Как SIFR Works

SIFR Хотя это довольно сложная система, ее основная концепция проста: наличие проверяет, есть ли вспышка установлена ​​в Вашем браузере.Если isn’ T (или если наличие isn’ T установлен), он останавливается там, и посетитель видит ваш текст в любом шрифте you’ ве, указанных в таблице стилей.Если Flash установлен, то наличие мер каждого элемента на странице, которая you’ ве предназначено быть converted.

После наличие измерил все элементы, он заменяет каждый с флэш фильм, который имеет такой же размер, какоригинальный элемент.Оригинальный текст передается в флэш фильм в качестве переменной, то код ActionScript в файле флэш рисует текст в шрифт you’ выбрали и масштабы его, чтобы заполнить площадь, занимаемая флэш movie.

Преимущества sIFR

• Работает практически с любым font
• Ухудшает изящно в большинстве случаев к исходному HTML или (X) HTML файл, если человек doesn’ т у флэш-памяти или наличие installed
• Кросс-браузерные и кросс-платформенные compatible
• Поскольку исходный (X) HTML документа остается неизменной, SEO, доступность и другие проблемы, люди, как правило, с флэш-aren’ т действительно issues

Недостатки / недостатки sIFR

• Требуется как JavaScript и флэш быть installed
• Не будут видны, если блокировка вспышки объявление used
• Firefox не легко снимите SIFR text

2.P C DTR (С переноса слов и Внутренней Tags)

PC DTR (с переноса слов и внутренние теги) (“ P” и “ C” стоять на PHP и CSS) является метод замены текста, который работает с PHP и CSS, а не флэш-память или JavaScript.Учитывая, что PHP является серверным языком, и каждый современный браузер автоматически поддерживает CSS, этот метод имеет некоторые преимущества по сравнению с теми, которые используют флэш-память или JavaScript.Эта версия PC DTR основана на оригинальные PC DTR method, но с добавлением переноса слов и внутренней tags.

Как P C DTR Works

PC DTR используется PHP’ S функции буферизации вывода, чтобы извлечь текст заголовка и дать ему встроенный стиль, который указывает на скрипт, который заменяет текст с изображением.Таким образом, единственным требованием в задней части является то, что хост-сервер поддерживает PHP изображение generation.

CSS вступает в игру при назначении heading’ S цвет шрифта, размера и цвета фона.Стиль для заголовка хранится в отдельном файле CSS, но файл называется только один раз за сессию браузера, так что doesn’ T оказывать заметное влияние на загрузку страницы time.

Преимущества P C DTR

• Doesn’ т требует флэш-памяти или JavaScript
• Не влияет объявление blockers
• Выход действует XHTML и CSS

Недостатки / недостатки P C DTR

• Не будет работать, если изображения отключены в browser
• Заголовки должны быть однородными по всему сайту, вы can’ т есть один стиль заголовка на одной странице, а другой на другую страницу (если вы используете различные таблицы стилей для каждой страницы)
• Хотя это представляется возможным выделить текст в заголовке, это трудно сделать so

3.Cufón

Cufón была создана как SIFR альтернатива.Он использует JavaScript для замены текста, без вспышки, что делает его более широко совместимы, чем sIFR.

Как Cufón Works

Использование Cufón немного сложнее, чем многие другие методы DTR.Вы должны пройти дополнительный шаг: конвертация все шрифты, которые вы хотите использовать в формат, который Cufón может работать. автоматизированных tool могут сделать это, хотя, так что технически это не сложнее, чем другим methods.

После you’ ве преобразованы шрифты, Cufón просто заменяет текст в браузере с использованием шрифта you’ ве назначенные через JavaScript.Активация Cufón так же просто, как загрузка сценария и положить пару строк кода в голове вашего document.

Преимущества Cufón

• Doesn’ т требуют Flash
• Технически, it’ с довольно проста в использовании — даже с дополнительным шагом преобразования fonts
• В общем, встроенный текст можно скопировать и вставить в любое приложение, но оно doesn’ т всегда работает — например,Есть проблемы в Chrome 3 и Firefox 3.5.2
• Потому что текст отображается, используя только JavaScript, it’ S быстрее, чем многие другие methods
• Ухудшает изящно, если наличие isn’ T supported

Недостатки / недостатки Cufón

• Преобразует текст в графические файлы, что означает it’ Не столь же доступным, как равнину (X) HTML
• Не похоже на работу в IE8, если при просмотре страницы в совместимости mode It does работа в IE 8.
• Требуется JavaScript
• Вопросы доступность: Cufón обертывания текст внутри полотна и пролеты и т.д. Потому что.Каждое.Word.Есть.В.Его.Own.Span.Некоторые.Screen.Читателей.Уилл.Читать..Текст.Нравится.This.
• В Firefox, если CSS отключена, странный текст дублирования occurs
• Иногда есть проблемы с текстом selection

4.Typeface.js

Typeface.js является наличие на основе метода динамической замены текста, который встраивает шрифты на вашей странице, а не превращая их в образы.Это означает, что посетителям будет представлен страницу, которая действует (и на самом деле), как обычный HTML и CSS page.

Как Typeface.js Works

В то время как большинство методов упомянутых до сих пор либо заменить текст со вспышкой или превратить текст в изображение, Typeface.js стилей текста с использованием встроенных шрифтов JavaScript.Таким образом, ваштекст остается таким же доступным, как это было раньше, без необходимости Flash.

Typeface.js использует browser’ S векторной графики capabilities нарисовать текст в HTML-документах.Все современные браузеры поддерживают это (Firefox, Opera и Safari используют < canvas> элементов и SVG, а также Internet Explorer поддерживает VML).

Преимущества Typeface.js

• Листья текст на странице как текст, делая его более accessible
• Flash не required
• Не влияет объявление blockers

Недостатки / недостатки Typeface.js

• Вопросы Copyright предотвратить многие шрифты встраиваются в этой манере, так что только свободное и открытое шрифты источником может быть used
• Требуется JavaScript
• Инструмент для преобразования OpenType и TrueType шрифты Typeface.js’ с необходимой format
• Шрифт вложения вызывает больший размер страницы и многое другое HTTP requests
• Doesn’ T работы в Internet Explorer, когда изображения disabled

5.Подтяжка лица v1.2 (FLIR)

Facelift изображения Replacement (FLIR) является еще одним DTR альтернатива, которая использует PHP и JavaScript.Flir позволяет заменить любой элемент (h1, h2, пролеты и т.д.) с динамически сгенерированный текст и имеет обширную документацию, а также в качестве форума для получения help.

Как FLIR Works

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

Преимущества FLIR

• Doesn’ т требуют Flash
• Поддержка переноса слов, так что длинные заголовки aren’ та problem
• Работает практически с любой шрифт, который вы choose
• Ухудшает изящно, если JavaScript не available

Недостатки / недостатки FLIR

• Требуется JavaScript
• Текст выбор в Internet Explorer практически impossible
• Не будет работать, если изображения disabled

6.SIFR 3

SIFR 3 является новейшей версией SIFR.It’ S настоящее время в разработке, так что ошибки все еще нуждаются в доработке.Ряд новых функций были добавлены, и с помощью SIFR сейчас easier.

Как SIFR 3 Works

SIFR 3 работает так же, как SIFR 2.0.Он использует вспышки и JavaScript для замены текста на странице с флэш-ролик, сохраняя при этом доступность features.

Преимущества SIFR 3

• То же преимущества, как SIFR 2, упомянутые above
• Позволяет управлять кернинг,ведущие и высота строки properties
• Имеет возможность игнорировать определенные элементы в replacement
• Поддерживающий пиксельные fonts
• Позволяет использовать фоновые изображения в флэш file

Недостатки / недостатки SIFR 3

• То же недостатки, что и SIFR 2, упомянутые above

7.Сур (Scalable Замена изображения Inline)

SIIR другая техника, которая заменяет исходный текст файла изображения в любой шрифт, который вы выбираете.Она включает в себя кэширование программы, чтобы снизить нагрузку на сервер из всех динамически создаваемый контент, и это также включает в себя несколько ограниченными возможностями.Сур работает практически с любыми TrueType font.

Как сур Works

Сюр работает, как и большинство других динамических замены текста методами, которые используют изображения вместо оригинального текста.Смесь JavaScript и PHP код находит отдельные элементы, которые должны быть заменены; она тянет текста с веб-сайта для создания динамических изображений в нужный шрифт, а затем вставляет эти образы на месте text.

Преимущества SIIR

• Может быть использован для создания текста с любой TrueType font
• Документация очень тщательно и легкими для понимания и включает в себя объяснения изменений вы можете make
• Использует alt атрибут изображения для показа оригинального текста, если браузер изображений оказалось off
• Не требует Flash
• Doesn’ T отвлекать от SEO, потому что оригинальный текст отображается по-прежнему в вашем code

Недостатки / недостатки SIIR

• Заменены текста не изменится, если пользователь увеличивает размер текста в браузере (но большинство браузеров в настоящее время используют “ zoom”, так что это меньше беспокойства)
• Может быть процессор, хотя кэширование делает help
• Копирование и вставка текста в Internet Explorer не possible

8.SIFR Lite

На основе оригинальной методики SIFR, SIFR Lite является более простой, удобной техникой.Результатом является гораздо более легкий, чем оригинальный и полност� …

Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров