Как создать гладкие заголовки с HTML и CSS?
Я видел много веб-страниц недавно, которые имеют очень гладкие заголовки, как этот веб-сайт, например: http://boagworld.com/
Как они идут собирающийся сделать это? Там кто-либо - скрытые подсказки?
Однажды я получил известие от техники, где они использовали Flash (я думаю) встроить пользовательские шрифты на веб-сайт и затем заменить нормальные заголовки этой альтернативой флэш-памяти.
Что другие пути там помимо флэш-памяти?
4 ответа
Предполагая, что вы не хотите использовать изображения в качестве замены текста, существует несколько методов, которые очень ненавязчиво адаптируют улучшение шрифта:
- с использованием flash - SIFR
- чистый css =
@ font-faceи прямое встраивание шрифтов вttfилиotf - javascript метод улучшения, сценарий называется Cufon
Лично мне нравится использовать веб-безопасные шрифты с комбинацией менее известных и делать правильный откат
Они просто используют изображения в качестве фона CSS для определенных вещей, в данном случае:
http://boagworld.com/wp-content/themes/BoagworldV2/images/logo.gif
Вы можете делать все, что хотите, с помощью нескольких изображений и CSS, например:
#header { background: #FFFFFF url(myLogoImg.png) center no-repeat; }
Если вы не хотите использовать замену изображения или sIFR, но хотите использовать собственные шрифты, вам следует воспользоваться посмотрите TypeKit - http://typekit.com/ . Они позволяют вам вызывать пользовательские шрифты (которые они предоставили вам по лицензии) прямо из вашей таблицы стилей с помощью font-family и использовать встроенный на вашу страницу javascript для обслуживания шрифтов со своих серверов. Я использую его сервис в проекте прямо сейчас, и пока он, кажется, работает хорошо. У них пока нет огромной библиотеки шрифтов, но она все же больше, чем Arial, Verdana, Georgia и Times New Roman.
Я бы рекомендовал cufón для этого. Это не Flash (JavaScript), его действительно очень легко настроить, и он изящно деградирует.