# Declare language and text direction in multilingual HTML

Canonical: https://githtml.com/guides/language-and-direction-html-documents
Published: 2026-09-26
Publisher: WaveTech LLC / gitHtml

Declare the document's main language on the html element and mark passages that use another language when appropriate. Set text direction explicitly where needed rather than trying to simulate it with alignment. Check mixed-language labels, numbers, and code examples in the finished artifact, because their reading order can be more complex than ordinary paragraphs.

## Separate language from direction

Language metadata identifies the language of content; direction determines how text flows. These are related but not interchangeable concepts. Aligning a paragraph to the right does not establish right-to-left text behavior. Likewise, a language declaration alone is not a substitute for deliberately handling direction in a multilingual document.

Begin with the language used for most of the report. Mark substantial passages in another language so assistive reading tools have better context for pronunciation. Do not label code identifiers as a different natural language merely because they use English-like words. Focus on meaningful prose passages, quotations, and interface labels where the language change matters.

## Review mixed-content boundaries

Technical reports often mix natural language with URLs, version numbers, file paths, and code. Those fragments can behave awkwardly inside right-to-left prose if their boundaries are unclear. Use the appropriate semantic direction tools and inspect the result rather than manually rearranging characters to make one screenshot look correct.

Prefer logical layout properties when adapting the document's spacing to different directions. A margin at the start of a line should follow the reading direction instead of always being attached to the physical left side. Keep code examples in an explicitly appropriate direction and verify their copied text, since a visually confusing sample can become an operational mistake.

## Test with real language content

Placeholder Latin text will not reveal the problems found in a real bilingual report. Use representative names, punctuation, numbers, and mixed-script sentences. Ask a fluent reviewer to assess the result when the language is outside your competence. Automated checks can detect missing attributes but cannot establish whether the writing or pronunciation is correct.

1. Set the main document language accurately.
2. Mark meaningful language changes in prose.
3. Use direction metadata instead of visual alignment alone.
4. Inspect URLs, numbers, and code in mixed-direction sections.
5. Review pronunciation and reading order with suitable assistive technology when available.

````html
<html lang="en">
<body>
  <p>The interface label is <span lang="fr">Paramètres</span>.</p>
  <p lang="ar" dir="rtl">مثال على فقرة عربية</p>
</body>
</html>
````

## Sources and further reading

- [MDN: lang global attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/lang)
- [MDN: dir global attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir)

## Related guides

- [Describe architecture diagrams as relationships, not shapes](https://githtml.com/guides/text-descriptions-for-architecture-diagrams)
- [Give data tables headers that survive nonvisual reading](https://githtml.com/guides/accessible-data-table-headers)
- [Write links that remain meaningful outside their paragraph](https://githtml.com/guides/descriptive-links-html-reports)
- [Keep an HTML report readable when text is enlarged](https://githtml.com/guides/zoom-and-reflow-html-reading)

Editorial approach: https://githtml.com/guides/about
