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

Коллекция шрифтов, доступных веб-разработчику, удручающе ограничена. Я давно помню про TrueDoc, как способ доставки шрифтов рядом с веб-сайтом, но, похоже, он томился. Кто-нибудь использовал это или что-то подобное? Поддерживается ли это достаточным количеством браузеров? Не хватает ли хорошего решения?

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


Обновление:. Как отметили несколько человек, нет ничего плохого в предоставлении списка резервных шрифтов для людей, у которых нет определенного шрифта, который вы используете. Я на самом деле всегда делаю это, и не хотел предполагать, что это было неправильно.

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

Ответ 1

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

Ответ 2

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

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

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

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

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

Ответ 3

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

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

Он не подходит для использования на загрузках текста, но для заголовков и выделения текста он идеален.

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

Ответ 4

Вы можете сделать это с новым @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 в противном случае.

Ответ 5

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

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

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

Действительно, вся точка!

Ответ 6

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

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

Ответ 8

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

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

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

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

Verdana, Arial, Helvetica, sans-serif

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

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

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

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

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

Gill Sans

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

Ответ 9

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

Ну... Вы можете, если вы знаете, как это будет отображаться на ОС, отличной от Vista/не Windows.

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

Ответ 10

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