← Все статьи

Туториалы

Создайте собственный режим чтения с JustZix

17 мая 2026 · автор JustZix Team

Режимы чтения в браузере хороши, пока не вырежут единственное нужное вам изображение, не изуродуют блоки кода или вовсе откажутся включаться. С JustZix вы можете создать собственный режим чтения, который работает ровно так, как вам нравится, ровно на тех сайтах, которые вы выберете.

Зачем делать свой

Встроенный режим чтения — чёрный ящик. Вы не можете подправить длину строки, не можете сохранить иллюстрации, и он часто не срабатывает на страницах, которые не являются классическими статьями. Правило JustZix, напротив, — это просто CSS, который контролируете вы. Оно работает на настоящей странице, так что ссылки, код и медиа продолжают работать. Вы решаете, что остаётся, а что уходит.

Шаг первый: укротите колонку статьи

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

article, .post-content, main {
  max-width: 68ch !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 1.5rem !important;
}

Единица ch привязана к ширине символа 0, так что 68ch оказывается близко к классическому идеалу в 66 символов независимо от размера шрифта. Подстройте список селекторов под целевой сайт.

Шаг второй: раскройте текст

Высота строки по умолчанию на новостных сайтах часто тесная — 1,4. Читать намного комфортнее около 1,7, со слегка большим размером основного текста и шрифтом с засечками или гуманистическим без засечек:

article p, .post-content p {
  font-size: 1.18rem !important;
  line-height: 1.75 !important;
  margin-bottom: 1.4em !important;
  font-family: Georgia, 'Iowan Old Style', serif !important;
}
article h2, article h3 {
  line-height: 1.3 !important;
  margin-top: 2em !important;
}

Шаг третий: расчистите площадку

Теперь скройте шум. Боковые панели, липкие шапки, всплывающие окна рассылок и колонки связанного контента — все они борются за внимание. Сплошное правило display убирает их:

aside,
.sidebar,
.newsletter-signup,
.related-posts,
[class*="sticky"],
[id*="recirculation"] {
  display: none !important;
}
body { overflow-x: hidden !important; }

Будьте чуть осторожнее с селекторами атрибутов вроде [class*="sticky"] — проверьте страницу и удалите любой селектор, который скрывает то, что вы хотели оставить.

Собираем всё в правило

В JustZix создайте новое правило, задайте шаблон URL для сайта, который вы читаете чаще всего (например, *://*.example-news.com/*), вставьте все три CSS-блока в панель CSS и сохраните. Каждая подходящая статья теперь автоматически открывается в вашем личном режиме чтения.

Спокойный фон

Чисто белый на полной яркости резок вечером. Мягкий кремовый тон уменьшает блики без потери контраста, свойственной тяжёлой тёмной теме:

html, body, article {
  background: #f6f1e6 !important;
  color: #2b2620 !important;
}
article a { color: #7a4a1f !important; }

Отсюда вы можете продолжать дорабатывать: закрепить оглавление, добавить подсветку фокуса для текущего абзаца или наложить значок времени чтения. Просмотрите наши готовые примеры за другими отправными точками, посмотрите сопутствующую статью о точной настройке ширины колонки и скачайте JustZix, если ещё этого не сделали. Режим чтения — по-вашему.