Сглаженный шрифт на странице HTML - PullRequest
Новая
       10

Сглаженный шрифт на странице HTML

6 голосов
/ 19 марта 2009

Есть ли хороший способ создать четкий, чистый, БОЛЬШОЙ шрифт на веб-страницах? Мне нужно создать эффект облака тегов на моей домашней странице с разными размерами шрифта и цветами.

Я настроил его в HTML / CSS, но в старых браузерах или ОС, которые по умолчанию не поддерживают сглаживание, это выглядит немного ... дрянно.

Я играл с sIFR , который прекрасно работал, но дал мне ужасные эффекты загрузки, но теперь мне интересно, есть ли способ:

a) сделать обнаружение браузером / ОС, чтобы разделить пользователей по комбинациям браузера / ОС, которые, Я ЗНАЮ, поддерживают сглаживание (они получают необработанный HTML) и «другими», которые получают тег изображения.

б) Какой-то JavaScript для добавления сглаживания?

в) Постоянное решение для загрузки изображения BG в div и скрытия текста HTML. (Я знаю, я знаю, ужасы Google о деиндексации ... но возможно ли это?)

Ответы [ 5 ]

5 голосов
/ 19 марта 2009

+ 1 комментарий Хэнка. Вы очень мало можете получить, делая это. Некоторые настольные браузеры (в том числе IE7 + и Safari) по умолчанию включают сглаживание, даже если оно отключено на уровне ОС, а современные (после XP) ОС в любом случае обычно включают его по умолчанию. Приняв АА к остальным, вы:

(+) немного улучшают отображение для пользователей IE6 и XP + Firefox, которые невольно не имеют AA

(-) замедляет загрузку для всех (но особенно для пользователей ограниченных мобильных устройств)

(-) победить предпочтительные размеры шрифта

(-) излишне раздражает луддитов, которые намеренно отключают сглаживание, потому что оно «размыто» (*)

(*: есть ограниченные случаи, когда это даже имеет смысл, особенно для старых нечетких ЭЛТ-мониторов.)

4 голосов
/ 19 марта 2009

а) Конечно, вы можете использовать обнаружение браузера. Самый простой способ сделать это, вероятно, использовать метод jQuery browser . (jQuery - это потрясающая библиотека JavaScript, которая облегчает большую часть JS-разработки, если вы еще не слышали)

В зависимости от того, какие результаты браузера (или ОС) вы получаете, вы можете представить пользователю различные решения, от обычного текста до чего-то вроде решения Flash.

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

b) На самом деле вы можете создавать сглаженный текст с помощью JavaScript. Взгляните на мой проект Die Stimme Gottes («Голос Бога» - не для брезгливых), например. В этом проекте я использовал для этого превосходный typeface.js .

в) Просто используйте CSS, может быть? 

h1.welcome {
    background: url('the-welcome-image.png') no-repeat;
    color: transparent;

}

0 голосов
/ 20 декабря 2012

Принудительно установить цвет фона, переопределив его для класса или элемента с тем же цветом фона. Это работает. 

span.your_class {
    writing-mode: tb-rl;
    filter: flipv fliph;
    background-color: #006cb8 !important;
}
0 голосов
/ 23 марта 2009

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

1) Используйте изображение. Если вы полагаетесь на SEO для сайта, то непременно добавьте html и скройте его, используя css , используя один из этих методов

2) typeface.js - JS, который будет работать в большинстве современных браузеров. Имеет некоторые ошибки и глюки, но работает хорошо. Если вы собираетесь навязывать пользователям сглаживание, это работает. Используйте экономно. Автор работает над совместимостью с Opera и IE8, хотя ...

2) sIFR - Отличный скрипт, который динамически заменяет выбранные вами области текста флэш-фильмами. Опять некоторые ошибки и глюки, но если вы просто заинтересованы в потрясающе выглядящем шрифте, тогда это идеально. Тем не менее, увеличивает нагрузку на вашу страницу, так как чем больше, тем меньше, используйте экономно.

Я склонен не использовать сложные решения JS, так как мне нравится, когда страницы загружаются молниеносно, но если у вас НУЖНО иметь какие-то красивые шрифты, то это наиболее изящные и простые методы.

0 голосов
/ 19 марта 2009

Flash или Silverlight - ваши лучшие ставки на великолепный рендеринг шрифтов

...