Как изменить шрифт в документах и на сайте
Чтобы поменять шрифт, выделите текст и выберите новую гарнитуру в панели инструментов редактора (Word, Google Docs) или настройте свойство font-family в CSS для веб-страниц. В конструкторах сайтов (Tilda, WordPress) изменения вносятся через глобальные настройки типографики в разделе «Дизайн» или «Стили».
Выбор шрифта влияет на восприятие информации: строгие гротески подходят для деловой переписки, а антиквы — для лонгридов. Ниже приведены конкретные инструкции для разных платформ.
Оглавление
В текстовых редакторах (Word, Google Docs)
В офисных программах управление шрифтами вынесено на панель быстрого доступа. Главное правило: сначала выделите текст, затем примените форматирование.
Microsoft Word
- Выделите нужный фрагмент текста (или нажмите
Ctrl+Aдля всего документа). - Перейдите на вкладку Главная.
- В блоке «Шрифт» откройте выпадающий список и выберите гарнитуру (например, Calibri, Times New Roman, Arial).
- Там же можно изменить размер, начертание (жирный, курсив) и цвет.
Чтобы изменить шрифт по умолчанию для всех новых документов: нажмите правой кнопкой мыши на выбранный стиль «Обычный» в галерее стилей → Изменить → задайте нужный шрифт → выберите опцию «В новых документах, использующих этот шаблон».
Google Документы
- Выделите текст.
- На панели инструментов найдите выпадающее меню с названием текущего шрифта (обычно слева от размера).
- Выберите нужный вариант. Если шрифта нет в списке, нажмите Другие шрифты и добавьте его из библиотеки Google Fonts.
- Для массового изменения используйте стили: обновите стиль «Обычный текст» или «Заголовок 1», чтобы изменения применились ко всему документу автоматически.
LibreOffice Writer
Процесс аналогичен Word: меню Формат → Символ → вкладка Шрифт. Здесь можно более тонко настроить интервалы и эффекты.
На сайте через CSS
Если вы верстаете сайт вручную или имеете доступ к файлам стилей, шрифты управляются через CSS-свойства.
Базовый синтаксис изменения шрифта для всего сайта:
body {
font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
font-size: 16px;
line-height: 1.5;
}
Ключевые свойства:
font-family: указывает приоритетный шрифт. Обязательно добавляйте запасные варианты (fallbacks), разделенные запятой. Если первый шрифт не загрузится, браузер использует второй.font-size: размер текста. Для основного текста на вебе стандартом считается 16–18px.font-weight: толщина начертания (400 — обычный, 700 — жирный).line-height: межстрочный интервал. Значение 1.4–1.6 улучшает читабельность.
Локальные шрифты
Если шрифт хранится на вашем сервере, используйте правило @font-face:
@font-face {
font-family: 'MyCustomFont';
src: url('fonts/myfont.woff2') format('woff2'),
url('fonts/myfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
body {
font-family: 'MyCustomFont', sans-serif;
}
В конструкторах сайтов и CMS
В популярных платформах изменение шрифта часто не требует знания кода и делается через визуальный интерфейс.
WordPress
Зависит от установленной темы:
- Перейдите в Внешний вид → Настроить.
- Найдите раздел Типографика (Typography) или Шрифты.
- Измените гарнитуру для заголовков (H1–H6) и основного текста.
- Нажмите Опубликовать.
Примечание: В современных темах (Full Site Editing) настройки могут находиться в редакторе блоков: выберите блок → панель справа → вкладка «Стили» → «Типографика».
Tilda
- Откройте страницу в редакторе.
- Нажмите кнопку Настройки (вверху справа) → Шрифты и цвета.
- В разделе Шрифты выберите гарнитуры для заголовков и текста из списка или подключите свои через Google Fonts.
- Изменения применятся ко всем текстовым блокам на странице, если они не переопределены индивидуально.
Webflow / Wix / Squarespace
Ищите панель Site Styles, Design или Global Settings. Там есть раздел Typography, где можно задать глобальные стили для тегов <body>, <h1>, <p> и других элементов. Это гарантирует единообразие дизайна на всех страницах.
Подключение веб-шрифтов
Веб-шрифты (например, из Google Fonts) позволяют использовать нестандартные гарнитуры, которые будут одинаково отображаться у всех пользователей.
Как подключить Google Fonts:
- Зайдите на fonts.google.com.
- Выберите понравившийся шрифт (например, Roboto или Montserrat).
- Нажмите Get font → Review your selections.
- Скопируйте код
<link>и вставьте его в секцию<head>вашего HTML-документа. - Используйте название шрифта в CSS:
h1 {
font-family: 'Montserrat', sans-serif;
font-weight: 700;
}
Не подключайте слишком много начертаний одного шрифта (например, сразу 10 весов). Это замедлит загрузку сайта. Обычно достаточно трех: Regular (400), Medium (500) и Bold (700).
Частые ошибки
| Ошибка | Почему это плохо | Как исправить |
|---|---|---|
| Использование более 3 шрифтов на странице | Создает визуальный шум, сложно читать | Оставьте 1–2 гарнитуры: одну для заголовков, другую для текста |
| Мелкий размер шрифта (<14px на вебе) | Пользователям приходится щуриться | Установите базовый размер 16px для основного текста |
| Низкий контраст (светло-серый на белом) | Текст сливается с фоном | Используйте темно-серый (#333) или черный цвет для текста |
| Отсутствие fallback-шрифтов | Если веб-шрифт не загрузится, текст станет стандартным и может «поехать» | Всегда указывайте sans-serif или serif в конце списка font-family |
FAQ
Какой шрифт лучше использовать для сайта? Для интерфейсов и длинных текстов лучше подходят гротески (шрифты без засечек): Inter, Roboto, Open Sans, Arial. Они хорошо читаются с экранов. Для заголовков или художественных проектов можно использовать антиквы (Merriweather, Playfair Display).
Почему шрифт в Word выглядит иначе, чем у коллеги? Если вы использовали нестандартный шрифт, которого нет на компьютере коллеги, Word заменит его на доступный аналог. Чтобы этого избежать, используйте стандартные системные шрифты (Arial, Times New Roman, Calibri) или сохраните документ в PDF перед отправкой.
Как сделать текст жирным в HTML?
Используйте тег <strong> или <b>, либо CSS-свойство font-weight: bold; (или 700). Тег <strong> также сообщает поисковикам и скринридерам о важности фрагмента.
Можно ли загрузить свой шрифт в Google Docs? Напрямую загрузить файл нельзя, но можно выбрать любой шрифт из обширной библиотеки Google Fonts, нажав «Другие шрифты» в меню выбора гарнитуры.