In this tutorial, we will learn about the Basics of HTML. By the end of the tutorials, you will create your own web page.
What is the Basics of HTML?
HTML stands for HyperText Markup Language. It is a standard markup language used for creating a website. HTML is not a programming language. It is a markup language that defines a structure of an HTML Web page.
All the HTML documents start with document type and the HTML file itself starts with an opening tag and closes with a closing tag.
After HTML we need to start the head with the opening tag and close with the closing tag. The head contains the meta description about the web pages and all also contain the external Javascript and CSS.
The Title tag starts with the opening tag and closes with the closing tag. The title contains the title of the web page and it is shown on the browser title bar.
In the HTML file, the visible part starts with the opening tag and closes with the closing tag. The body contains all the visible content like the heading of web page tag, paragraph tag, hyperlinks, images, lists, tables, button tag, icons etc.
What are HTML Tags and Attributes?
The Tags and Attributes is a basic of HTML which is used inside the opening tag of HTML elements. The attributes control the element’s behavior. Some basic attributes are like Accesskey, class, data, dir, hidden, contenteditable, contextmenu, id, lang, style, tabindex, title, draggable, dragzone, aria, align, onDblClick, onClick, onKeyDown, onKeyPress, onKeyUp, onMouseDown, onMouseMove, onMouseOut, onMouseOver, onMouseUp, role, alt, etc.
The following example of an attribute is:
<p class="abc">The Basics of HTML </p>
<button hidden>Submit</button>
<img src="image path here" alt="HTML TUTORIALS"/>In the above example the class, hidden, src, and alt is an attribute of tag <p>, <button> and <img>.
Before creating the basic HTML web page, We need to know about some basic HTML tags.
<!doctype html>: The “doctype html” is a Declaration defines that this document is an HTML5 document.
<html>: The html is a root element where we are writing an HTML code.
<head>: The head contains the meta description about the web pages and all also contain the external javascript and CSS.
<meta charset=”utf-8″>: Character encoding of the HTML web page. It also store the information about the document.
<title>Basics of HTML</title>: The Title contain the title of the web page.
<body>: The body contains all the visible content like the heading of web, content, etc.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="The information about the document.">
<meta name="author" content="HTML Tutorials">
<title>The Basics of HTML</title>
</head>
<body>
<p>Welcome to the HTML Tutorials</p>
</body>
</html>The Heading Tags
- <H1>Heading tag 1</H1>
- <H2>Heading tag 2</H2>
- <H3>Heading tag 3</H1>
- <H4>Heading tag 4</H1>
- <H5>Heading tag 5</H1>
- <H6>Heading tag 6</H1>
The <h1> and <h2> is the most important heading tag in HTML web page. And its also play the important role in website SEO.
The Paragraph Tag
The HTML <p> the component represents a paragraph within the webpage. The paragraph is open with opening <p> and close with closing tag </p>.
Example
<p>This is a paragraph tag.</p>The IMG tag
The img tag is basically used to display the images on the web page like logo, gallery, slider show etc.
Example
<img src="images/logo.png" alt="" />The anchor link
The anchor tag plays an important role in any website. With the help of an anchor tag, we can redirect the web page from one page to another page.
<a href="about.html"> About Us </a>
Conclusion
If you follow the instructions in the above article you will create a simple web page.
To create the simple navigation bar please check out the link Create a Vertical menu & Horizontal Navigation Bar using HTML CSS
Share this:
Related Post
