The VS Code plugin Emmet has a lot of shortcuts that are very helpful in web development.
We do this :
html:5
We get this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
Life made simple.
But what's the fun when it's that simple?
So, lets learn about this boilerplate code. The devil's in the detail.
This is called a doctype(short for document type) declaration. It tells the web browser what markup language is used in the current document.
This declaration is case insensitive. And it must be placed at the top of the webpage before any other tag to make sure that the page is displayed as intended.
There different markup languages for which doctype is used :
For HTML5:
<!DOCTYPE html>
For XHTML:
<DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD /xhtml11.dtd">
The lang attribute of the html tag is used to set the language of text on the webpage.
This attribute accepts values as two letter ISO language code.
Example, French : <html lang="fr" >
Hindi : <html lang="hi" >
This attribute is used by search engines to understand that the page is in that particular language and hence returns language specific results.
Also, screen readers use this to determine the language so as to correctly read and pronounce the text content.
The charset attribute of meta tag is used to specify the character encoding for the HTML document.
UTF stands for Unicode Transformation Format 8-bit. It supports any unicode character, which means any language character (Roman, Devanagari, Latin, etc) as well as many non-spoken languages (Music notation, mathematical symbols, etc).
The most commonly used character encodings are UTF-8 and ISO character encodings.
UTF-8 is understood by most web browsers and hence it's widely used.
That's good knowledge. Kudos!!