Жирное начертание Lora Bold нередко отображается на сайте иначе, чем в макете, или вообще рендерится синтетическим «псевдожирным» — это верный признак того, что файл начертания не подключён, а браузер растягивает обычный Regular. Проблема решается корректным подключением шрифтового файла с нужным весом, и в этой статье разберём весь процесс от загрузки до тонкой настройки.

Lora — это гарнитура с засечками (serif), созданная дизайнерской студией Olga Umpeleva и распространяемая бесплатно по открытой лицензии через Google Fonts. Начертание Bold соответствует весу font-weight: 700 и активно используется для заголовков, выделения акцентов и типографики длинных текстов, где нужен контраст с основным кеглем. Гарнитура поддерживает кириллицу и латиницу, что делает её популярной в русскоязычных проектах.

Характеристики начертания Lora Bold

Начертание Bold в гарнитуре Lora сохраняет характерные черты семейства: умеренный контраст штрихов, каллиграфическую пластику и чуть суженные пропорции. В отличие от многих гротесков, жирная Lora не выглядит грубой — она остаётся элегантной даже в крупных кеглях, что ценится в редакционном дизайне и оформлении блогов.

Формально в семействе Lora доступны несколько весов: Regular (400), Medium (500), SemiBold (600) и Bold (700), а также курсивные варианты. Современная версия шрифта на Google Fonts распространяется в том числе как variable font — один файл содержит всю ось весов, и нужное начертание задаётся числом в CSS.

  • 🔤 Вес Bold — стандартный font-weight: 700, подходит для заголовков и акцентов.
  • 🌐 Кириллица — полноценная поддержка русского, украинского и других кириллических алфавитов.
  • 📄 Лицензия — свободная (SIL Open Font License), разрешено коммерческое использование.
  • 🖥️ Форматы — WOFF2 для веба, TTF/OTF для десктопа и вёрстки.

Где скачать Lora Bold

Основной и самый надёжный источник — Google Fonts. На странице гарнитуры нужно выбрать начертание Bold (700) и скачать архив либо скопировать готовый код подключения. Альтернативный вариант — репозиторий шрифта на GitHub, где лежат исходные файлы, включая variable-версию.

Сторонние «коллекции шрифтов» использовать не стоит: файлы там могут быть устаревшими, модифицированными или с урезанными таблицами символов. Если скачанный файл не содержит кириллических глифов, русский текст отрисуется системным шрифтом — и вёрстка «развалится» внешне незаметно для разработчика, работающего с латиницей.

💡

Скачивайте шрифт только с Google Fonts или официального репозитория — так вы гарантированно получите актуальную версию с полным набором кириллических символов.

Подключение через Google Fonts

Самый быстрый способ — вставить ссылку в секцию <head> страницы. Google Fonts автоматически отдаёт оптимальный формат под браузер пользователя и разбивает шрифт на подмножества (latin, cyrillic), что ускоряет загрузку.

<link href="https://fonts.googleapis.com/css2?family=Lora:wght@700&display=swap" rel="stylesheet">

После подключения начертание применяется обычным CSS-правилом. Обратите внимание: если указать font-weight: bold, но не подключить файл с весом 700, браузер синтезирует жирность искусственно — буквы станут грубее и «размытее».

h1 {

font-family: 'Lora', serif;


font-weight: 700;


}

⚠️ Внимание: параметр display=swap в ссылке критически важен. Без него текст может оставаться невидимым, пока шрифт не загрузится (эффект FOIT). С swap сначала показывается системный шрифт, затем происходит подмена на Lora.

Локальное подключение через @font-face

Если сайт должен работать без внешних запросов — например, из-за требований приватности или для офлайн-приложения — файлы шрифта размещают на собственном сервере. Для этого файл Lora-Bold.woff2 кладут в папку проекта и описывают правило @font-face.

@font-face {

font-family: 'Lora';


src: url('fonts/Lora-Bold.woff2') format('woff2');


font-weight: 700;


font-style: normal;


font-display: swap;


}

Ключевой момент: для каждого начертания нужно отдельное правило @font-face с корректным значением font-weight. Частая ошибка — подключить Bold-файл, но забыть указать вес 700, после чего браузер начинает путать начертания или применять псевдожирность к обычному тексту.

☑️ Проверка корректного подключения Lora Bold

Выполнено: 0 / 5

Сравнение начертаний семейства Lora

