Какие шрифты используются на сайтах или безопасные шрифты браузеров
Hoster ср, 17/11/2010 - 16:51
Ниже вы найдете список со стандартным набором шрифтов для всех версий Windows и их аналоги для Mac’ов. Эти шрифты иногда называют “безопасные шрифты браузеров”. Этот список шрифтов я используя при создании веб страниц и я думаю вы тоже найдете его полезным.
Если вы новичок в веб разработке, то возможно вы подумаете: “Зачем я должен ограничивать себя таким маленьким набором шрифтов? Ведь у меня большая коллекция красивых шрифтов на компьютере”. Более опытные дизайнеры знают, что браузер может отображать только те шрифты, которые установлены на компьютере на котором просматривается страница. Это означает, что каждый посетитель вашей страницы обязан иметь на своем компьютере те шрифты, которые вы хотите использовать. Безусловно, у разных людей установлен разный набор шрифтов, и поэтому возникает потребность в стандартном наборе шрифтов. К счастью, CSS позволяет установить несколько значений для свойства font-family, что немного упрощает задание.
Если вы хотите узнать как эти шрифты отображаются в других операционных системах или браузерах, то после таблицы с шрифтами представлены скриншоты этой таблицы под разными ОС и браузерами. Также вы можете взглянуть на список дефолтных шрифтов включенных в состав каждой версии Windows.
Список
- Серым цветом выделено семейство каждого шрифта.
- В некоторых случаях эквивалентом для Mac’ов будет являться тот же шрифт, так как Mac OS X также включает некоторые из шрифтов поставляемых с Windows.
- Сноски снизу содержат специфическую информацию о некоторых шрифтах.
- В скобках добавлено написание шрифта по -русски
| Arial, Arial, Helvetica, sans-serif |
| Arial Black (АБВГДЕЖЗИКЛМНОПРСТ), Arial Black, Gadget, sans-serif |
| Comic Sans MS (абвгдежзиклмнопрст), Comic Sans MS5, cursive |
| Courier New (абвгдежзиклмнопрст), Courier New, Courier6, monospace |
| Georgia1 (абвгдежзиклмнопрст), Georgia, serif |
| Impact (абвгдежзиклмнопрст), Impact5, Charcoal6, sans-serif |
| Lucida Console (абвгдежзиклмнопрст), Monaco5, monospace |
| Lucida Sans Unicode (абвгдежзиклмнопрст), Lucida Grande, sans-serif |
| Palatino Linotype (абвгдежзиклмнопрст), Book Antiqua3, Palatino6, serif |
| Tahoma (абвгдежзиклмнопрст), Geneva, sans-serif |
| Times New Roman (абвгдежзиклмнопрст), Times, serif |
| Trebuchet MS1 (абвгдежзиклмнопрст), Helvetica, sans-serif |
| Verdana (абвгдежзиклмнопрст), Verdana, Geneva, sans-serif |
| Symbol (абвгдежзиклмнопрст), Symbol (Symbol2, Symbol2) |
| Webdings (абвгдежзиклмнопрст), Webdings (Webdings2, Webdings2) |
| Wingdings (абвгдежзиклмнопрст), Zapf Dingbats (Wingdings2, Zapf Dingbats2) |
| MS Sans Serif4 (абвгдежзиклмнопрст), Geneva, sans-serif |
| MS Serif4 (абвгдежзиклмнопрст), New York6, serif |
1 Georgia и Trebuchet MS идут в комплекте с Windows 2000/XP и они также включены в набор шрифтов IE (а также идут в комплекте с прочим софтом от Microsoft), поэтому они вполне совместимы с Windows 98.
2 Символические шрифты отображаются только в Internet Explorer’е, а в других браузерах используются заменители этих шрифтов (также шрифт Symbol не работает в Opera, а Webdings работает в Safari).
3 Book Antiqua – практически идентичен Palatino Linotype. Palatino Linotype включен в состав Windows 2000/XP, в то время как Book Antiqua входит в состав Windows 98.
4 Эти шрифты не TrueType, они битмеповые (bitmap), поэтому они будут хорошо выглядеть только при определенных размерах шрифта (они приспособлены для размеров 8, 10, 12, 14, 18 и 24 pt при 96 DPI).
5 Эти шрифты работают в Safari, но только при условии, что font-style будет иметь значение normal, а не bold или italic. У остальных браузеров под Mac OS не было замечено проблемы с отображением шрифтов с нестандартным стилем (за эту подсказку благодарим Christian’а Fecteau).
6 Эти шрифты присутствуют в Mac OS X только если установлен Classic (чесно говоря не имею понятия что такое Classic; возможно имелась ввиду стандартная установка Mac OS X).
Оригинал статьи содержит вторую половину таблицы, в которой отображены шрифты полужирными буквами. Не стал ее перепечатывать из эстетических соображений – вторая колонка просто не влезла бы.
Как выглядят шрифты в разных операционных системах и в разных браузерах
- Mac OS X 10.4.8, Firefox 2.0, ClearType включен (что такое ClearType) (за скриншот спасибо Juris’у Vecvanags’у)
- Mac OS X 10.4.4, Firefox 1.5, ClearType включен (за скриншот спасибо Eric’у Zavesky)
- Mac OS X 10.4.4, Safari 2.0.3, ClearType включен (за скриншот спасибо Eric’у Zavesky)
- Windows Vista, Internet Explorer 7, ClearType включен (за скриншот спасибо Michiel’ю Bijl’у)
- Windows Vista, Firefox 2.0, ClearType включен (за скриншот спасибо Michiel’ю Bijl’у)
- Windows XP, Internet Explorer 6, ClearType включен
- Windows XP, Firefox 1.0.7, ClearType включен
- Windows XP, Internet Explorer 6, базовое сглаживание шрифта включено
- Windows XP, Firefox 1.0.7, базовое сглаживание шрифта включено
- Windows 2000, Internet Explorer 6, базовое сглаживание шрифта включено
- Windows 2000, Firefox 1.0.7, базовое сглаживание шрифта включено
- Linux (Ubuntu 7.04 + Gnome), Firefox 2.0 (за скриншот спасибо Juris’у Vecvanags’у)
Помните, что в то время как сглаживание ClearType всегда включено, базовое сглаживание шрифта в Windows 98/2000/XP работает только при определенных размерах шрифта. Эти размеры могут быть заданы разработчиком шрифта, но чаще всего эти размеры находятся в пределах 0-6 и после 14 pt.
Статья скопипастена отсюда в целях безопасности (ну, чтоб не было, как сегодня: полез по прошлогодним закладкам, а половина уже не работает)
Комментировать