Mozilla Headline

Попробовать Mozilla Headline

Насыщенности и начертания

• ExtraLight 200Mozilla Headline ExtraLight
• Light 300Mozilla Headline Light
• Regular 400Mozilla Headline Regular
• Medium 500Mozilla Headline Medium
• SemiBold 600Mozilla Headline SemiBold
• Bold 700Mozilla Headline Bold

Mozilla Headline — вариативный шрифт: весь диапазон насыщенностей в архиве умещается в одном файле, а названные выше насыщенности — точки в этом диапазоне.

О шрифте Mozilla Headline

Mozilla Headline — семейство шрифтов без засечек для заголовков, в котором несколько букв получили брусковые засечки. На образце у прописных «I» и «J» и строчных «f», «i», «j», «l» и «r» плоские горизонтальные засечки, у прописной «A» на вершине короткий флажок, а нуль перечёркнут, тогда как остальные буквы — простые формы гротеска с ровными штрихами. Mozilla Headline — вариативный шрифт с двумя осями: насыщенность от 200 до 700 и ширина от 75 до 125, где 100 — обычная ширина. Шесть именованных экземпляров идут от ExtraLight до Bold; курсива нет. В файле 491 глиф для латиницы и расширенной латиницы. Авторство семейства приписывается Studio DRAMA, в уведомлении об авторских правах указаны The Mozilla Headline Project Authors. Лицензия — SIL Open Font License 1.1.

Где уместен Mozilla Headline

Главные заголовки веб-страниц

Ось ширины сужает шрифт до 75 для длинного заголовка или расширяет до 125 для нескольких крупных слов.

Фирменный стиль продуктов и кампаний

Брусковые детали у «I», «J», «f» и «r» и «A» с флажком делают короткое название узнаваемым в простом гротесковом наборе.

Технические материалы и контент для разработчиков

Перечёркнутый нуль отличает 0 от буквы O в номерах версий и идентификаторах внутри заголовков.

Заголовки разделов в шести насыщенностях

От ExtraLight до Bold охватываются и тихие подзаголовки, и тёмные главные заголовки.

Глифы

Поддержка языков

В семействе есть основные буквы, которыми пишут на этих языках:

• Английский
• Французский
• Немецкий
• Испанский
• Португальский
• Итальянский
• Нидерландский
• Шведский
• Норвежский
• Датский
• Финский
• Исландский
• Каталанский
• Турецкий
• Польский
• Чешский
• Словацкий
• Венгерский
• Румынский
• Хорватский
• Словенский
• Литовский
• Латышский
• Эстонский

Наборы символов в файлах: latin, latin-ext. Список языков — это проверка наличия нужных букв в шрифте, а не гарантия типографского качества для каждого языка.

Лицензия

Шрифты в пару к Mozilla Headline

Пары подобраны по простым правилам: контрастная классификация и достаточно насыщенностей для основного текста. Это отправная точка, а не окончательный выбор.

Подключение Mozilla Headline на сайте

Скачайте семейство, разместите файлы на своём сайте и подключите их в CSS. Не ссылайтесь на файлы с trendhub.net: здесь лежат урезанные файлы для превью, и их адреса меняются.

@font-face {
  font-family: "Mozilla Headline";
  src: url("/assets/fonts/MozillaHeadline-VariableFont_wdth%2Cwght.ttf") format("truetype");
  font-weight: 200 700;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Mozilla Headline", sans-serif;
}

Или подключите шрифт из официального источника. Google Fonts отдаёт Mozilla Headline с такой разметкой:

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Mozilla+Headline:wght@200..700&display=swap" rel="stylesheet">

Что важно знать

Две оси в одном файле

Насыщенность идёт от 200 до 700, а ширина от 75 до 125, причём 100 — ширина по умолчанию. Обе оси можно задавать независимо.

Файл открывается на ExtraLight

Насыщенность вариативного файла по умолчанию — 200, поэтому её нужно задавать явно в CSS или в программе.

Курсива нет

У Mozilla Headline только прямые начертания.

Только латиница

491 глиф охватывает латиницу и расширенную латиницу. Кириллицы и греческого нет.

Вопросы и ответы

Подборки с Mozilla Headline

• Вариативные шрифты с осью ширины

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

Похожие шрифты

Другие семейства той же классификации, по числу общих тегов назначения. Все шрифты в категории «Гротески»