Stage1: Introduction to HTML
What is HTML?
HTML stands for HyperText Markup Language. It is the standard markup language used for creating webpages and web applications. HTML uses a set of tags to define the structure and layout of a webpage. These tags are used to format text, add images, create links, and perform various other functions.
The Structure of an HTML Document
An HTML document is composed of several elements, which are enclosed within opening and closing tags. The basic structure of an HTML document includes the following:
- <!DOCTYPE html>: This declaration tells the browser that the document is written in HTML5.
- <html>: This is the root element that wraps around all other elements of the document.
- <head>: This element contains meta-information about the webpage, such as the title of the page, character encoding, and links to CSS stylesheets.
- <body>: This element contains the visible content of the webpage, such as text, images, links, and other HTML elements.
Basic HTML Tags
HTML tags are used to mark up different parts of the webpage. Here are some commonly used HTML tags:
1. Heading Tags
Heading tags are used to define the headings or titles of different sections in a webpage. There are six levels of heading tags, from <h1> to <h6>. The <h1> tag represents the main heading of the page, while the <h2> to <h6> tags represent subheadings.
2. Paragraph Tags
The <p> tag is used to define a paragraph of text. It is often used to enclose a block of text that forms a logical unit. For example:
<p>This is a sample paragraph.</p>
3. Link Tags
The <a> tag is used to create hyperlinks. It requires two essential attributes: href (specifying the URL of the link) and text (specifying the text to be displayed for the link). For example:
<a href=\"https://www.example.com\">Click here</a>
4. Image Tags
The <img> tag is used to insert images into a webpage. It requires the src attribute (specifying the URL of the image file) and optional attributes like alt (providing alternate text if the image cannot be displayed) and width / height for specifying the dimensions of the image. For example:
<img src=\"image.jpg\" alt=\"Sample Image\" width=\"300\" height=\"200\">
These are just a few examples of the many HTML tags available. HTML provides a wide range of tags for various purposes, including text formatting, lists, tables, forms, and more.
HTML Attributes
HTML attributes provide additional information about HTML elements. They are specified within the opening tag of an element. For example, the <a> tag can have attributes like target (specifying where to open the linked document) or class (defining a class for the element). Attributes are defined using the format: attribute=\"value\". Multiple attributes can be added to an element by separating them with spaces. For example:
<a href=\"https://www.example.com\" target=\"_blank\">Click here</a>
Conclusion
In this stage, we learned about the basics of HTML, including its structure, common tags, and attributes. HTML serves as the foundation for building webpages and is an essential skill for any web developer. In the next stage, we will explore more advanced elements and concepts of HTML.
