Last updated on August 21st, 2026 at 01:05 pm
The main lesson: use the lang attribute on the <html> element to declare a page’s language. A short code such as de is valid when the regional variation does not matter.
What I learned
A general German-language page can start like this:
<!doctype html>
<html lang="de">The language code helps browsers, screen readers, translation tools, spell-checkers, and search engines interpret the text correctly.
Choose the right language code
- Use a two-letter language code for a general language, such as
en,de,es, orit. - Add a regional code only when the distinction matters, such as
en-US,en-GB,de-AT, orpt-BR. - Keep the language in lowercase and the region in uppercase for readability.
For example, lang="de" means German in general. lang="de-AT" identifies German as used in Austria.
Handle right-to-left languages
Some languages need an explicit text direction. For Arabic, the document element can include both attributes:
<html lang="ar" dir="rtl">rtl means right to left. For languages written left to right, dir="ltr" is usually unnecessary because that is the default.
Mark language changes inside the page
If a small section uses a different language, add lang to that element instead of changing the whole page:
<p>The French word is <span lang="fr">bonjour</span>.</p>Link translated versions correctly
When translated pages exist, hreflang can identify the language of each alternate URL:
<link rel="alternate" hreflang="en" href="https://example.com/en/">
<link rel="alternate" hreflang="de" href="https://example.com/de/">This is separate from lang: lang describes the current document, while hreflang describes an alternate page.
Common mistakes
- Cause: using a country code as if it were a language. Fix: start with the language code and add a region only when needed.
- Cause: setting only
hreflang. Fix: also setlangon the current document. - Cause: using obsolete content-language metadata. Fix: use the HTML
langattribute. - Cause: forgetting text direction for Arabic or Hebrew. Fix: add
dir="rtl".
Conclusion
Use the simplest accurate value. For a general German page, the concrete next action is to set <html lang="de"> and add a regional code only if the content truly targets one region.