Чтобы понимать, когда уместен именно Bold, полезно видеть различия между весами. Таблица ниже поможет выбрать начертание под конкретную задачу вёрстки.

НачертаниеВес (font-weight)Типичное применение
Regular400Основной текст статей, параграфы
Medium500Подзаголовки, лёгкие акценты
SemiBold600Выделение внутри текста, цитаты
Bold700Заголовки, сильные акценты, кнопки

Для длинных текстов хорошо работает связка Regular + Bold: основная масса набирается четырёхсотым весом, а заголовки и ключевые фразы — жирным. Использовать Bold для целых абзацев не стоит: насыщенность штрихов утомляет глаз и снижает читабельность.

📊 Как вы чаще всего используете Lora Bold?
Заголовки статей
Акценты внутри текста
Логотипы и брендинг
Печатные материалы

Типичные проблемы и их решение

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

  • 🧩 Псевдожирный текст — файл Bold не подключён, браузер утолщает Regular. Решение: добавить файл с весом 700.
  • 🔡 Русский текст другим шрифтом — скачана версия без кириллицы. Решение: загрузить шрифт с Google Fonts заново.
  • 🐌 Медленная загрузка — подключены все начертания сразу. Решение: оставить только используемые веса.
  • ⚖️ Bold не отличается от SemiBold — в CSS указан неверный вес. Решение: сверить font-weight с подключённым файлом.

Ещё один нюанс — рендеринг в Windows. На экранах с низкой плотностью пикселей засечки Lora могут выглядеть грубовато из-за особенностей сглаживания. Это нормальное поведение, а не дефект файла; на современных дисплеях и в macOS шрифт выглядит заметно чище.

⚠️ Внимание: при использовании variable-версии шрифта старые браузеры могут не поддерживать ось весов. Если проект ориентирован на устаревшие окружения, безопаснее подключать статические файлы отдельных начертаний.
Чем variable font отличается от статических файлов

Variable font — это один файл, содержащий непрерывную ось весов (например, от 400 до 700). В CSS можно задать любое промежуточное значение, например font-weight: 650. Статические файлы — отдельные файлы для каждого начертания. Variable-версия экономит количество запросов, но требует поддержки со стороны браузера.

Lora Bold в десктопных приложениях

Для работы в Figma, Photoshop, Word или других программах файл шрифта устанавливается в операционную систему. В Windows достаточно открыть TTF-файл и нажать кнопку установки; в macOS шрифт добавляется через «Шрифты» (Font Book). После установки начертание появится в списке шрифтов всех приложений.

Учтите, что в некоторых программах семейство отображается единым пунктом «Lora», а выбор Bold происходит кнопкой жирного начертания. В других редакторах Bold виден как отдельный пункт списка — это зависит от того, как программа читает метаданные шрифта, и не влияет на результат.

💡

Lora Bold — свободный кириллический serif-шрифт веса 700. Корректное подключение требует файла с нужным весом, font-display: swap и проверки кириллицы на реальной странице.

Частые вопросы о Lora Bold

Можно ли использовать Lora Bold в коммерческих проектах?

Да. Шрифт распространяется по лицензии SIL Open Font License, которая разрешает бесплатное использование в личных и коммерческих целях, включая сайты, печать и логотипы. Перепродавать сам файл шрифта отдельно нельзя.

Почему Lora Bold выглядит иначе, чем в макете Figma?

Наиболее вероятные причины — разные версии шрифта на компьютере и в макете, синтетическое сглаживание в браузере или подмена начертания псевдожирным. Проверьте, что на сайт подключён именно файл с весом 700, а не только Regular.

Поддерживает ли Lora Bold кириллицу?

Да, гарнитура изначально спроектирована с поддержкой кириллических алфавитов. При подключении через Google Fonts кириллическое подмножество подгружается автоматически. Если скачиваете файлы со сторонних источников, убедитесь, что кириллица в них присутствует.

Какой font-weight соответствует Lora Bold?

Стандартное значение — font-weight: 700. В variable-версии шрифта можно задавать и промежуточные значения, но классическое Bold — это именно 700.

Чем Lora Bold отличается от Lora SemiBold?

SemiBold имеет вес 600 и выглядит легче — это промежуточное начертание между обычным и жирным. Bold (700) даёт максимальный контраст и лучше подходит для заголовков, тогда как SemiBold уместен для мягких акцентов внутри текста.