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

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

Ширина контента помогает:

• выровнять разные блоки по одной линии;
• не растягивать текст на слишком длинные строки;
• сделать сайт понятным на больших экранах;
• быстрее настраивать единый внешний вид страниц.

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

В настройках можно выбрать один из трёх вариантов:

1200 px – стандартный вариант для большинства сайтов. Это универсальный и безопасный вариант.
1440 px – более широкий вариант. Подходит для сайтов с галереями, портфолио и большим количеством визуального контента.
1620 px – самый широкий вариант. Подходит для проектов, где нужна просторная сетка. Его стоит использовать аккуратно. Такая ширина подходит для больших экранов, но на небольших ноутбуках широкий контент может выглядеть хуже или требовать дополнительной проверки адаптации.

В настройках указано, например: 1200 px (1160 px + 20 px отступы).
Это значит, что общая ширина области — 1200 px. Из них 1160 px занимает контент, а по краям остаются отступы по 20 px. Эти отступы нужны, чтобы контент не прилипал к краям экрана.

Чтобы настроить ширину, откройте «Дизайн сайта», перейдите в раздел «Другое» и выберите «Ширина контента». Выберите один из вариантов ширины: 1200, 1440 и 1620 пикселя. Изменения применяться автоматически.