Fira Sans Condensed

Попробовать Fira Sans Condensed

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

• Thin 100Fira Sans Condensed Thin Thin Italic
• ExtraLight 200Fira Sans Condensed ExtraLight ExtraLight Italic
• Light 300Fira Sans Condensed Light Light Italic
• Regular 400Fira Sans Condensed Regular Курсив
• Medium 500Fira Sans Condensed Medium Medium Italic
• SemiBold 600Fira Sans Condensed SemiBold SemiBold Italic
• Bold 700Fira Sans Condensed Bold Bold Italic
• ExtraBold 800Fira Sans Condensed ExtraBold ExtraBold Italic
• Black 900Fira Sans Condensed Black Black Italic

О шрифте Fira Sans Condensed

Fira Sans Condensed — узкий гротеск, одна из трёх ширин семейства Fira. Семейство создавали под характер Mozilla FirefoxOS, чтобы шрифт оставался читаемым на телефонах с очень разным качеством экрана. На образце буквы сжаты, но раскрытия у «a», «c», «e» и «s» остаются открытыми, строчные высокие, а в жирных насыщенностях внутрибуквенные просветы не заплывают. Девять насыщенностей, от Thin 100 до Black 900, имеют курсивы, что даёт 18 начертаний в виде статических файлов; вариативной версии нет. В каждом файле 2 677 глифов для латиницы, расширенной латиницы, кириллицы, греческого и вьетнамского. Проект ведёт берлинская словолитня Carrois, а авторские права принадлежат The Mozilla Foundation и Telefonica S.A. Шрифт выпускается под SIL Open Font License 1.1.

Где уместен Fira Sans Condensed

Мобильные интерфейсы

Шрифт рассчитан на читаемость на экранах телефонов, а узкая ширина позволяет уместить длинные подписи в тесных макетах.

Плотные таблицы и списки

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

Заголовки на нескольких письменностях

Латиница, кириллица и греческий построены в одинаковых узких пропорциях, поэтому переведённые заголовки не меняют длину строки.

Навигация и фильтры

Medium и SemiBold отмечают активный пункт, почти не расширяя подпись.

Длинный текст в узких колонках

Открытые раскрытия сохраняют читаемость слов там, где боковая панель или карточка оставляют мало места.

Глифы

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

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

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

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

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

Лицензия

Шрифты в пару к Fira Sans Condensed

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

Подключение Fira Sans Condensed на сайте

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

@font-face {
  font-family: "Fira Sans Condensed";
  src: url("/assets/fonts/FiraSansCondensed-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fira Sans Condensed";
  src: url("/assets/fonts/FiraSansCondensed-BlackItalic.ttf") format("truetype");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Fira Sans Condensed";
  src: url("/assets/fonts/FiraSansCondensed-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fira Sans Condensed";
  src: url("/assets/fonts/FiraSansCondensed-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
/* …and 14 more files in the package, declared the same way */

body {
  font-family: "Fira Sans Condensed", sans-serif;
}

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

<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=Fira+Sans+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">

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

Восемнадцать статических файлов

Каждая насыщенность и каждый курсив — отдельный файл TTF; вариативной версии в архиве нет.

Одна из трёх ширин

В официальных заметках описаны три ширины Fira, все с курсивами, и ещё моноширинный вариант.

Тот же набор символов, что у Fira Sans

В каждом узком шрифте 2 677 глифов — столько же, сколько в файлах Fira Sans обычной ширины.

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

Подборки с Fira Sans Condensed

• Узкие гротески для таблиц и плотной вёрстки

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

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

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