Что такое хорошие шрифты веб-разработки?

Я ищу список шрифтов, которые я могу использовать в CSS. Поскольку эти шрифты могут быть защищены авторским правом, какие шрифты следует использовать, которые доступны в Windows (с XP), Mac OS X и, скажем, Ubuntu 8.04?

Я не хочу полагаться исключительно на новые ОС.

Отличным бонусом было бы, если бы на мобильных устройствах существовали одни и те же шрифты.

Ответы

Ответ 3

Единственный 100% -ый безопасный способ объявить шрифты - использовать дженерики в качестве спада.

Дженерики:

  • 'serif' (например, Times)
  • 'sans-serif' (например, Helvetica)
  • 'cursive' (например, Zapf-Chancery)
  • "фантазия" (например, западная) (wtf?)
  • 'monospace' (например, Courier)

Из W3C

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

Шрифты, такие как Arial и Verdana, которые многие веб-дизайнеры считают само собой разумеющимися, могут отсутствовать в браузерах Linux (даже firefox на centOS из опыта). Apple имеет большинство шрифтов Microsoft, но некоторые из них отсутствуют.

Ответ 4

Typetester!

Особенности:

  • сравнить шрифты бок о бок;
  • выберите из списка безопасных шрифтов, выберете шрифты или матовые шрифты;
  • все из браузера.

Ответ 5

Просто помните: друзья не позволяют друзьям использовать Comic Sans.

(Серьезно, у вас уже есть хорошие ответы...).

Ответ 6

Вердана - хорошая.

Ответ 7

Вот руководство...

http://www.ampsoft.net/webdesign-l/WindowsMacFonts.html

Что касается мобильного телефона, все, что я могу сказать, это удача! Моя дочь получила мою Blackberry от меня пять минут и изменила мой фон, мелодию звонка, и теперь все мои шрифты - это мультяшные шрифты.

Вот список iPhone-шрифтов, но он может быть немного устаревшим. http://daringfireball.net/misc/2007/07/iphone-osx-fonts

Ответ 8

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

Если вы являетесь приверженцем типографики, к сожалению, до тех пор, пока не удалятся шрифты CSS3, вам придется жить с обслуживанием всех хороших шрифтов для ваших пользователей Mac, поскольку Mac OS X имеет гораздо больший набор великолепных шрифтов установленный, чем Windows. Я немного разочарован, когда загружаю свои сайты в Windows, и меня встречает куча жестких, сшитых шрифтов.

Ответ 9

Вы можете использовать sIFR для заголовков и вообще не беспокоиться о веб-безопасных шрифтах. Взгляните на страницу . Это довольно удивительно.

Ответ 10

Arial - мой "безопасный" шрифт, который я использую все время.

Но я недавно использовал Trebuchet. Это достаточно распространено, что практически все будут иметь его. В наши дни он использовался повсюду в StackOverflow, FeedBurner и многих других популярных сайтах.

Но, на всякий случай, если у пользователя этого нет, я бы использовал CSS как это (как и у StackOverflow)...

font-family:Trebuchet MS,Helvetica,sans-serif;

Ответ 11

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

  • WebINK - больше не предлагается
  • Веб-шрифты Google
  • TypeKit
  • Fonts.com

Все эти услуги предоставляют тысячи высококачественных шрифтов. Шрифты Google абсолютно бесплатны. WebINK и TypeKit требуют модели подписки. Я никогда не пользовался fonts.com, но у них, вероятно, есть аналогичная модель.

Ответ 12

Вот хорошая статья о шрифты для Интернета.

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

Ответ 13

Несмотря на то, что такой список полезен, вы также должны воспользоваться резервным механизмом CSS. Например, вы можете перечислить Consolas, Courier New, monospace в свой атрибут font-family и получить наилучшее совпадение на этом устройстве.

Последний элемент в каждом списке семейств шрифтов должен быть нейтральным, например, "без засечек", "засечками", "моношириной" и т.д.

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

См., например, руководство w3.org

Ответ 14

Вы довольно хороши с Helvetica/Arial (да, я знаю, есть разница!) или Verdana для sans-serif или Georgia или Times для засечек. В вашем css вы можете просто поместить список в свой предпочтительный порядок. Вы должны всегда заканчивать родовое семейство шрифтов, чтобы охватить все ваши базы.

Мои сайты обычно выглядят примерно так:

font-family: Helvetica, Arial, sans-serif;
font-family: Georgia, serif;

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