Pull to refresh

sIFR — расширяем возможности типографики xhtml

Reading time 2 min
Views 3.2K
sIFR

В этой заметке пойдет речь о довольно интересной технологии sIFR (Scalable Inman Flash Replacement). Путем комбинации Flash JavaScript и CSS на вашей XHTML-страничке можно создать текст, выполненный абсолютно любым шрифтом. При этом xhtml абсолютно валиден, текст будет выделяться, а отсутствие flash или JavaScript приведет всего лишь к отображению текста стандарным шрифтом с CSS стилями.

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

Использовать sIFR очень просто. Все завязано на том, что после загрузки страницы JavaScript заменяет нужные XHTML элементы на Flash, который содержит в себе необходимый шрифт.
  • Страница загружается в браузер
  • Java Script-ом проверяется наличие Flash плеера и затем ищутся указанные тэги или классы.
  • Если у клиента нет Flash или отключен JavaScript — ничего страшного не произойдет. Клиент увидит обычный текст со стилями.
  • Если всего хватает, то JavaScript для каждого указанного элемента создаст Flash-объект и призведет замену.
  • Встроенный во Flash Actionscript загрузит нужный шрифт размером 6pt и растянет до нужного размера.
Для каждого шрифта нужен всего один созданный специальным образом Flash-файлик.

Думаю, достоинства этого метода очивидны, а вот из недостатков стоит отметить:
  1. Заменённые таким образом элементы не участвуют в общем выделении (если, к примеру, вы нажали CTRL+A в браузере). Не критично, но пережить можно.
  2. Не всегда работает прозрачность фона. Если, к примеру, под заголовком находится какой-нибуть сложный фон. Похоже, это зависит от версии flash-плэера.
Материал на русском:
Материал на английском:

Мой собственный пример

UPDATE: В комментариях CurlyBrace подсказал интересное решение в виде плагина для JQuery, которое еще больше упрощает разработку. За что ему большое спасибо и мой скромный плюс в карму.

оригинал — sIFR — расширяем возможности типографики xhtml
Tags:
Hubs:
+15
Comments 20
Comments Comments 20

Articles