HTML Language Codes
In this page:
The lang Attribute
The lang attribute is used inside your opening html tag to declare the primary language of your webpage, which is essential for accessibility and search engine optimization.
Note: Always declare the primary language of your page inside your opening html tag.
Warning: Failing to set the correct language tag can cause screen readers to read your text with an incorrect pronunciation.
Example: The lang Attribute
<html lang="en">
</html>
Standard Two-Letter Language Codes
HTML uses standard two-letter ISO 639-1 language codes (like en for English, es for Spanish, or de for German) to define webpage languages.
Note: Always use lowercase letters when writing your two-letter language codes.
Warning: Using custom, non-standard language codes can cause browser rendering and translation errors.
Example: Standard Two-Letter Language Codes
<html lang="es">
</html>
Specifying Regional Language Variants
Languages often have regional variations. You can specify these variations by appending a two-letter ISO 3166-1 country code (like en-US for American English, or en-GB for British English) to your language tag.
Note: Use regional language tags to customize your pricing tables, dates, and spelling for specific countries.
Warning: Write the country code in uppercase letters, separated from the language code by a hyphen.
Example: Specifying Regional Language Variants
<html lang="en-US">
</html>
Accessibility and Language Codes
When visually impaired users open a webpage, screen readers use your lang attribute to select the correct pronunciation voice. Declaring correct language codes is essential for keeping your site accessible.
Note: If a specific paragraph or word is written in a different language, apply a local lang attribute to that tag.
Warning: Leaving out language tags can cause screen readers to read foreign text using default English pronunciation, making it unreadable.
Example: Accessibility and Language Codes
<p lang="fr">Bonjour tout le monde</p>
SEO and Translation Benefits
Search engines use your lang attribute to serve your pages to users in relevant countries. Browsers also use this tag to display translation banners automatically when users load pages in other languages.
Note: Declare language tags to help search engines index your pages for international search results.
Warning: Using incorrect language tags can confuse search bots and lower your page ranking.
Example: SEO and Translation Benefits
<html lang="de">
<title>Willkommen</title>
</html>
- Forgetting to include the lang attribute inside your opening html tag.
- Using non-standard or misspelled language codes that browsers fail to parse.
- Writing country codes in lowercase letters or separating them with underscores instead of hyphens.
- The lang attribute declares the primary language of your webpage inside your opening html tag.
- Use standard two-letter ISO 639-1 language codes, appending a two-letter country code for regional variations.
- Apply local lang attributes to specific tags to help screen readers pronounce foreign words correctly.
Standard language codes and attributes are natively supported by all modern web browsers.
Chapter Quiz — Complete all 9 topics to unlock
0/9 topics done
Complete these topics first: