Чек-лист веб-разработчика по 168-ФЗ
Федеральный закон 168-ФЗ о государственном языке Российской Федерации обязывает владельцев сайтов, ориентированных на российскую аудиторию, обеспечить наличие русскоязычной версии контента. Для веб-разработчика это означает необходимость тщательной проверки каждого слоя приложения: от HTML-разметки и метатегов до пользовательского интерфейса и серверных ответов. Ниже представлен подробный чек-лист, содержащий более 30 пунктов, сгруппированных по ключевым категориям. Используйте его при каждом релизе, чтобы гарантировать полное соответствие требованиям закона.
Прежде чем приступить к проверке, рекомендуем воспользоваться автоматическим сканером КириллоСкан, который за две минуты выявит основные нарушения. После этого пройдитесь по чек-листу вручную, чтобы устранить оставшиеся проблемы.
Категория 1. HTML-разметка и метатеги
Первый уровень проверки затрагивает базовую структуру страницы. Многие нарушения связаны с тем, что разработчики оставляют английские значения в атрибутах, копируют шаблоны без локализации или используют сторонние библиотеки, которые подставляют значения по умолчанию на английском языке. Проверьте каждый пункт ниже и убедитесь, что все текстовые атрибуты доступны на русском языке.
- Атрибут
lang="ru"установлен в теге<html>. Это критически важно для поисковых систем и программ экранного чтения. Без корректного атрибута языка браузер может неправильно определить язык документа и предложить автоперевод. - Тег
<title>содержит заголовок на русском языке. Допускается наличие названия бренда латиницей, но основная часть заголовка должна быть на русском. Например: «Каталог товаров — BrandName». - Мета-тег
descriptionзаполнен на русском языке и содержит осмысленное описание страницы длиной от 120 до 160 символов. - Мета-тег
keywordsсодержит ключевые слова на русском языке. Хотя поисковые системы придают ему меньше значения, для проверки на соответствие 168-ФЗ важно наличие русскоязычных ключевых слов. - Open Graph теги (
og:title,og:description) заполнены на русском языке. При расшаривании ссылки в социальных сетях пользователи должны видеть русскоязычное описание. - Атрибуты
altу всех изображений заполнены на русском языке. Это касается как контентных изображений, так и иконок, баннеров и декоративных элементов, несущих смысловую нагрузку. - Атрибуты
titleу ссылок и элементов навигации содержат русскоязычные подсказки. - Микроразметка Schema.org содержит русскоязычные значения в полях
name,description,headlineи других текстовых свойствах.
Категория 2. Навигация и интерфейсные элементы
Навигация сайта является одним из первых элементов, с которыми взаимодействует пользователь. Все элементы меню, кнопки и ссылки должны быть оформлены на русском языке. Особое внимание следует уделить динамическим элементам, которые генерируются JavaScript-фреймворками.
- Все пункты главного меню написаны на русском языке. Исключение составляют только общепринятые аббревиатуры и торговые марки.
- Пункты выпадающих подменю переведены на русский. Часто подменю генерируются динамически из базы данных, где данные могут быть на английском.
- Кнопки действий («Купить», «Добавить в корзину», «Отправить») используют русскоязычные надписи. Проверьте не только видимый текст, но и атрибуты
aria-label. - Хлебные крошки (breadcrumbs) отображаются на русском языке. Если CMS генерирует их автоматически из URL, необходимо настроить маппинг транслитерированных URL на русские названия.
- Пагинация содержит русскоязычные метки: «Назад», «Далее», «Страница» вместо «Prev», «Next», «Page».
- Подвал сайта (footer) содержит все ссылки и информацию на русском. Особенно часто в подвале остаётся текст вроде «All rights reserved» или «Powered by».
- Иконки социальных сетей сопровождаются русскоязычными подписями или тултипами при наведении.
Категория 3. Формы и элементы ввода
Формы представляют собой критическую зону для проверки, поскольку они содержат множество текстовых элементов: лейблы, плейсхолдеры, сообщения об ошибках, подсказки, тексты кнопок. Обратите внимание, что многие фреймворки для валидации форм используют англоязычные сообщения по умолчанию, и их необходимо перенастроить. Подробнее о замене англоязычных терминов читайте в нашем словаре замен.
- Все лейблы (
<label>) полей формы написаны на русском языке. - Атрибуты
placeholderсодержат русскоязычные подсказки. Замените «Enter your email» на «Введите вашу электронную почту». - Сообщения валидации формы выводятся на русском. Проверьте как стандартные HTML5-сообщения (их можно настроить через
setCustomValidity()), так и сообщения от библиотек валидации. - Тексты кнопок отправки форм написаны на русском: «Отправить», «Зарегистрироваться», «Подписаться».
- Текст согласий и чекбоксов (политика конфиденциальности, пользовательское соглашение) полностью на русском языке.
- Сообщения об успешной отправке и ошибках сервера отображаются на русском. Проверьте ответы AJAX-запросов.
- Выпадающие списки (
<select>) содержат русскоязычные варианты выбора, включая пункт по умолчанию («Выберите вариант», а не «Select option»).
Категория 4. CSS и визуальное оформление
Каскадные таблицы стилей также могут содержать текстовый контент через псевдоэлементы ::before и ::after, а также через свойство content. Этот текст часто остаётся без внимания при локализации.
- Текст в CSS-псевдоэлементах (
content: "...") написан на русском. Это касается иконок с текстом, декоративных меток, счётчиков и подобных элементов. - Шрифты поддерживают кириллицу. Проверьте, что подключённые веб-шрифты включают поднабор
cyrillicилиcyrillic-ext. При использовании Google Fonts добавьте параметр&subset=cyrillic. - Текст на кнопках, сгенерированных через CSS (например, градиентные кнопки с текстом внутри
::before), переведён на русский. - Сообщения, отображаемые через CSS-анимации или тултипы, содержат русский текст.
Категория 5. JavaScript и динамический контент
Современные веб-приложения значительную часть контента генерируют динамически через JavaScript. Это создаёт дополнительные сложности при локализации, поскольку текстовые строки разбросаны по многочисленным компонентам и модулям. Обязательно сверьтесь с шаблоном аудита для систематической проверки.
- Все текстовые строки в JavaScript-файлах переведены на русский или вынесены в отдельный файл локализации (
i18n). Проверьте строки вalert(),confirm(),console.log()и аналогичных вызовах. - Модальные окна (модалки) содержат русскоязычные заголовки, тексты и кнопки. Проверьте все состояния: загрузка, успех, ошибка.
- Уведомления (toast, snackbar) выводят сообщения на русском языке.
- Тултипы (всплывающие подсказки) содержат текст на русском.
- Текст в виджетах чата, калькуляторах, слайдерах и прочих интерактивных элементах полностью русскоязычный.
- Ошибки API обрабатываются и выводятся пользователю на русском языке, а не в виде технического английского текста из бэкенда.
- Библиотеки выбора дат (datepicker) настроены на русскую локаль: названия месяцев, дней недели, формат даты.
Категория 6. Медиаконтент и файлы
Изображения, видео и аудио также подпадают под требования 168-ФЗ, если они содержат текстовую информацию. Текст на изображениях нельзя проверить автоматическим сканером, поэтому эта категория требует ручного аудита.
- Текст на изображениях (баннеры, инфографика, промоматериалы) представлен на русском языке или имеет русскоязычный дубликат.
- Видео сопровождаются русскими субтитрами или звуковой дорожкой на русском языке.
- PDF-документы, доступные для скачивания, имеют русскоязычную версию.
- Названия файлов для скачивания содержат осмысленные русские названия (или транслитерацию), а не случайные хеши.
Категория 7. Технические аспекты и серверная часть
Серверная часть также влияет на соответствие сайта требованиям закона. Заголовки ответов, страницы ошибок и системные сообщения должны быть на русском языке.
- Страница ошибки 404 содержит русскоязычное сообщение и навигацию для возврата на главную страницу. Не оставляйте стандартную страницу веб-сервера с текстом «Not Found».
- Страницы ошибок 500, 502, 503 оформлены на русском языке с понятным сообщением для пользователя.
- HTTP-заголовок
Content-Language: ruустановлен для страниц на русском языке. - Карта сайта (sitemap.xml) содержит все русскоязычные страницы и корректные hreflang-аннотации.
- Файл robots.txt не блокирует индексацию русскоязычных страниц.
- Письма, отправляемые системой (подтверждение регистрации, восстановление пароля), составлены на русском языке. Проверьте шаблоны email-уведомлений в CMS или на бэкенде.
Как пользоваться чек-листом
Рекомендуем использовать данный чек-лист в следующем порядке:
- Автоматическая проверка. Запустите сканер КириллоСкан, чтобы получить первичный отчёт о нарушениях. Сканер проверит HTML-разметку, метатеги, навигацию и видимый текст.
- Ручная проверка по категориям. Пройдитесь по каждой категории чек-листа, отмечая выполненные пункты. Начните с HTML-разметки, затем переходите к формам и JavaScript.
- Проверка динамического контента. Протестируйте все интерактивные сценарии: заполнение форм, появление модальных окон, переключение вкладок, работу поиска.
- Проверка медиаконтента. Просмотрите все изображения с текстом, видео и загружаемые документы.
- Повторное сканирование. После внесения исправлений запустите сканер повторно, чтобы убедиться в устранении всех нарушений.
Типичные ошибки разработчиков
За время работы нашего сервиса мы собрали статистику наиболее частых нарушений, которые допускают веб-разработчики. Ознакомьтесь с этим списком, чтобы не повторять чужих ошибок.
Плейсхолдеры форм на английском. Это самая распространённая проблема. Разработчики копируют компоненты из библиотек (Material UI, Bootstrap) и забывают заменить плейсхолдеры. Решение: создайте файл локализации и подставляйте значения из него.
Стандартные сообщения валидации. HTML5-формы выводят сообщения на языке браузера, а не на русском. Используйте метод setCustomValidity() для установки русскоязычных сообщений или кастомную валидацию на JavaScript.
Библиотеки датапикеров. Большинство библиотек выбора дат по умолчанию работают на английском. Необходимо явно указать русскую локаль при инициализации.
Текст в SVG-иконках. Иногда SVG-файлы содержат текстовые элементы на английском языке. Проверьте содержимое тегов <text> внутри SVG.
Сторонние виджеты. Чат-боты, виджеты обратного звонка, формы обратной связи от сторонних сервисов часто работают на английском по умолчанию. Настройте их локализацию в панели управления соответствующего сервиса.
Инструменты для автоматизации проверки
Помимо ручной проверки по чек-листу, существуют инструменты, которые помогут автоматизировать процесс. Используйте сравнение сервисов проверки, чтобы выбрать подходящий вариант. Для планирования работ по русификации обратитесь к графику перехода, который поможет выстроить процесс поэтапно.
Для автоматизации замены англоязычных терминов в коде рекомендуем использовать наш словарь замен, содержащий более 100 наиболее употребимых слов и выражений с их русскими эквивалентами.
Рекомендации по организации работы
Интегрируйте проверку на соответствие 168-ФЗ в ваш CI/CD-пайплайн. Добавьте линтер, который будет проверять наличие русскоязычных значений в атрибутах alt, placeholder, title и aria-label. Создайте автоматизированные тесты, которые будут проверять язык текста на ключевых страницах.
Заведите регламент для команды: каждый новый компонент или страница должны проходить проверку на соответствие этому чек-листу перед мержем в основную ветку. Используйте шаблон код-ревью, включающий обязательную проверку локализации.
Для крупных проектов рекомендуем назначить ответственного за локализацию, который будет отслеживать соответствие новых функций требованиям закона. Это позволит избежать накопления технического долга по русификации.
Помните, что соответствие 168-ФЗ — это не разовая задача, а постоянный процесс. Каждое обновление сайта, добавление нового функционала или подключение сторонних виджетов может привнести англоязычный контент. Регулярные проверки с помощью этого чек-листа и автоматического сканера помогут поддерживать сайт в соответствии с требованиями законодательства.