-
HTML Choosing Editors
-
HTML Basic Structure
-
HTML Head
-
HTML Element
-
HTML Attribute
-
HTML Headings
-
HTML Paragraphs
-
HTML Style
-
HTML Formatting
-
HTML Colors
-
HTML CSS
-
HTML Comments
-
HTML Links
-
HTML Images
-
HTML Table
-
HTML List
-
HTML Block and Inline
-
HTML Class & Id
-
HTML iFrames
-
HTML JavaScript
-
HTML File Paths
-
HTML Layout
-
HTML Responsive
-
HTML Style Guide
-
HTML Forms
Introduction to HTML
If you’re stepping into the world of web development, HTML is your starting point. But what exactly is HTML and why do you need it?
What is HTML?
HTML stands for HyperText Markup Language. It’s the language used to create the structure of web pages. Think of it as the skeleton of a webpage, it provides the framework that holds everything together.
Why Do You Need HTML?
HTML is essential for web development because it defines the structure of web pages. Without HTML, web browsers wouldn’t know how to display content properly. It’s the foundation upon which all web content is built.
Understanding HTML Structure
HTML uses markup to describe the structure of web pages. The structure is built up by elements, each represented by tags. These tags label pieces of content such as headings, paragraphs, tables, and more. While these tags aren’t visible on the page, they’re crucial for organizing and presenting content in different ways.
A Simple HTML Document
Let’s see HTML in action with an example:
Here’s how it works:
1. <!DOCTYPE html> tells the browser that the document is written in HTML5.
2. <html> is the main container of the entire webpage.
3. <head> holds meta-information about the page, like its title.
4. <title> sets the title of the webpage, which appears in the browser’s tab.
5. <body> contains the visible content of the webpage, like text and images.
6. <h1> creates a big heading on the page.
7. <p> creates a paragraph of text.
Understanding HTML Tags
HTML tags usually come in pairs, a start tag and an end tag. The end tag is similar to the start tag but with a forward slash before the tag name. This structure helps browsers understand where elements begin and end, ensuring content is displayed correctly.
Web Browsers
Web browsers like Chrome, Firefox, and Safari read HTML documents and show them to us on our screens. They don’t show the HTML tags themselves; they use them to figure out how to display the webpage.
HTML Page Structure
This is how an HTML page is structured:
<html>
<head>
<title>Page title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>
Everything inside the <body> tag is what we see on the webpage. And the text inside the <title> tag is what appears on the browser’s tab.
