Chapter 1: Introduction to HTML

1.1 What is HTML?

HTML (Hypertext Markup Language) is the standard markup language used to create web pages. It is the backbone of every website on the internet. HTML allows developers to structure the content of a web page by using tags and elements, defining the layout, formatting, and linking various resources.

1.2 Evolution of HTML

HTML has evolved over time with several versions being released.

The initial version, HTML 1.0, was released in 1991, followed by HTML 2.0 in 1995.

HTML 3.2 introduced new features and better support for tables and forms. HTML 4.01 was released in 1999, providing enhanced support for dynamic content and scripting.

HTML5, the latest major version, was finalized in 2014 and introduced a wide range of new features, including multimedia support, semantic elements, and better form handling.

1.3 HTML Document Structure

An HTML document consists of a structured hierarchy of elements. It starts with the document type declaration, known as the doctype, which defines the version of HTML being used. The document structure includes the element, which encapsulates the entire web page content. Inside the element, we have the and elements.

My First Heading

My first paragraph.

My First Heading

My first paragraph.

––––––––

The element contains meta-information about the web page, such as the title, linking to external stylesheets, and specifying character encoding. The element holds the visible content of the web page.

1.4 HTML Tags and Elements

HTML tags are used to define different elements on a web page. Tags are enclosed in angle brackets (<>). For example, the

tag represents a heading,

represents a paragraph, and represents a hyperlink. Elements are made up of opening and closing tags, and the content placed between them. Some elements, like line breaks (
), don't require a closing tag.

1.5 HTML Attributes

HTML attributes provide additional information about an element. They are placed within the opening tag of an element. Attributes consist of a name and a value, separated by an equals sign (=).

Attributes usually come in name/value pairs like: name=value

For example:-

1.  The href Attribute

the href attribute in an tag specifies the URL to link to. Attributes can modify an element's behavior, appearance, or provide additional data.

https://www.google.com>Google

Google

2.  The src Attribute

The tag is used to embed an image in an HTML page. The src attribute specifies the path to the image to be displayed:

img_river.jpg>

3.  The width and height Attributes

The tag should also contain the width and height attributes, which specify the width and height of the image (in pixels):

img_river.jpg width=300 height=500>

4.  The alt Attribute

The required alt attribute for the tag specifies an alternate text for an image, if the image for some reason cannot be displayed.

img_river.jpg alt=river flowing>

5.  The style Attribute

The style attribute is used to add styles to an element, such as color, font, size

color:red;>This is a red paragraph.

6.  The lang Attribute

You should always include the lang attribute inside the tag, to declare the language of the Web page. This is meant to assist search engines and browsers.

en>

example specifies English as the language

1.6 HTML Comments

HTML comments are used to add explanatory or descriptive text within the code. They are not rendered as visible content on the web page. HTML comments start with . Comments are useful for documenting code or temporarily disabling certain sections during development.

1.7 HTML Editors and Tools

There are numerous HTML editors and tools available to create and edit HTML documents. Some popular editors include:

Sublime Text: A versatile text editor with features specifically designed for web development.

Visual Studio Code: A lightweight and customizable editor with excellent HTML support and an extensive library of extensions.

Adobe Dreamweaver: A comprehensive web development tool with a visual interface for creating and editing HTML documents.

Notepad++: A simple and lightweight text