Иноязычные фрагменты в веб-статье: когда ставить lang
Если русская веб-статья содержит целую фразу на другом языке, отметьте её язык атрибутом lang: браузер и вспомогательные технологии смогут обработать этот фрагмент с учётом его языка. На странице с русским текстом достаточно указать lang="ru" у корневого элемента <html>, а затем переопределить язык у отдельного абзаца, цитаты или короткого выражения. Разберём, где это помогает, как выбрать значение и как проверить разметку.
Что меняется, когда у фрагмента указан язык
Язык веб-страницы — это программно определяемая характеристика текста, а не оформление гарнитурой. Указание lang помогает браузерным инструментам и вспомогательным технологиям понять, какие языковые правила относятся к содержимому элемента. Например, программа экранного доступа может выбрать произношение для английской цитаты внутри русского абзаца; средство речи или перевода может применить подходящие правила обработки. Конкретное поведение зависит от браузера, операционной системы, голоса и настроек пользователя, поэтому одно только значение атрибута не гарантирует идеальное произношение.
В WCAG 2.2 критерий 3.1.2 «Язык отдельных частей» требует, чтобы язык каждого фрагмента или фразы можно было определить программно, за оговорёнными исключениями. К ним относятся имена собственные, технические термины, слова с неопределённым языком и выражения, ставшие обычной частью окружающего языка. Основной язык самой страницы выделен отдельно в критерии 3.1.1. Это полезное практическое основание для разметки: обозначать смену языка там, где она действительно меняет чтение, а не механически помечать каждое заимствование. Текст WCAG 2.2 и пояснение W3C о языке частей раскрывают критерий и его исключения.
Начните с языка всей страницы
Укажите основной язык на элементе <html>. Для русскоязычной статьи типичный вариант — <html lang="ru">. Когда у дочернего элемента нет собственного значения, он наследует язык от родителя. Поэтому ставить lang="ru" на каждом абзаце одной русской страницы обычно не нужно. В статье внутри англоязычного сайта можно, наоборот, задать lang="ru" у контейнера русской статьи, если язык страницы в целом английский.
HTML Living Standard определяет lang как атрибут, задающий основной язык содержимого элемента и текстовых значений его атрибутов; значение должно быть корректной языковой меткой BCP 47 или пустой строкой, означающей, что язык неизвестен. Если атрибут опущен, язык наследуется от родительского элемента. См. раздел WHATWG о глобальном атрибуте lang. Это означает, что для одного иностранного абзаца достаточно локального переопределения, а последующий текст автоматически вернётся к языку окружающего контейнера.
Отметьте завершённую мысль, а не каждое слово
Размер фрагмента зависит от смысла. Если внутри предложения встречается полноценная цитата на английском, оберните именно её, сохранив русский текст снаружи: <q lang="en">We will be in touch</q>. Если язык меняется на несколько предложений, задайте lang всему абзацу. Если в абзаце несколько длинных сменяющих друг друга отрывков, пометьте каждый самостоятельный фрагмент. Не приходится дублировать атрибут на внутренних словах того же отрывка: вложенные элементы наследуют язык от ближайшего предка с lang.
В полном примере структура может выглядеть так: <html lang="ru">...<p>Редактор оставил примечание: <span lang="en">Please keep the original spelling.</span> После него текст снова читается по-русски.</p>...</html>. Элемент-обёртка может быть span, q, blockquote или другим подходящим по смыслу HTML-элементом. Выбирайте элемент по функции фрагмента; значение lang само по себе ничего не говорит о том, является ли он цитатой, заголовком или подписью.
Один случай особенно удобен для редакторских систем: если целый блок набран на другом языке, задайте язык самому блоку, а не оборачивайте каждое предложение. Например, для английского абзаца внутри русской статьи укажите <p lang="en">.... Если цитата на французском вложена в этот абзац, отдельная французская обёртка уточнит смену языка. По окончании цитаты язык английского абзаца восстановится автоматически.
Решите, действительно ли перед вами смена языка
Не всякое слово иностранного происхождения требует отдельной метки. «Бренд», «контент» и «дедлайн» давно употребляются в русском тексте как заимствования. Если слово встроилось в русскую фразу, читатель ожидает русского произношения и грамматики, а не переключения на исходный язык. WCAG прямо исключает из требования ряд технических терминов и слов, ставших частью обихода окружающего языка. Для типичной русской статьи не нужно размечать каждое такое слово как английское.
Иное дело — предложение, намеренно оставленное на языке оригинала, имя или название, произношение которого важно, либо фрагмент на письменности, отличной от языка страницы. Для имени собственного W3C называет указание языка хорошей практикой, хотя пояснение к критерию приводит его как пример, не обязательный для каждого имени случая. Оценивайте задачу читателя: сможет ли экранный диктор разумно произнести запись без этой информации? Если имя — предмет обсуждения или часто встречается в статье, метка может помочь; если это известное русское написание бренда в обычной фразе, не надо добавлять атрибут только из-за происхождения названия.
Смешанный набор письменностей сам по себе не доказывает смену языка. Русский текст может включать латинское сокращение, модель устройства или название файла; для многих таких фрагментов язык остаётся русским либо не имеет смысла. И наоборот, транслитерированная фраза может быть французской или арабской по языку, даже если написана латиницей. Смотрите на человеческий язык выражения, а не только на вид букв.
Как выбрать значение lang
Для распространённых языков используйте короткую метку вроде en для английского, fr для французского или de для немецкого. Когда действительно важно уточнить региональный вариант, можно выбрать сочетание языка и региона, например pt-BR для бразильского португальского. Если регион не влияет на обработку текста, короткой метки языка достаточно. Не используйте код страны как самостоятельную замену коду языка: GB обозначает регион, а не английский язык.
HTML требует валидную языковую метку BCP 47. Не угадывайте значение по двухбуквенному коду страны, не добавляйте регион «для точности» без редакторской причины и не придумывайте собственные сокращения. Если неизвестно, какой язык у фрагмента, пустое значение lang="" согласно спецификации обозначает неизвестный язык; это не режим автоматического распознавания. Для обычного материала надёжнее установить нужную метку по содержимому и проверить её валидатором HTML.
Не смешивайте язык с гарнитурой и стилем
Атрибут lang не переводит фразу, не меняет её текст и не загружает шрифт. Он сообщает языковую информацию разметке. Шрифтовой fallback настраивается CSS и покрытием нужных знаков в файлах шрифта. Курсив, цвет или кавычки выбираются стилями. Можно использовать CSS-псевдокласс :lang(en), если конкретному языку действительно нужен стиль или тип кавычек, но сам факт добавления lang не должен быть способом задать визуальный акцент.
Не маскируйте отсутствующую языковую метку курсивом, другой гарнитурой или визуальной подписью «английский текст». Эти признаки могут быть полезны человеку, но не сообщают программно браузеру, что произносить фрагмент следует по другим языковым правилам. И наоборот: метка не заменит понятного оформления цитаты или указания перевода, если это важно для читателя.
Рабочий процесс редактора и разработчика
При подготовке статьи полезно добавить проверку языка в момент, когда автор вставляет цитату, а не в самом конце верстки. Редактор может пометить цитату как «английский оригинал», передать редактору сайта язык и диапазон текста, а компонент публикации сформирует HTML-обёртку с нужным атрибутом. Для длинного отрывка компонент может назначать метку всему блоку. Это снижает риск как пропусков, так и избыточных атрибутов на каждом слове.
При проверке включите режим чтения экранного диктора или протестируйте фрагмент в доступной конфигурации браузера, синтезатора речи и языка голоса. Сначала убедитесь, что основное значение на <html> верно; затем проверяйте только содержательные переключения. Разное произношение между синтезаторами возможно и не означает автоматически, что HTML-разметка ошибочна. Проверка помогает заметить, например, что англоязычная цитата читается голосом русского языка, но окончательное решение учитывает и выбранный читателем голос.
Если в публикационной системе текст проходит санитайзер, проверьте, что он сохраняет разрешённый атрибут lang на нужном HTML-элементе. Некоторые редакторы удаляют неизвестные атрибуты или превращают вставленный HTML в обычный текст. В результате исходная версия статьи выглядит правильно в редакторе, но на опубликованной странице метки нет. Смотрите итоговый DOM страницы или валидированный исходный HTML, а не только визуальный предпросмотр в CMS.
Чек-лист перед публикацией
- Установлен основной язык документа или контейнера статьи.
- Иностранная цитата или целый фрагмент отмечены на ближайшем уместном элементе.
- Язык возвращается к значению родителя после завершения фрагмента; соседний текст не помечен случайно.
- Значение — корректная языковая метка, а регион добавлен только при реальной необходимости.
- Обычные заимствования не размечены как отдельный иностранный отрывок без редакторской причины.
- После публикации CMS не удалила атрибут, а чтение проверено хотя бы на одном целевом сочетании браузера и синтезатора.
Частые ошибки
- Ставить
lang="en"на целый русский абзац ради одного заимствованного слова — экранный диктор может сменить произношение всего блока. - Задавать язык каждой букве или каждому слову одной цитаты — разметка становится хрупкой и сложной для сопровождения.
- Считать, что
lang="en-US"обязательно точнееlang="en", даже если регион не важен для содержимого. - Заменять языковую метку курсивом, кавычками или подписью к цитате — это визуальные сигналы, а не программное определение языка.
- Полагать, что скринридеры всегда одинаково озвучивают тег
lang— результат зависит от поддерживаемых голосов и пользовательской конфигурации. - Проверять только редакторскую форму, не убеждаясь, что атрибут пережил публикацию и попал в итоговую разметку.
Частые вопросы
Нужно ли указывать lang для одного иностранного слова?
Не всегда. Если слово стало обычным заимствованием в русском языке или это технический термин, WCAG допускает такие исключения. Если слово явно произносится на исходном языке и правильное звучание помогает понять текст, локальная метка может быть хорошей практикой.
Как указать основной язык страницы на русском?
Добавьте lang="ru" к корневому элементу <html>. Для отдельного фрагмента другого языка задайте его значение на ближайшем элементе, который содержит весь такой фрагмент.
Нужно ли указывать lang у имени бренда?
Для каждого бренда это не обязательно. Если речь идёт об обычном русском названии, отдельная метка может мешать привычному произношению. Для важного иностранного имени, чьё звучание помогает понять материал, можно отметить язык как хорошую практику.
Меняет ли lang внешний вид шрифта?
Нет. lang описывает язык содержимого, но не выбирает гарнитуру и не меняет начертание. Внешний вид регулируется CSS; браузер также подбирает шрифтовой fallback по доступным знакам, но это отдельный механизм.
Можно ли задавать язык для целого предложения?
Да. Задайте атрибут абзацу или другому элементу с этим предложением. Если в нём есть более короткая цитата на третьем языке, добавьте вложенную метку только для этой цитаты.
Что делать, если язык фрагмента неизвестен?
Не угадывайте. HTML допускает пустое значение lang="", чтобы обозначить неизвестный язык, но это не включает автоматическое распознавание. Для публикуемой цитаты лучше уточнить язык у автора или редактора и задать точное значение.
Заключение
Ставьте lang там, где действительно меняется язык чтения: задайте основной язык документа, отметьте самостоятельную цитату или абзац и позвольте вложенным элементам наследовать метку. Такой подход делает языковую структуру понятнее браузерным инструментам и вспомогательным технологиям, не перегружая HTML случайными атрибутами. Если вы готовите собственный рукописный шрифт для многоязычных статей, создайте его в Fontgenerator, а перед публикацией проверьте и покрытие знаков, и языковую разметку текста.