Welcome to the HTML tutorial! In this tutorial, you will learn the basics of HTML (Hypertext Markup Language), which is the standard language used to create web pages. HTML is the foundation of all web development and is used to create the structure and content of a web page.
HTML consists of a series of tags that are used to define various parts of a web page. These tags are enclosed in angle brackets (< >) and are used to create headings, paragraphs, links, images, lists, forms, and more.
To get started with HTML, you’ll need a text editor to write your code and a web browser to view your web pages. You can use any text editor to write HTML, but some popular ones include Notepad++, Sublime Text, and Visual Studio Code.
Let’s dive into the basics of HTML!
HTML Document Structure:
An HTML document consists of the following components:
The document type declaration:
The first line of an HTML document declares the document type. This is called a doctype declaration, and it tells the browser what version of HTML the document is using. For HTML5, the doctype declaration is:
The HTML element:
The HTML element is the root element of an HTML document. It contains two main sections: the head section and the body section. Here’s an example of what the HTML element
<!DOCTYPE html> <html> <head> <!-- Head content goes here --> </head> <body> <!-- Body content goes here --> </body> </html>
The head section:
The head section contains information about the document, such as the page title, metadata, and links to external resources like stylesheets and scripts. Here’s an example of what the head section looks like:
<!DOCTYPE html> <html> <head> <title>My Page Title</title> <meta charset="utf-8"> <link rel="stylesheet" href="style.css"> </head> <body> <!-- Body content goes here --> </body> </html>
The body section:
The body section contains the main content of the document, such as headings, paragraphs, images, links, and more. Here’s an example of what the body section looks like:
<!DOCTYPE html> <html> <head> <title>My Page Title</title> <meta charset="utf-8"> <link rel="stylesheet" href="style.css"> </head> <body> <h1>Welcome to my website</h1> <p>This is a paragraph of text.</p> <img src="image.jpg" alt="An image"> <a href="http://www.example.com">Click here</a> to visit example.com. </body> </html>
These are the basic components of an HTML document. In the following sections, we’ll dive deeper into HTML tags and how they’re used to create different types of content.