Boilerplate
In web design, boilerplate code or boilerplate refers to a section of HTML that must be included on each page with little or no alteration.
the most basic HTML boilerplate might look something like this:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>My Website</title>
</head>
<body>
</body>
</html>But what does it all mean?
Let's start at the top with <!DOCTYPE html>. This piece of code tells the browser that the page it's about to read is written in HTML. the DOCTYPE declaration isn't an HTML tag, it's just information that the browser needs to know.
in older versions of HTML, this piece of code had to be much more complicated.
Next, we have <html lang="en" dir="ltr">. This is the first HTML tag. It's an opening tag (the closing tag </html> is at the end of the boilerplate). This tag has two attributes, lang for language which is en for English, and dir for direction with is ltr for "left to right".
The <html> tags represent the root of an HTML document. The <html> tag is the container for all other HTML elements.
The <head> tags are a container for metadata and is opened and closed after the <html> opening tag.
Metadata refers to information about an HTML document. The metadata is not shown in the browser viewport.
The document title, character set, styles, scripts, and other meta information are often defined via metadata.
The <meta charset="utf-8"> tag defines an element of metadata, in this case charset for the character set, utf-8 is the most common character encoding method used on the internet today, and is the default character set for HTML5.
<meta name="description" content="Free Web tutorials"><meta name="keywords" content="HTML, CSS, JavaScript"><meta name="author" content="John Doe"><meta name="viewport" content="width=device-width, initial-scale=1.0">
A <title> tags is used to set the name of the page, that will appear in the browser tab, or bookmark when saved.
No Comments