EN
Поиск ...

Шрифты сайта

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

Pixpa поддерживает более 300 шрифтов из репозитория Google Fonts, а также ряд шрифтов с лицензией OFL, которые вы можете использовать бесплатно. Настраивая стили текста, вы можете обеспечить единообразие и улучшить читаемость на всех страницах вашего сайта.

В этой статье:

  1. Текущий набор шрифтов
  2. Пресеты шрифтов
  3. Расширенное редактирование
  4. Сбросить пользовательские настройки
  5. Альтернативные шрифты от Google

Вы можете управлять шрифтами для своего веб-сайта в разделе «Дизайн » (1).

Оказавшись в разделе «Дизайн», нажмите на вкладку «Шрифты» (2).

Текущий набор шрифтов

  • Выбранный Предустановка шрифта (1) будет отображаться здесь.
  • Вы можете настроить Заголовок (2) и Пункт (3) шрифт для выбранного пресета.

Примечание: После внесения пользовательских изменений в параметры цветовой палитры или расширенное редактирование вы увидите кнопку «Изменено» (4).

  • Верхний текст (5) представляет шрифт заголовка.
  • Нижний текст (6) представляет шрифт Paragraph.

Примечание:

  • Изменение шрифта заголовка также повлияет на заголовок сайта и элементы меню.
  • Изменение шрифта абзаца также повлияет на кнопки, галереи (название изображения) и текст нижнего колонтитула.

Пресеты шрифтов

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

  • Вы можете легко изменить шрифт глобально, выбрав любой из Пресеты шрифтов (1).
  • ФИЛЬТР (2) список, выбрав «Все», «С засечками», «Без засечек» или «Смешанные настройки». После выбора фильтра вы увидите только связанные пресеты.
  • Чтобы выбрать Предустановка шрифта (3), вам просто нужно нажать на него и Опубликовать (4) изменения.

  • Прокрутите список шрифтов до конца, чтобы получить доступ к доступным шрифтам и выбрать их. OFL шрифты.

Расширенное редактирование

Отсюда вы можете переопределить предустановленные настройки и управлять шрифтами для всех элементов вашего веб-сайта вручную.

Здесь вы увидите следующие варианты:

Название сайта

Это заголовок вашего веб-сайта, который действует как текст логотипа, если основной логотип недоступен.

Отсюда вы можете :

  1. Шрифт - Выберите шрифт для заголовка вашего сайта.
  2. Вес - Выберите толщину шрифта для заголовка вашего сайта.
  3. Размер – Рабочий стол – Укажите размер текста заголовка вашего сайта на рабочем столе.
  4. Размер – Мобильный – Укажите размер текста для заголовка вашего сайта на мобильных устройствах.
  5. Межбуквенное расстояние - Установите расстояние между буквами в названии сайта.

Меню заголовка

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

Здесь вы можете настроить:

    1. Шрифт - Укажите шрифт для ссылок меню.
    2. Вес - Выберите толщину шрифта для ссылок меню.
    3. Размер - Укажите размер текста для ссылок меню.
    4. Межбуквенное расстояние - Установите расстояние между буквами в ссылках меню.

    1. Шрифт - Укажите шрифт для ссылок раскрывающегося меню.
    2. Вес - Выберите толщину шрифта для ссылок раскрывающегося меню.
    3. Размер - Укажите размер текста для ссылок раскрывающегося меню.
    4. Межбуквенное расстояние - Установите расстояние между буквами в ссылках выпадающего меню.

Заголовки

Теги заголовков имеют решающее значение, поскольку они помогают структурировать контент, улучшают SEO, повышают доступность и читабельность. Pixpa предоставляет четыре типа тегов заголовков. Это заголовок (H1), заголовок (H2), заголовок (H3) и заголовок (H4).

Отсюда вы можете :

  1. Шрифт - Укажите стиль шрифта для заголовка (H1).
  2. Вес - Выберите толщину шрифта для заголовка (H1).
  3. Размер – Рабочий стол – Укажите размер шрифта заголовка (H1) для рабочего стола.
  4. Размер – Мобильный – Укажите размер шрифта заголовка (H1) для мобильных устройств.
  5. Высота линии - Укажите высоту строки шрифта для заголовка (H1) (указывается в em).
  6. Межбуквенное расстояние - Укажите расстояние между буквами текста заголовка (H1) (указывается в em).

Примечание: Аналогично заголовку (H1), вы можете настроить параметры шрифта для H2, H3 и H4.

Заполнение текста (заголовки)

  • Рубрики – Укажите отступы для заголовков на вашем сайте.

Пункты

Он используется для определения и структурирования блока текста в виде абзаца. Обычно это используется для описаний, заголовков изображений, подписей, текста нижнего колонтитула и т. д.

