header-logo
Узнайте как использовать Wix для создания своего сайта и бизнеса.
Создавайте и управляйте своим сайтом, используя интуитивно понятные функции Wix.
Управляйте подписками, планами и счетами.
Управляйте своим бизнесом и общайтесь с пользователями.
Узнайте, как приобрести, подключить или перенести домен на свой сайт.
Получите инструменты для развития вашего бизнеса и присутствия в интернете.
Повышайте свою видимость с помощью инструментов SEO и маркетинга.
Получайте расширенные функции, которые помогут вам работать более эффективно.
Находите решения, узнавайте об известных неполадках или свяжитесь с нами.
placeholder-preview-image
Совершенствуйте навыки с помощью наших курсов и учебных статей.
Получайте рекомендации по веб-дизайну, маркетингу и многому другому.
Узнайте, как увеличить органический трафик из поисковых систем.
Создайте собственный сайт на нашей полнофункциональной платформе.
Найдите подходящего специалиста, который поможет вам достичь целей.
placeholder-preview-image
В этой статье
  • Шрифты и стили текста
  • Обновление типографики сайта
  • Применение стилей текста к странице
  • Применение стиля к текстовому элементу
  • Переопределение стилей текста
  • Включение резервных шрифтов

Редактор Studio: работа с типографикой сайта

4 мин.
Обеспечьте единообразие дизайна на сайте клиента, настроив типографику сайта. Эта область в панели стилей сайта разделена на Шрифты и Стили текста, которые можно настроить индивидуально в соответствии с желаемым образом.

Шрифты и стили текста

В разделе Шрифты показаны все шрифты, которые используются в стилях текста сайта. При изменении шрифта в разделе Шрифты все стили текста, в которых использовался старый шрифт, обновляются автоматически.
Стили текста относятся к отдельным типам текста, используемым на сайте (например, Заголовок 2, Абзац 1).
Вкладка «Типографика» в панели стилей сайта, где показан раздел шрифтов и стилей текста, при наведении на шрифт для его обновления
Совет:
H1–H6 — это теги заголовков, которые автоматически назначаются этим заголовкам. Соблюдение иерархии заголовков сверху вниз в соответствии с тегами помогает как SEO, так и специальным возможностям.

Обновление типографики сайта

Обновите дизайн, изменив типографику на всем сайте клиента. Вы можете изменить шрифты сайта или настроить внешний вид 9 отдельных стилей текста (6 заголовков, 3 абзаца).

Чтобы обновить типографику:

  1. Нажмите Стили сайта в левой части редактора.
  2. Перейдите на вкладку Типографика.
  3. Выберите, что вы хотите настроить — шрифт или стиль текста:
    • Шрифт:
      1. Нажмите на шрифт, который хотите обновить, в разделе Шрифты.
      2. Выберите новый шрифт из выпадающего списка.
      3. Нажмите Обновить, чтобы применить новый шрифт.
    • Стиль текста:
      1. Нажмите на стиль текста, который хотите обновить, в разделе Стили текста.
      2. Настройте стиль текста по своему желанию:
        • Выберите новый шрифт из выпадающего списка.
        • Выберите размер шрифта.
        • Включите пропорциональный масштаб, чтобы текст идеально смотрелся на любом экране, и задайте максимальный и минимальный размер в пикс. (пикселях).
        • Сделайте текст жирным и/или курсивом.
        • Установите межстрочный и межсимвольный интервал.
        • Выберите цвет текста.
      3. Вернитесь в основную панель, нажав на иконку стрелки в левом верхнем углу.
Открыты настройки редактирования текста для заголовка 6 в панели «Стили сайта». Курсор включает переключатель масштабирования текста.

Применение стилей текста к странице

После того как вы настроили типографику сайта клиента, вы сможете легко добавлять текстовые элементы с соответствующими шрифтами и стилями текста.
Перейдите в панель «Добавить элементы», чтобы добавить заголовки и абзацы с заданным стилем. Нажмите Текст и перетащите нужный стиль из раздела Темы текста в подходящее местоположение.
Тематические элементы связаны с типографикой сайта, поэтому они будут обновляться автоматически при внесении изменений в панели стилей сайта.
Скриншот тем текста, доступных в панели «Добавить элементы». Подзаголовок «Стиль текста» выделен.

Применение стиля к текстовому элементу

Вы также можете применить стиль к существующему текстовому элементу на странице. Нажмите Редактировать текст на элементе и выберите нужный Стиль из выпадающего списка в Инспекторе.
Это связывает элемент с выбранным стилем текста, а значит, он будет обновляться автоматически при внесении изменений в панели стилей сайта.
Обрезанный скриншот раздела Дизайн в Инспекторе. Выпадающий список стилей выделен.

Переопределение стилей текста

Если вы измените дизайн текстового элемента после выбора стиля (темы) для него, вы создадите «переопределение дизайна». Это означает, что любые обновления выбранного стиля не будут применяться к этому текстовому элементу.
Вы можете сбросить текстовые элементы с переопределениями до их исходного стиля. Нажмите на выпадающий список Стиль и выберите Сбросить изменения.
Вы также можете выбрать Обновить стили, чтобы применить внесенные переопределения к самому стилю текста. Это также обновит каждый текстовый элемент с этим стилем на всем сайте клиента.
Вкладка дизайна текста в Инспекторе. Курсор наведен на параметр «Сбросить изменения» в меню «Стиль».

Включение резервных шрифтов

Используете тяжелые пользовательские шрифты? Включите резервные шрифты, чтобы оптимизировать производительность сайта. Эти шрифты загружаются быстрее и временно отображаются на опубликованном сайте, пока ваши пользовательские шрифты скачиваются в фоновом режиме. Подробнее о резервных шрифтах

Чтобы включить резервные шрифты:

  1. Перейдите в редактор.
  2. Нажмите на иконку Wix Studio в левом верхнем углу.
  3. Наведите курсор на Сайт.
  4. Нажмите Скорость загрузки.
  5. Нажмите Оптимизировать загрузку с помощью резервных шрифтов, чтобы включить этот параметр.
Курсор наведен на настройки резервных шрифтов в разделе производительности. Настройка включена.
Полезно знать:
Когда настройка включена, она отмечена галочкой.

Helpmate

Привет,

Нужны дополнительные рекомендации?
Краткое содержание этой статьи
Unlock personalized helpLog in to get the most out of Helpmate.