Encode Sans

Попробовать Encode Sans

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

• Thin 100Encode Sans Thin
• ExtraLight 200Encode Sans ExtraLight
• Light 300Encode Sans Light
• Regular 400Encode Sans Regular
• Medium 500Encode Sans Medium
• SemiBold 600Encode Sans SemiBold
• Bold 700Encode Sans Bold
• ExtraBold 800Encode Sans ExtraBold
• Black 900Encode Sans Black

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

О шрифте Encode Sans

Encode Sans — семейство гротеска, в котором простые открытые формы букв сочетаются с округлыми знаками, чьи бока отчасти выпрямлены. Это видно по «o», «c» и «e» и по ровным штрихам, которые идут от волосяного Thin до тяжёлого Black. Семейство — вариативный шрифт в одном файле с двумя осями: насыщенность, от 100 до 900, и ширина, от 75 до 125, то есть от узких пропорций до широких. Определены девять именованных насыщенностей, от Thin до Black; курсива нет. В шрифте 1 200 глифов для латиницы, расширенной латиницы и вьетнамского. По официальным заметкам, первоначальный рисунок сделали Pablo Impallari и Andres Torresi, доработал его Jacques Le Bailly, а вариативным шрифтом его сделали Stephen Nixon и Marc Foley. Лицензия — SIL Open Font License 1.1.

Где уместен Encode Sans

Адаптивные заголовки

Ось ширины сужает заголовок к 75 на маленьких экранах и расширяет к 125 на больших, не меняя семейства.

Интерфейсные системы

Девять насыщенностей в одном файле закрывают подписи, основной текст и выделения во всём приложении.

Вывески и навигация в пространстве

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

Отчёты и панели с данными

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

Фирменная типографика

Диапазон от Thin до Black в нескольких ширинах позволяет одной гарнитуре работать в логотипе, заголовке и мелком тексте.

Глифы

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

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

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

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

Лицензия

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

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

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

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

@font-face {
  font-family: "Encode Sans";
  src: url("/assets/fonts/EncodeSans-VariableFont_wdth%2Cwght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

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

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

<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=Encode+Sans:wght@100..900&display=swap" rel="stylesheet">

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

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

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

Курсива нет

В Encode Sans только прямые начертания.

Для ширины нужна поддержка в CSS

В вебе к оси ширины обращаются через font-stretch или font-variation-settings; программы без поддержки вариативных шрифтов показывают ширину по умолчанию.

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

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

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