Introduction to HTML5 elements html, head, body, title
Some of the major HTML5 semantic tag elements are <html>, <head>, <body>, <title>, <body>, and <title> tags to design and develop a particular web page website layout structure in HTML5 hypertext web development script. All these HTML5 tags play an important role in web page design and web development. These tags help in shaping and designing the proper layout framework of HTML5 web page from start to end, where every HTML5 tag is designed and developed for a unique purpose.
So let’s know about the major semantic tags in HTML5.
HTML5 <html> Tag.
The <html> tag or element in HTML5 hypertext web development script is a fundamental tag in HTML web page document design structure. It combines and binds all other HTML5 tag elements in HTML5, i.e. all the tags of a web page developed in HTML5 work together to create a web page.
HTML5 lang attributes.
HTML5 lang attributes – It indicates the language of your current web page or the default language in the search engine or web browser. For example, lang=”en” for an English web page, lang=”hi” for a Hindi web page, lang=”fr” for a French web page, etc.
Example of HTML5 lang attributes.
<!DOCTYPE html>
<html lang=”hi”>
<!—write your desire html web content here –>
</html>
HTML5 <head> Tag.
The use of <head> tag in HTML5 web development is to display HTML5 document design meta information in the designed web page. Generally, information stored in head tag is not displayed in web browser, but it plays an important role in HTML web page. HTML5 head tag links and connects information such as web page character encoding, web page title, external CSS link, JavaScript file link, etc. in the web page meta information.
HTML5 head tag elements.
- HTML <meta> info – Displays character encoding and web page mobile zoom viewport settings in the current HTML5 web page.
- HTML web page <title> – Displays the document title of the current HTML5 web page file, the web page title is displayed in the web browser title bar tab.
- HTML file <link> – Links to external CSS stylesheet attributes in the current HTML5 web page.
- HTML <style> styles – Applies internal CSS styles to an existing HTML5 web page.
- HTML <script> link – Connects an existing HTML5 web page to JavaScript source code.
Head Tag Example in HTML5.
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Head Tag In Html</title>
<link rel=”stylesheet” href=”styles.css”>
<script defer src=”script.js”></script>
</head>
HTML5 <body> tag.
HTML5 <body> tag element displays all HTML5 tags and attributes written in the designed web page by adding them, it displays all the text information, images, multimedia, website, web page, object as body previewed in the web page layout displayed in the client web browser.
HTML5 Body Tag Elements.
- HTML5 <header> tag – Creates header menu, header link, or web page, website navigational link in an HTML5 web page.
- HTML5 <nav> tag – Creates navigation links for an existing HTML5 web page.
- HTML5 <main> tag – Creates and displays document information in an HTML5 web page.
- HTML5 <section> tag – Groups text, links, or digital information in an existing HTML5 web page and displays it in sections.
- HTML5 <article> tag – Represents a self-contained article in HTML5 text in an existing web page.
- HTML5 <footer> tag – Displays important footer information in the footer of the existing HTML5 web page document, such as website copyright information and website contact information etc.
Body Tag Example in HTML5.
<!DOCTYPE html>
<html>
<body>
<header>
<h1>Simple Html Body Tag</h1>
<nav>
<ul>
<li><a href=”#”>Home</a></li>
<li><a href=”#”>Blog</a></li>
<li><a href=”#”>About Us</a></li>
<li><a href=”#”>Contact Us</a></li>
<li><a href=”#”>Disclaimers</a></li>
</ul>
</nav>
</header>
<footer>
<p>Copuright at © 2024 Vcanhelpsu</p>
</footer>
</body>
</html>
HTML5 <title> tag.
The use of <title> tag element in any HTML5 web page displays the web page title information. Remember, the web page title is displayed in a new tab or open web browser title bar window tab in the web browser. Generally, the title tag displays the title of a web page in the web browser.
Title Tag Example in HTML5.
<head>
<title>You Can Add Your Web Page Title Here </title>
</head>
Use of all common tags or attributes in HTML5 web page.
So, let’s create a web page in HTML5 using common tags <html>, <head>, <body> and <title> elements.
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>All Html Semantic Tag</title>
<link rel=”stylesheet” href=”styles.css”>
</head>
<body>
<header>
<h2>Common Html Semantic Attributes</h2>
</header>
<main>
<section>
<h3>HTML5</h3>
<p>HTML5 Is The Modern Web Development Script Help Us To Design Responsive Web Page</p>
</section>
</main>
<footer>
<p align=center><b>Copyright at © 2024Vcanhelpsu</b></p>
</footer>
</body>
</html>
