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

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

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


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

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

Ответов (10)

Решение

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

Вы можете сделать это с помощью нового @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, при условии, что вы аккуратно перейдете на широко доступный шрифт. Например:

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

Собственно в том-то и дело!

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

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

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

Что ж ... Можно, если вы знаете, как он будет отображаться в операционных системах, отличных от Vista / Windows.

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

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

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

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

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

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

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

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

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

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

Note that a responsible web developer does not use fonts that are only available on Windows (and especially ones that are only available on Vista), nor do they use a technology that isn't supported by at least the majority of browsers.

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

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

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

Verdana, Arial, Helvetica, sans-serif

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

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

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

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

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

Gill Sans

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

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

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