Как встроить шрифты в HTML?

Я пытаюсь найти достойное решение (особенно со стороны SEO) для встраивания шрифтов в веб-страницы. До сих пор я видел консорциум W3C решение, который даже не работает на Firefox, и Это очень круто решением. Второе решение предназначено только для названий. Есть ли решение для полного текста? Я устал от стандартных шрифтов для веб-страниц.



спасибо!

665   6  

6 ответов:

что изменилось так как этот вопрос был первоначально задан и ответил. Там было проделано большое количество работы по получению кроссбраузерного встраивания шрифтов для основного текста для работы с использованием @ font-face embedding.

Пол Айриш вместе взятый пуленепробиваемый @ font-face синтаксис объединение попыток от нескольких других людей. Если вы действительно пройдете через всю статью (а не только сверху), она позволяет использовать один оператор @font-face для покрытия IE, Firefox, Safari, Opera, Chrome и, возможно, другие. В основном это может кормить OTF, EOT, SVG и WOFF способами, которые ничего не нарушают.

фрагмент из его статьи:

@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot');
  src: local('Graublau Web Regular'), local('Graublau Web'),
    url("GraublauWeb.woff") format("woff"),
    url("GraublauWeb.otf") format("opentype"),
    url("GraublauWeb.svg#grablau") format("svg");
}

работает с этой базой, Шрифт Белочка соберите множество полезных инструментов, включая @font-face Generator который позволяет загружать файл TTF или OTF и получать автоматически конвертируемые файлы шрифтов для других типов, а также предварительно построенный CSS и демо HTML-страница. Шрифт белка также имеет сотни @ font-face kits.

сома дизайн также собрать FontFriend Букмарклет, которая меняет шрифты на странице, на лету, так что вы можете попробовать. Он включает в себя поддержку перетаскивания @font-face в FireFox 3.6+.

совсем недавно Google начал предоставлять Google Web Fonts, ассортимент шрифтов, доступных под лицензией с открытым исходным кодом и обслуживаемых от Google сервера.

Лицензионные Ограничения

наконец, WebFonts.info собрал хороший wiki'D список шрифты доступны для встраивания @font-face на основе лицензии. Он не претендует на исчерпывающий список, но шрифты на нем должны быть доступны (возможно, с такими условиями, как атрибуция в файле CSS) для встраивания/связывания. важно прочитать лицензии, потому что есть некоторые ограничения, которые не толкнул вперед, очевидно, на загрузку шрифтов.

127  
2011-03-28 08:57:45

попробовать Facetype.js, вам превратить вашу .Шрифт TTF в файл Javascript. Полная SEO совместимость, поддерживает FF, IE6 и Safari и изящно деградирует в других браузерах.

9  
2017-11-03 20:35:34

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

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

я справляюсь с sIFR для типа отображения (заголовки, заголовки сообщений в блоге и т. д.) и использование одного из менее изношенных веб-безопасных шрифтов для типа тела (например, Trebuchet MS). Если вам надоели все веб-безопасные шрифты, вы, вероятно, определяете термин слишком узко-посмотрите на эта матрица фондовых шрифтов этот корабль с основными ОС и скорее всего, вы сможете найти каскад шрифтов, который будет ловить почти всех веб-пользователей.

например: font-family: "Lucida Grande", "Verdana", sans-serif является общим каскадом шрифтов; OS X поставляется с Lucida Grande, но те, у кого есть Windows, получат Verdana, веб-безопасный шрифт с буквами аналогичного размера и формы для Lucida Grande. Пользователи Linux также будет Verdana если они установили пакет веб-безопасных шрифтов, который существует в менеджерах пакетов большинства дистрибутивов, иначе они вернутся к обычному sans-serif.

6  
2008-10-21 02:17:32

и это тоже маловероятно - EOT является довольно ограничительным форматом, который поддерживается только IE. Как Safari 3.1, так и Firefox 3.1 (ну текущая альфа) и, возможно, Opera 9.6 поддерживают встраивание шрифта true type (ttf), и, по крайней мере, Safari поддерживает шрифты SVG через тот же механизм. Список отдельно было хорошее обсуждение об этом некоторое время назад.

4  
2008-10-21 02:06:55

проверить Typekit, коммерческий вариант (у них также есть бесплатный пакет).

Он использует различные методы в зависимости от того, какой браузер используется (@font-face и EOT формат), и они заботятся обо всех вопросах лицензирования шрифтов для вас также. Он поддерживает все, вплоть до IE6.

вот еще немного информации о том, как Typekit работает:

3  
2009-12-28 00:35:35

Я задал этот некоторое время назад. Ответ в основном заключается в том, что это не работает. : (

2  
2017-05-23 13:31:31

Comments

    Ничего не найдено.
Click here to cancel reply.