Шрифты для сайта — что может быть не так?
Какой-то шрифт может быть доступен не для всех. А это означает, что могут проблемы. Вы довольны тем, что выбрали красивые шрифты для сайта, а посетитель веб-страницы видит вместо них безобразную писанину.
Такого не случится, если реализовать резервный вариант.
Насколько важно применение безопасных веб-шрифтов?
У каждого устройства есть собственный набор предустановленных шрифтов. Какой именно, зависит от операционной системы. Беда в том, что между ними есть небольшие различия.
А сайты? Например, этот? Шрифт, который видите вы, может быть вовсе не тем, который изначально прописан для сайта.
Что это значит? Допустим, что дизайнер выбрал для сайта какое-то семейство платных шрифтов. Если у вас они не установлены и не предоставляется специальным веб-сервисом, то шрифт, который вы видите, — один из стандартных вариантов. Например, Times New Roman.
Поэтому как на вашем экране текст может выглядеть просто ужасно.
А вот стандартные шрифты для сайта есть во всех операционных системах. Это небольшая коллекция, доступная в Windows, Mac, , а также Unix и Linux.
С помощью этой подборки дизайнеры, а также владельцы сайтов могут указать, какой именно шрифт следует применить в качестве резервного. Таким образом, появляется возможность контроля над тем, как будет выглядеть страница на разных устройствах.
В качестве запасного варианта разработчик подбирает шрифт, очень похожий на оригинальный, и именно он будет продемонстрирован пользователю.
Взглянем на подборку, в которой собраны стандартные шрифты HTML.
Самые популярные шрифты для веб-страниц
Arial
Считается стандартным в большинстве случаев. Самый распространенный из шрифтов «sans serif» или рубленых шрифтов (у которых нет засечек на кончиках букв). Его часто используют в Windows для замены других литер.
Helvetica
Helvetica — палочка-выручалочка для дизайнеров. Этот стандартный веб шрифт работает практически всегда (по крайней мере, в качестве подстраховки для других шрифтов).
Times New Roman
Выполняет ту же роль для шрифтов с засечками, что и Arial для тех, что без засечек. Он является одним из самых популярных на Windows-устройствах. Это обновленная версия старого шрифта Times.
Times
Стандартный шрифт CSS Times знаком большинству. Многим он запомнился по маленьким буквам в узких колонках старых газет. Самый обычный, ставший традицией, вид печати.
Courier New
Похож на Times New Roman и применяется в качестве разновидности старой классики. Он также считается моноширинным шрифтом. В отличие от шрифтов с засечками и без, все его знаки имеют одинаковую ширину.
Courier
Старый шрифт фиксированной ширины, который используется в качестве резервного почти на всех устройствах и операционных системах.
Verdana
Verdana может по праву считаться истинным веб-шрифтом (true web font) благодаря простым линиям, выступающим в роли засечек, а также большому размеру. Его буквы слегка вытянуты, поэтому легко читаются на экране.
Georgia
Стандартный web шрифт Georgia формой и размером напоминает шрифт Verdana. Его знаки больше, чем у других шрифтов того же размера. Но лучше не применять его в паре с другими. Тот же Times New Roman, по сравнению с ним выглядит словно карлик.
Palatino
Palatino относится к эпохе ренессанса. Никаких шуток. Это еще один крупный шрифт, который идеально подходит для интернета. Обычно он используется в заголовках и рекламе.
Garamond
Еще один старинный шрифт, который появился еще в 16 веке в Париже. Его новая и улучшенная версия входит в комплект стандартных в большинстве Windows-устройств. Позже данный шрифт был взят на вооружение и другими операционными системами.
Bookman
Bookman (или Bookman Old Style) — один из лучших стандартных шрифтов для заголовков. Его характерная черта — удобочитаемость даже при использовании маленького размера.
Comic Sans MS — забавная альтернатива для шрифтов с засечками.
Trebuchet MS
Это шрифт средневековой тематики, изначально разработанный корпорацией Microsoft в середине девяностых годов. Он применялся в Windows XP. Сегодня с его помощью составляют основной текст.
Arial Black
Аналог стандартного шрифта для сайта Arial. Правда, он больше, толще и жестче. Своими пропорциями он похож на шрифт Helvetica
А это важно. Им можно успешно заменить Helvetica без необходимости покупать лицензию
Impact
Еще один замечательный шрифт для выделения заголовков. Он хорошо смотрится в короткой фразе, состоящей из нескольких слов, а также в длинных предложениях.
Информация о шрифте Arial Black
Полное название шрифта
Arial Black Regular 400
Семейство
Начертание шрифта
Regular (Обычный)
Насыщенность шрифта
400 — нормальное (Normal)
Версия шрифта
Version 2.20
Идентификатор шрифта
Monotype — Arial Black Regular
PostScript название шрифта
Arial-Black
Авторское право на шрифт
Digitized data copyright The Monotype Corporation 1991-1995. All rights reserved. Arial is a trademark of The Monotype Corporation which may be registered in certain jurisdictions.
Поддержка символов
латинские буквы, русские буквы (кириллица), цифры, знаки препинания и пунктуации
Регистр букв шрифта
верхний (прописные буквы) и нижний (строчные буквы)
Категории шрифта Arial Black
Бесплатные шрифты, Кириллические шрифты, Латинские шрифты, Русские шрифты, Шрифты без засечек
Предварительный просмотр Arial Black
Шрифт Arial Black с поддержкой латиницы
Предварительный просмотр шрифта «Arial Black» с прописными и строчными латинскими буквами (английский алфавит A-Z и a-z).
Шрифт Arial Black с поддержкой кириллицы
Предварительный просмотр шрифта «Arial Black» с прописными и строчными русскими буквами (кириллица, русский алфавит А-Я и а-я).
Шрифт Arial Black с поддержкой цифр
Предварительный просмотр шрифта «Arial Black» с цифрами (0 1 2 3 4 5 6 7 8 9).
Шрифт Arial Black с поддержкой знаков препинания и пунктуации
Предварительный просмотр шрифта «Arial Black» со знаками препинания и пунктуации (, . / ? ; ‘ : » { } \ | ` ~ ! @ # $ % ^ & * ( ) — _ + =).
Скачать шрифт Arial Black
Шрифт Arial Black доступен для скачивания в 6 форматах: EOT, OTF, SVG, TTF, WOFF, WOFF2 (IE9 в режиме совместимости, IE6-IE8, Open Type Font, устаревшая iOS, Safari, Android, iOS и любой современный браузер).Внимание! Скачать шрифт Arial Black возможно только для некоммерческого использования!
Подробная инструкция по скачиванию шрифтов в статье «Как скачать шрифт на сайте»
Как установить шрифт Arial Black на сайт
Для установки шрифта «Arial Black» на сайт необходимо скопировать все файлы шрифта в папку, например, «fonts/arial-black». В файле стилей подключить шрифт, используя конструкцию CSS:
Скопировать в буфер обмена
@font-face { font-family: "Arial Black"; src: url("../fonts/arial-black/arial-black.eot"); /* IE9 Compat Modes */ src: url("../fonts/arial-black/arial-black.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */ url("../fonts/arial-black/arial-black.otf") format("opentype"), /* Open Type Font */ url("../fonts/arial-black/arial-black.svg") format("svg"), /* Legacy iOS */ url("../fonts/arial-black/arial-black.ttf") format("truetype"), /* Safari, Android, iOS */ url("../fonts/arial-black/arial-black.woff") format("woff"), /* Modern Browsers */ url("../fonts/arial-black/arial-black.woff2") format("woff2"); /* Modern Browsers */ font-weight: normal; font-style: normal; }
Установить шрифт «Arial Black» для требуемого текста, поля, кнопки или другого элемента на сайте:
font-family: "Arial Black";
Пример применения шрифта «Arial Black»:
body { font-family: "Arial Black"; font-size: 1rem; font-weight: normal; line-height: 1.2; color: #000; background-color: #fff; }
Шрифты, похожие на «Arial Black»
Decor
- Семейство: Decor
- Начертание: Regular
- Насыщенность: 400
- Версия: Converted from t:\DECOR.TF1 by ALLTYPE
KremlinCTT
- Семейство: KremlinCTT
- Начертание: Regular
- Насыщенность: 400
- Версия: 1.0 Fri Mar 17 10:59:53 1995
Antikvarika
- Семейство: Antikvarika
- Начертание: Regular
- Насыщенность: 400
- Версия: Version 1.000 2009 initial release
Chicago Plain:001.001
- Семейство: Chicago :001.001
- Начертание: Regular
- Насыщенность: 400
- Версия: 001.001
Lato Heavy
- Семейство: Lato Family
- Начертание: Regular
- Насыщенность: 400
- Версия: Version 2.010; 2014-09-01; http://www.latofonts.com/
Arial Black Fonts
Arial Black Font Info
Total Downloads 66594
Package : Arial Black
Style : Regular
Version : 5.06
TAG’s :
Author : Robin Nicholas, Patricia Saunders
Size : 117.07 KB
Company : Monotype Typography, Inc.
Update : October 1, 2016, 1:40 pm
@font-face
Copyright
Explanation
Trademark
License
#1 Add to the head section of web page.
<link href=»//db.onlinewebfonts.com/c/8984ea7fcbebdcfe77fbbc1b86e7cfe6?family=Arial+Black» rel=»stylesheet» type=»text/css»/>
#2 Using @import CSS directive, put the following line in add to your css file.(http | https)
@import url(//db.onlinewebfonts.com/c/8984ea7fcbebdcfe77fbbc1b86e7cfe6?family=Arial+Black);
#3 Use font-face declaration Fonts.(http | https)
@font-face {font-family: «Arial Black»;
src: url(«//db.onlinewebfonts.com/t/8984ea7fcbebdcfe77fbbc1b86e7cfe6.eot»);
src: url(«//db.onlinewebfonts.com/t/8984ea7fcbebdcfe77fbbc1b86e7cfe6.eot?#iefix») format(«embedded-opentype»),
url(«//db.onlinewebfonts.com/t/8984ea7fcbebdcfe77fbbc1b86e7cfe6.woff2») format(«woff2»),
url(«//db.onlinewebfonts.com/t/8984ea7fcbebdcfe77fbbc1b86e7cfe6.woff») format(«woff»),
url(«//db.onlinewebfonts.com/t/8984ea7fcbebdcfe77fbbc1b86e7cfe6.ttf») format(«truetype»),
url(«//db.onlinewebfonts.com/t/8984ea7fcbebdcfe77fbbc1b86e7cfe6.svg#Arial Black») format(«svg»);
}
2008 The Monotype Corporation. All Rights Reserved.
Monotype Drawing Office 1982. A contemporary sans serif design, Arial contains more humanist characteristics than many of its predecessors and as such is more in tune with the mood of the last decades of the twentieth century. The overall treatment of curves is softer and fuller than in most industrial-style sans serif faces. Terminal strokes are cut on the diagonal which helps to give the face a less mechanical appearance. Arial is an extremely versatile family of typefaces which can be used with equal success for text setting in reports, presentations, magazines etc, and for display use in newspapers, advertising and promotions.
Arial is a trademark of The Monotype Corporation in the United States and/or other countries.
NOTIFICATION OF LICENSE AGREEMENTThis typeface is the property of Monotype Typography and its use by you is covered under the terms of a license agreement. You have obtained this typeface software either directly from Monotype or together with software distributed by one of Monotype s licensees.This software is a valuable asset of Monotype. Unless you have entered into a specific license agreement granting you additional rights, your use of this software is limited to your workstation for your own publishing use. You may not copy or distribute this software.If you have any question concerning your rights you should review the license agreement you received with the software or contact Monotype for a copy of the license agreement.Monotype can be contacted at:USA 847-718-0400 UK 44(0)1737 765959For license terms and usage rights, please visit our web site at www.monotype.com/html/type/license.html Lizenzbedingungen und Nutzungsrechte finden Sie auf unserer Webseite www.monotype.com/html/type/license.htmlPour plus d’informations concernant les droits d’utilisation et les questions contractuelles, veuillez consultez notre site www.monotype.com/html/type/license.htmlPara obtener informacin acerca de los trminos de licencia y los derechos de uso, visite nuestro sitio en el Web en www.monotype.com/html/type/license.htmlPer le condizioni contrattuali ed i diritti d’uso, visitate il nostro sito web all’indirizzo www.monotype.com/html/type/license.html
Download Format
download
demo
Arial Black Font Screenshots
The latest addition icons
More…
The latest addition fonts
More…
-
Tusch Touch W01 4
Style : Regular -
BRIGADA RAMONA PARRA
Style : Regular -
Grandecort W01 Bold
Style : Regular -
SF Juggernaut Bold V2 V2
Style : Bold -
Restore W00 Bold
Style : Regular -
Long Tall Sally EEN Plain
Style : Plain -
Nightbird Condensed W00 Rg
Style : Regular -
Goudy MT W01 Bold
Style : Regular -
HeberlingCasualNF Bold
Style : Bold