Шрифты в Интернете

Safari и в меньшей степени Firefox 3 поддерживают @font-face в CSS, что позволяет использовать пользовательские шрифты. Однако для распространения файлов шрифтов вам необходимо иметь соответствующую лицензию. Эти статьи объясняют это более подробно:

• http://www.css3.info/preview/web-fonts-with-font-face/
• http://www.alistapart.com/articles/cssatten
• http://www.sitepoint.com/blogs/2008/07/30/custom-web-fonts-pick-your-poison/

Это своевременная тема; мы перешли на Arial, потому что Calibri WAY мал по сравнению со всеми другими резервными шрифтами! Мне было очень больно переключаться на (кляп) Ариал, потому что это дерьмовая копия Helvetica:

http://www.ms-studio.com/articles.html

Трудности с определением размера (слишком большой, если вы используете шрифт "c" в качестве стандартного; слишком маленький, если вы используете что-то обычное) подробно описаны здесь:

http://neosmart.net/blog/2006/css-vistas-new-fonts/

Мне будет очень не хватать красивой ручной настройки RGB aliasing Calibri, но было просто невозможно обеспечить хороший опыт для большинства пользователей, не требуя установки Calibri. Он достаточно распространен, так как поставляется с Office 2007 (Win/Mac) и, конечно же, Vista.. но она далеко не универсальна, поэтому было бы немного безответственно полагаться на нее для глобальной веб-аудитории.

Вы, конечно, можете использовать SIFR .

Это изящно ухудшается в браузерах, которые не поддерживают его и доступны.

Он не очень подходит для использования с большим количеством текста, но для заголовков и выделения текста он идеально подходит.

Конечно, это работа вокруг внутреннего ограничения браузеров и интернета в настоящее время, но когда это было не так для большинства веб-технологий и методов.

Вы можете сделать это с помощью нового объявления @font-face , доступного в CSS3. Он также имеет очень хорошую поддержку функции CSS3 (т. е. начиная с IE4).

Общий синтаксис таков:

@font-face {
    src: url('path to your font') format('woff|ttf|svg|eot|…');
    font-family: the name to use;
    font-weight: an optional weight;
    font-style: an optional style;
}

Есть также генератор , который преобразует шрифт в несколько форматов и создает соответствующий CSS.

В настоящее время я бы рекомендовал предоставить только файл WOFF; это удобно, легко создать .

Кроме того, не забудьте указать имя формата (например, format('woff') ); в противном случае он не будет работать на Firefox.

Обратите внимание, что ответственный веб-разработчик не использует шрифты, которые только доступно на Windows (и особенно те, которые доступны только на Vista), и они не используют технологию, которая не поддерживается по крайней мере большинство браузеров.

Нет ничего плохого или неправильного в использовании шрифтов Windows/Vista-specific при условии, что вы изящно деградируете до широко доступного шрифта. Например:

font-family: Calibri, Tahoma, Helvetica, Sans-Serif;

На самом деле в этом-то все и дело!

IE поддерживает @font-face (это началось как их собственная технология в MS Word). Вот сообщение в блоге от команды IE об этом примерно месяц назад .

Обратите внимание, что ответственный веб-разработчик не использует шрифты, доступные только на Windows (и особенно те, которые доступны только на Vista), а также не использует технологию, которая не поддерживается по крайней мере большинством браузеров.

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

Нет ничего плохого в том, чтобы предлагать шрифты в вашем CSS, которых нет у некоторых пользователей; они просто видят что-то отличное от вас. По-другому не сломается. Они даже не будут удивляться, почему вы используете шрифты по умолчанию, потому что они не будут знать, что другие люди видят что-то другое.

В этом весь смысл наборов шрифтов:

Verdana, Arial, Helvetica, sans-serif

Это хорошая практика именно потому, что она признает, что люди будут видеть разные вещи.

Это тоже хорошая практика:

Gill Sans, Verdana, Arial, Helvetica, sans-serif

Так что у большинства людей нет жабр – какая разница? Они получают совершенно хороший сайт независимо от этого.

И это тоже было бы хорошо, но немного странно и лениво:

Gill Sans

Безответственный веб-дизайн делает такие вещи, как установка текста в виде изображений без использования alt-текста, не используя интересные шрифты в наборах шрифтов.

CSS2 предлагает:

@font-face {
    font-family: Garamond;
    src: url(garamond.eot), url(garamond.pfr);
}

Обратите внимание, что ответственный веб-разработчик не использует шрифты, доступные только на Windows (и особенно те, которые доступны только на Vista), а также не использует технологию, которая не поддерживается по крайней мере большинством браузеров.

Ну ... вы можете, если знаете, как это будет выглядеть на non-Vista/non-Windows OS.

В противном случае: да, @font-face в CSS2 является лучшей стандартной альтернативой, даже если она не пользуется широкой поддержкой.

Я бы предположил, что любой способ отправки шрифтов с веб-страницей будет представлять некоторый риск для безопасности. Я слышал о методах, где в случае, если у клиента нет необходимого шрифта, текст может быть динамически заменен изображением или каким-то отображаемым символом a flash. Единственное подобное устройство, которое я могу найти сейчас, находится в AListApart , но оно уже может быть избыточным. Этот метод также потребует css, images и javascript для работы и может быть болезненным для реализации в разных браузерах.