ArtShok. Сайтостроение и немного SEO

У rotor’a пару дней назад была опубликована очень интересная статья о том, как с помощью CSS, JavaScript и PHP изменить стандартные шрифты на сайте без использования флэш!

Данная технология называется FLIR (Facelift Image Replacement), своего рода альтернатива sIFR.

Как работает

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

Примеры использования FLIR можно увидеть всё на том же сайте разработчика и протестировать собственные сайты (к сожалению, не работает для кириллических символов:( ).

Установка

Не буду останавливаться на этом, так как инструкции к использованию вы можете найти по этим ссылкам: раз, два, три.

Несмотря ни английский, всё интуитивно понятно а на у кого не должно вызвать затруднений.

Плюсы

• лёгкая настройка
• не требуется поддержка плагинов в браузере (единственное требование, поддержка PHP GD library (библиотека для работы с графикой) на сервере);
• заменённый текст доступен поисковикам через атрибут alt;
• при отключенном JavaScript, выводится стандартный С?рифт, установленный в стилях;
• автоматическое подгонка изображения под размер подменяемого С?рифта;
• возможность выбора формата генерируемого изображения (GIF, PNG);
• при выделении и копировании текста и изображений, атрибуты alt копируются как нормальный текст.

А специально для блоггеров существует плагин для WordPress.

Минусы

• наблюдается некоторая «косячность» работы в Opera, в частности, при копировании текста вместе с изображениями, текст из атрибута alt не копируется. Эту проблему разработчик обещал исправить в последующих билдах;
• проблема при рендеринге некоторых шрифтов, поэтому предварительно отображение следует протестировать локально.

Где использовать

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

Рекомендуемые статьи:

• Пока нет ничего по данной тематике

Обязательно к использованию: