<html> tag and how to set more than one document language.

Not to be confused with all the html tags, this is this <html> tag. It is the parent of all other tags or one can say this is the root tag. The only thing that is outside this element is the document declaration ‘<!DOCTYPE html>’.

the html tag

The HTML element contains a start tag , the content and the end tag. The content contains all the other elements such as the <body>, <head> and others.

The lang attribute

The most important attributes that must always be used with the  html tag is the lang attribue.

The lang attribute specifies the language of the content inside the html tag, this doesn’t mean that the language of the html tags or attributes but the content that is written for the user, for instance language of all the headings , paragraphs. image titles and so on.

It has various advantages, Screen Readers can read the text in the accent specified in the lang attribute. Robots also make use of the lang attribute to determine which language is the text in.

All the child elements inherit the lang attribute from the html tag, so you don’t have to specify the language of each and every element inside the html tag. The language English is specified by ‘en’, list of all the languages code can be found in the table ISO 639-1 on this page

Declaring more than one language in a HTML Document

You can only have one language assigned to the html element. But this doesn’t mean your document can only contain one language,  multiple languages can be used on the same page for different elements by overriding the lang attributes value of the tag for which you want to use a different language.

Re declaring the lang attribute does the job as shown below.

The html elements set the language for the whole document as English , the first paragraph in the body tag, doesn’t explicitly set the language but it inherits the English language from the parent <html> tag.  But as the second paragraph is in French, so we override the <p> tag’s lang value to Fr (French).

CommentsLoad Comments