Отсюда вы можете :

  1. Шрифт - Выберите стиль шрифта для всего текста абзаца (обычный, мелкий и крупный).
  2. Вес - Выберите толщину шрифта для всего текста абзаца.
  3. P (Нормальный) – Рабочий стол – Выберите обычный размер шрифта для всего текста абзаца на рабочем столе.
  4. P (Нормальный) – Мобильный – Выберите обычный размер шрифта для всего текста абзаца для мобильных устройств.
  5. P (маленький) – Рабочий стол – Выберите меньший размер шрифта (меньше P (обычный)) для всего текста абзаца на рабочем столе.
  6. P (маленький) – мобильный – Выберите меньший размер шрифта (меньше P (обычный)) для всего текста абзаца для мобильных устройств.
  7. P (Большой) – Настольный – Выберите больший размер шрифта (больше, чем P (обычный)) для всего текста абзаца на рабочем столе.
  8. P (Большой) – Мобильный – Выберите больший размер шрифта (больше P (обычный)) для всего текста абзаца для мобильных устройств.
  9. Высота линии - Укажите высоту строки шрифта для текста абзаца (указанную в em).
  10. Межбуквенное расстояние - Укажите расстояние между буквами текста абзаца (указывается в терминах em).

Заполнение текста (абзацы)

Абзац – Укажите отступы для абзацев на вашем веб-сайте.

Кнопки

Кнопки — это элементы, которые вы можете щелкнуть или коснуться для выполнения определенных действий, таких как отправка формы или переход на другую страницу.

Отсюда вы можете :

  1. Шрифт - Здесь вы можете выбрать шрифт для текста кнопки.
  2. Вес - Отсюда установите толщину шрифта для текста кнопки. Вы можете выбирать между нормальным, светлым и жирным шрифтом.
  3. Размер (большой) – Установите крупный размер шрифта для кнопок.
  4. Размер (средний) – Установите средний размер шрифта для кнопок.
  5. Маленький размер) - Установите мелкий размер шрифта для кнопок.
  6. Межбуквенное расстояние - Задайте расстояние между буквами текста кнопки отсюда (указывается в em).

Это текст, который отображается внизу веб-сайта, например, информация об авторских правах, отказ от ответственности и т. д. Настройки текста в нижнем колонтитуле позволяют настроить внешний вид текста в нижнем колонтитуле вашего веб-сайта.

  1. Шрифт - Укажите стиль шрифта для текста нижнего колонтитула.
  2. Вес - Здесь можно задать толщину шрифта для текста нижнего колонтитула. Доступны варианты: обычный, светлый и жирный.
  3. Размер текста - Определите размер шрифта для текста нижнего колонтитула.
  4. Размер меню – Установите размер шрифта для пунктов меню нижнего колонтитула.
  5. Размер заголовка сайта (для ПК) – Отрегулируйте размер нижнего колонтитула заголовка сайта при просмотре на настольном компьютере.
  6. Размер заголовка сайта (мобильный) – Отрегулируйте размер нижнего колонтитула заголовка сайта при просмотре на мобильных устройствах.
  7. Межбуквенное расстояние - Укажите расстояние между буквами для текста нижнего колонтитула (измеряется в em).

Прочее

Это лишь некоторые из дополнительных настроек в разделе «Шрифт». Здесь вы можете:

Это применяется, когда вы выбираете показывать заголовки изображений при наведении.

    1. Шрифт при наведении – Здесь вы можете выбрать шрифт для текста заголовка изображения при наведении курсора.
    2. Вес при наведении – Здесь установите толщину шрифта для текста заголовка изображения. Вы можете выбирать между нормальным, светлым и жирным шрифтом.
    3. Размер при наведении – Установите размер текста заголовка изображения при наведении отсюда.
    4. Межбуквенное расстояние - Установите расстояние между буквами текста заголовка изображения отсюда (указывается в em).

Сбросить пользовательские настройки

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

Вы увидите кнопку «Изменено». Наведите курсор на кнопку, она изменится на Reset. Отсюда вы можете сбросить изменения до исходных.

Альтернативные шрифты от Google

Вот несколько альтернативных шрифтов Google для некоторых популярных шрифтов :

  • Брэндон Гротеск - Жозефин Санс
  • София Про – Поппинс
  • Авенир – Lato or Незамедлительный
  • Проксима Нова – Montserrat or Roboto
  • Проксима Софт – Nunito
  • DIN - Большой складной карманный нож
  • Устав – Source Serif Pro
  • Гельветика Ной – Roboto or Работа Санс
  • Уитни – Катамаран or Цена
  • Готэм – Montserrat
  • Тиса Сериф - PT Serif
  • Музейная плита – Плита Zilla or Roboto Slab
  • Оптима – Арсенал
  • Сколар – Исходный с засечками
  • Буква готика – Фира Моно
  • Пользовательский интерфейс Сего — Открытый без
  • Футура – Мули
  • Гибсон – Ното без
  • Зона Про – Поппинс
  • Миньон – Багровый Текст
  • Мостра Нуова – Жозефин Санс
  • Геогротеск – армия
  • Баскервиль – Либре Баскервиль
  • Страж – Domine
  • Нойцайт – Цена
  • Миллер – Абриль Fatface
Метки:

Не можете найти то, что ищете?

Свяжитесь с экспертом Pixpa.

Свяжитесь с нами
Pixpa Studio только что обновили. В данный момент мы обновляем скриншоты всех справочных статей.