0% found this document useful (0 votes)
3 views21 pages

HTML

The document provides an overview of the Internet, defining it as a global network of computing resources and detailing its components such as the World Wide Web (WWW), HTTP, URLs, web servers, and web browsers. It explains how the web works, including the roles of DNS and ISPs, and highlights various web browsers and servers available. Additionally, it discusses the advantages of having a website, including 24/7 availability, increased customer reach, cost savings, advertising opportunities, brand image creation, and customer satisfaction.

Uploaded by

Computer science
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
3 views21 pages

HTML

The document provides an overview of the Internet, defining it as a global network of computing resources and detailing its components such as the World Wide Web (WWW), HTTP, URLs, web servers, and web browsers. It explains how the web works, including the roles of DNS and ISPs, and highlights various web browsers and servers available. Additionally, it discusses the advantages of having a website, including 24/7 availability, increased customer reach, cost savings, advertising opportunities, brand image creation, and customer satisfaction.

Uploaded by

Computer science
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

What is Internet?

The Internet is essentially a global network of computing resources. You can think of the Internet as a
physical collection of routers and circuits as a set of shared resources.

Some common definitions given in the past include −

A network of networks based on the TCP/IP communications protocol.

A community of people who use and develop those networks.

Internet-Based Services

Some of the basic services available to Internet users are −

Email − A fast, easy, and inexpensive way to communicate with other Internet users around the world.

Telnet − Allows a user to log into a remote computer as though it were a local system.

FTP − Allows a user to transfer virtually every kind of file that can be stored on a computer from one
Internet-connected computer to another.

UseNet news − A distributed bulletin board that offers a combination news and discussion service on
thousands of topics.

World Wide Web (WWW) − A hypertext interface to Internet information resources.

What is WWW?

WWW stands for World Wide Web. A technical definition of the World Wide Web is − All the resources
and users on the Internet that are using the Hypertext Transfer Protocol (HTTP).

A broader definition comes from the organization that Web inventor Tim Berners-Lee helped found, the
World Wide Web Consortium (W3C): The World Wide Web is the universe of network-accessible
information, an embodiment of human knowledge.

In simple terms, The World Wide Web is a way of exchanging information between computers on the
Internet, tying them together into a vast collection of interactive multimedia resources.

What is HTTP?

HTTP stands for Hypertext Transfer Protocol. This is the protocol being used to transfer hypertext
documents that makes the World Wide Web possible.

A standard web address such as [Link] is called a URL and here the prefix http indicates its protocol

What is URL?

URL stands for Uniform Resource Locator, and is used to specify addresses on the World Wide Web. A
URL is the fundamental network identification for any resource connected to the web (e.g., hypertext
pages, images, and sound files).
A URL will have the following format −

protocol://hostname/other_information

The protocol specifies how information is transferred from a link. The protocol used for web resources is
HyperText Transfer Protocol (HTTP). Other protocols compatible with most web browsers include FTP,
telnet, newsgroups, and Gopher.

The protocol is followed by a colon, two slashes, and then the domain name. The domain name is the
computer on which the resource is located.

Links to particular files or subdirectories may be further specified after the domain name. The directory
names are separated by single forward slashes.

What is Website?

Currently you are on our website [Link] which is a collection of various pages written in
HTML markup language. This is a location on the web where people can find tutorials on latest
technologies. Similarly, there are millions of websites available on the web.

Each page available on the website is called a web page and first page of any website is called home page
for that site.

What is Web Server?

Every Website sits on a computer known as a Web server. This server is always connected to the internet.
Every Web server that is connected to the Internet is given a unique address made up of a series of four
numbers between 0 and 256 separated by periods. For example, [Link] or [Link].

When you register a Web address, also known as a domain name, such as [Link] you have to
specify the IP address of the Web server that will host the site.

We will see different type of Web servers in a separate chapter.

What is Web Browser?

Web Browsers are software installed on your PC. To access the Web you need a web browsers, such as
Netscape Navigator, Microsoft Internet Explorer or Mozilla Firefox.

Currently you must be using any sort of Web browser while you are navigating through my site
[Link]. On the Web, when you navigate through pages of information this is commonly
known as browsing or surfing.

We will see different type of Web browsers in a separate chapter.

What is SMTP Server?

SMTP stands for Simple Mail Transfer Protocol Server. This server takes care of delivering emails from
one server to another server. When you send an email to an email address, it is delivered to its recipient
by a SMTP Server.
What is ISP?

ISP stands for Internet Service Provider. They are the companies who provide you service in terms of
internet connection to connect to the internet.

You will buy space on a Web Server from any Internet Service Provider. This space will be used to host
your Website.

What is HTML?

HTML stands for Hyper Text Markup Language. This is the language in which we write web pages for
any Website. Even the page you are reading right now is written in HTML.

This is a subset of Standard Generalized Mark-Up Language (SGML) for electronic publishing, the
specific standard used for the World Wide Web.

What is Hyperlink?

A hyperlink or simply a link is a selectable element in an electronic document that serves as an access
point to other electronic resources. Typically, you click the hyperlink to access the linked resource.
Familiar hyperlinks include buttons, icons, image maps, and clickable text links.

What is DNS?

DNS stands for Domain Name System. When someone types in your domain name, [Link],
your browser will ask the Domain Name System to find the IP that hosts your site. When you register
your domain name, your IP address should be put in a DNS along with your domain name. Without doing
it your domain name will not be functioning properly.

What is W3C?

W3C stands for World Wide Web Consortium which is an international consortium of companies
involved with the Internet and the Web.

The W3C was founded in 1994 by Tim Berners-Lee, the original architect of the World Wide Web. The
organization's purpose is to develop open standards so that the Web evolves in a single direction rather
than being splintered among competing factions. The W3C is the chief standards body for HTTP and
HTML.

Web - How it Works ?

On the simplest level, the Web physically consists of the following components −

Your personal computer − This is the PC at which you sit to see the web.

A Web browser − A software installed on your PC which helps you to browse the Web.

An internet connection − This is provided by an ISP and connects you to the internet to reach to any
Website.
A Web server − This is the computer on which a website is hosted.

Routers & Switches − They are the combination of software and hardware who take your request and pass
to appropriate Web server.

The Web is known as a client-server system. Your computer is the client and the remote computers that
store electronic files are the servers.

How the Web Works

When you enter something like [Link] the request goes to one of many special computers on the
Internet known as Domain Name Servers (DNS). All these requests are routed through various routers
and switches. The domain name servers keep tables of machine names and their IP addresses, so when
you type in [Link] it gets translated into a number, which identifies the computers that serve the
Google Website to you.

When you want to view any page on the Web, you must initiate the activity by requesting a page using
your browser. The browser asks a domain name server to translate the domain name you requested into an
IP address. The browser then sends a request to that server for the page you want, using a standard called
Hypertext Transfer Protocol or HTTP.

The server should constantly be connected to the Internet, ready to serve pages to visitors. When it
receives a request, it looks for the requested document and returns it to the Web browser. When a request
is made, the server usually logs the client's IP address, the document requested, and the date and time it
was requested. This information varies server to server.

An average Web page actually requires the Web browser to request more than one file from the Web
server and not just the HTML / XHTML page, but also any images, style sheets, and other resources used
in the web page. Each of these files including the main page needs a URL to identify each item. Then
each item is sent by the Web server to the Web browser and Web browser collects all this information and
displays them in the form of Web page.

In Short

We have seen how a Web client - server interaction happens. We can summarize these steps as follows −

A user enters a URL into a browser (for example, [Link]. This request is passed to a domain name
server.

The domain name server returns an IP address for the server that hosts the Website (for example,
[Link]).

The browser requests the page from the Web server using the IP address specified by the domain name
server.

The Web server returns the page to the IP address specified by the browser requesting the page. The page
may also contain links to other files on the same server, such as images, which the browser will also
request.
The browser collects all the information and displays to your computer in the form of Web page.

Web - Browser Types

Web Browsers are software installed on your PC. To access the Web, you need a web browser, such as
Netscape Navigator, Microsoft Internet Explorer or Mozilla Firefox.

Currently you must be using any sort of Web browser while you are navigating through our site
[Link]. On the Web, when you navigate through pages of information, this is commonly
known as web browsing or web surfing.

There are four leading web browsers − Explorer, Firefox, Netscape, and Safari, but there are many others
browsers available. You might be interested in knowing Complete Browser Statistics. Now we will see
these browsers in bit more detail.

While developing a site, we should try to make it compatible to as many browsers as possible. Especially
sites should be compatible to major browsers like Explorer, Firefox, Chrome, Netscape, Opera, and
Safari.

Internet Explorer

Internet Explorer (IE) is a product from software giant Microsoft. This is the most commonly used
browser in the universe. This was introduced in 1995 along with Windows 95 launch and it has passed
Netscape popularity in 1998.

You can download a latest version of this browser by clicking here → Download Internet Explorer

Google Chrome

This web browser is developed by Google and its beta version was first released on September 2, 2008 for
Microsoft Windows. Today, chrome is known to be one of the most popular web browser with its global
share of more than 50%.

You can download a latest version of this browser by clicking here → Download Google Chrome

Mozilla Firefox

Firefox is a new browser derived from Mozilla. It was released in 2004 and has grown to be the second
most popular browser on the Internet.

You can download a latest version of this browser by clicking here → Download Firefox

Safari Browser

Safari is a web browser developed by Apple Inc. and included in Mac OS X. It was first released as a
public beta in January 2003. Safari has very good support for latest technologies like XHTML, CSS2 etc.

You can download a latest version of this browser by clicking here → Download Safari
Opera Browser

Opera is smaller and faster than most other browsers, yet it is full- featured. Fast, user-friendly, with
keyboard interface, multiple windows, zoom functions, and more. Java and non Java-enabled versions
available. Ideal for newcomers to the Internet, school children, handicap and as a front-end for CD-Rom
and kiosks.

You can download a latest version of this browser by clicking here → Download Opera

Konqueror Browser

Konqueror is an Open Source web browser with HTML 4.01 compliance, supporting Java applets,
JavaScript, CSS 1, CSS 2.1, as well as Netscape plugins. This works as a file manager as well as it
supports basic file management on local UNIX filesystems, from simple cut/copy and paste operations to
advanced remote and local network file browsing.

You can download a latest version of this browser by clicking here → Download Konqueror

Lynx Browser

Lynx is a fully-featured World Wide Web browser for users on Unix, VMS, and other platforms running
cursor-addressable, character-cell terminals or emulators.

You can download a latest version of this browser by clicking here → Download Lynx

Web - Server Types

Every Website sits on a computer known as a Web server. This server is always connected to the internet.
Every Web server that is connected to the Internet is given a unique address made up of a series of four
numbers between 0 and 255 separated by periods. For example, [Link] or [Link].

When you register a web address, also known as a domain name, such as [Link] you have to
specify the IP address of the Web server that will host the site. You can load up with Dedicated Servers
that can support your web-based operations.

There are four leading web servers − Apache, IIS, lighttpd and Jagsaw. Now we will see these servers in
bit more detail.

Apart from these Web Servers, there are other Web Servers also available in the market but they are very
expensive. Major ones are Netscape's iPlanet, Bea's Web Logic and IBM's WebSphere.

Apache HTTP Server

This is the most popular web server in the world developed by the Apache Software Foundation. Apache
web server is an open source software and can be installed on almost all operating systems including
Linux, Unix, Windows, FreeBSD, Mac OS X and more. About 60% of the web server machines run the
Apache Web Server.
You can have Apache with tomcat module to have JSP and J2EE related support.

You can have detailed information about this server at Apache HTTP Server

IIS Server Internet Information Services

The Internet Information Server (IIS) is a high performance Web Server from Microsoft. This web server
runs on Windows NT/2000 and 2003 platforms ( and may be on upcoming new Windows version also).
IIS comes bundled with Windows NT/2000 and 2003; Because IIS is tightly integrated with the operating
system so it is relatively easy to administer it.

You can have detailed information about this server at Miscrosoft IIS

lighttpd Server

The lighttpd, pronounced lighty is also a free web server that is distributed with the FreeBSD operating
system. This open source web server is fast, secure and consumes much less CPU power. Lighttpd can
also run on Windows, Mac OS X, Linux and Solaris operating systems.

You can have detailed information about this server at lighttpd

Sun Java System Web ServerSun Java System Web Server

This web server from Sun Microsystems is suited for medium and large websites. Though the server is
free it is not open source. It however, runs on Windows, Linux and Unix platforms. The Sun Java System
web server supports various languages, scripts and technologies required for Web 2.0 such as JSP, Java
Servlets, PHP, Perl, Python, Ruby on Rails, ASP and Coldfusion etc.

You can have detailed information about this server at Sun Java System Web Server

Jigsaw Server

Jigsaw (W3C's Server) comes from the World Wide Web Consortium. It is open source and free and can
run on various platforms like Linux, Unix, Windows, Mac OS X Free BSD etc. Jigsaw has been written
in Java and can run CGI scripts and PHP programs.

You can have detailed information about this server at Jigsaw Server

Web - Site Advantages

If you are constructing a Website, then we hope you are aware of its advantages as well. Here, in this
chapter, we have listed out a few major advantages of keeping a website.

Business is Open 24x7

This means that once you put your business onsite, then your business is open 7 days a week and 365
days a year. Even if you are in different locations of the world then you will be able to serve your
customers on 24x7 hours basis.

Increased Customer Base


Because anyone in the world can see your website so you will gain customers from other states and
countries while you are putting in the same amount of effort and money.

Tremendous Cost Saving

This is one of the biggest advantages of having a business online. You do not need to keep a big man
power and lot of resources to maintain a business on site. There are many other cost saving opportunities
while keeping business online. Think of how many cards you mail out to let customers know about your
sale. All of that can be eliminated by putting the sale information on your website and inviting your
customers to visit it.

Advertising Opportunities

Apart from saving your advertising cost, you have additional opportunities to run advertisements from
other companies and start making money. If you ever advertised in a local newspaper, you know the
costs. You are being charged per line, per inch, and per color. On the Web, there is no limit to how much
you can put. So whenever there is a new product or service, then you can advertise it in a better way.

Creates a Brand Image

Internet is a great medium through which you can create any image of yourself which you want. It is all in
your hands. For example, you can design a professional website, add helpful content, and your company
will immediately take a step up in the image it represents. No matter how small your business is, with the
right tools and a great desire you can make it look like a corporation on the Web.

Customer Satisfaction

If you have a really good site online, then you can give your customers a lot of satisfaction in terms of
customer care. You can keep online help, FAQ, and other important information which is useful for your
customers. You can create online forums for open discussion and you can conduct customer survey to
take customer feedback etc.

Showcase Your Work

Whether you are a real estate agent, construction business owner or a beauty salon specialist − you can
put your work on display when you have a website. Anytime a potential client wants to see your past
work and projects, simply refer him or her to your site. No need to scan and mail pictures, or bring your
client to a finished building project.

What is HTML ?

HTML stands for Hypertext Markup Language. It is a standard markup language used to design the
documents displayed in the browsers as a web page. This language is used to annotate (make notes for the
computer) text so that a machine can understand it and manipulate text accordingly. Most markup
languages (e.g. HTML) are human-readable.

HTML Full Form


HTML (Hypertext Markup Language) is a standard markup language used to design web pages. It
describes the structure of a web page and consists of a series of elements. HTML tells the browser how to
display the content, making it a crucial part of web development.

This language can become more interactive and attractive by using CSS ( Cascading Style Sheet) and JS
(JavaScript) within it. Now each point in HTML full form can be described as:

Breakdown of HTML

Hypertext: Refers to the connections between pages through hyperlinks.

Markup: Defines the page layout and elements within the page.

Language: Combines both features to create Hypertext Markup Language.

History of HTML

Initially, HTML was released in 1993 and developed by Tim Berners-Lee in 1990. Currently, the Web
Hypertext Application Technology Working Group (WHATWG) community is working on the HTML
development. The current HTML5 version has gained so much popularity because of its newly added
features in it. All the website's skeleton is made of HTML and each browser performs on that and makes
that visible and user-friendly to the user.

HTML Version Release Year

HTML Structure

The basic HTML structure includes:

Doctype declaration
HTML element

Head element

Body element

The HTML structure contains the minimum number of HTML tags to run the HTML code onm browser.
The structure of HTML document are given below:

<!DOCTYPE html>

<html>

<head>

<title>

<!-- title bar -->

</title>

<!-- header for the website -->

</head>

<body>

<!-- body section of the website -->

</body>

</html>

Characteristics of HTML

Easy to understand: It is the most straightforward language you can say, very easy to grasp this
language and easy to develop.

Flexibility: This language is so much flexible that you can create whatever you want, a flexible way to
design web pages along with the text.

Linkable: You can make linkable text like users can connect from one page to another page or website
through these characteristics.

Limitless features: You can add videos, GIFs, pictures, or sound anything you want that will make the
website more attractive and understandable.

Support: You can use this language to display the documents on any platform like Windows, Linux, or
Mac.
Not a Programming Language: HTML is not a programming language as it is only concerned with
presenting the information on the web. It is not used to program any logic but to give structure and
semantically meaning to our website. Though we can link JavaScript code to it which is a programming
language.

Language Support: HTML can support various other languages like JavaScript, Ruby, PHP, Perl, and
many more. You can also able to run embed python during the runtime.

Advantages of HTML

HTML is easy to learn, easy to apply and it's totally free you will just need a text editor and a browser.

HTML is supported by all the browsers and it is the most friendly search engine.

HTML can easily integrate with other languages and is easy to develop.

It is the basic of all programming languages and the lightest language ever.

In HTML, the display changes frequently depending on the window size or the device size making it
comfortable to read by the user.

Disadvantages of HTML

HTML can be used to create only static Web-page, it can not create dynamic web-page.

There is a lack of security in HTML.

Creating a simple Web-page required so many tags.

HTML language is not centralised i.e. all the web pages that are connected, you have to design them
separately else need to use CSS.

HTML becomes complex when you try to create a huge website.

HTML Editors

An HTML Editor is a software application designed to help users create and modify HTML code. It often
includes features like syntax highlighting, tag completion, and error detection, which facilitate the coding
process.

There are two main types of HTML editors:

Text-Based Editors - Allow direct coding with features like syntax highlighting and code completion for
full control over the webpage structure. Example - Sublime Text, Visual Studio Code, etc.

WYSIWYG (What You See Is What You Get) Editors - Offer a graphical interface to design web pages
visually, automatically generating the corresponding HTML code. Example - Adobe Dreamweaver, etc.

HTML Editors List


There are various free and paid HTML editors available in the market, but in this article, we will be
covering some renowned free HTML editors that you can use as a beginner or switch to if you are an
experienced developer.

Table of Content

1. Notepad

2. Brackets

3. Sublime Text Editor

4. Atom

5. Visual Studio Code

1. Notepad

Notepad is a simple text editor that is also used to write HTML code. It is an inbuilt desktop application
available in Windows OS.

Steps to Write HTML Code in Text Editor:

Step 1: Open any of the text editors of your choice. Here we are using the Notepad text editor.

HTML editor - open Notepad

Step 2: Create new file: File->New File or Ctrl+N.

create new file

Step 3: Write HTML code in text editor.

write html code


Step 4: Save the file with a suitable name of your choice and a .html extension.

save file

Step 5: Open the saved HTML file in your favorite browser (double-click on the file, or right-click - and
choose "Open with").

open in browser

2. Brackets

Brackets is an open-source software primarily used for Web development. It provides live HTML, CSS,
and JavaScript editing functionality. Similar to the Notepad editor, create a new file and save it with
a .html extension to run the HTML file.

3. Sublime Text Editor

Sublime is a cross-platform code editor tool. It supports all markup languages and is used as an editor for
HTML. Similar to the Notepad editor, create a new file and save it with a .html extension to run an
HTML file.
4. Atom

Atom is an open-source code editor tool for MAC, Linux, and Windows. We can use Atom to write and
edit HTML code. Similar to the Notepad editor, create a new file and save it with a .html extension to run
an HTML file.

5. Visual Studio Code

It is one of the most popular code editors of today's generation. Many companies and software developers
prefer this online HTML code editor.

Step 1: Open the VS code Editor and Install the Live Server. By clicking the extension button simply
search live server on the search bar and download. Live server extension helps to run the code and display
output.

Step 2: Create a new File and save it with the .html extension and use the open live server button to click
the right button.

Reasons to Use an HTML Editor

Editors for HTML offer several advantages to writing and editing HTML codes. Some benefits of using
HTML editors are:
Syntax Highlighting: HTML editors use color-coding to distinguish tags, attributes, and content, making
code more readable.

Autocompletion: These editors suggest tags and correct common errors, improving coding speed.

Code Validation: Built-in validators check for syntax issues and missing tags.

Debugging Tools: Some editors offer debugging features to identify and fix errors.

Customization Options: Customize the interface and settings to enhance your coding experience.

How to Choose the Right HTML Editor?

When selecting an HTML editor, consider the following factors:

Skill level: Beginners might prefer WYSIWYG editors for ease of use, whereas advanced users may opt
for text-based editors for better control.

Project needs: Larger projects might benefit from a more robust editor with extensive features and
integrations.

Compatibility: Ensure the editor supports other technologies you plan to use like CSS, JavaScript, or
various frameworks.

HTML file example

[Link]

Why Learn HTML?

Here are 5 common reasons to learn HTML:

Build Websites: HTML is the basic building block for creating any website. Learning HTML can help
you pursue a career in web development.

Customize Content: Allows you to edit or tweak web pages, emails, or templates to fit your needs.

Understand how the web works: This helps you grasp how the internet works and how web pages are
structured.

Employment Opportunities: According to the Bureau of Labor Statistics, projects that employment for
web developers will grow 16% between 2022 and 2032, which is much faster than the average across all
occupations.

Learn Easily: HTML is beginner-friendly, making it a great first step into the world of coding and
technology.

Applications of HTML

Web Development: HTML is the backbone of every webpage. It structures the content and integrates
multimedia, hyperlinks, and more.
Web Applications: HTML, in combination with CSS and JavaScript, powers complex web applications
(e.g., Google Docs, Trello).

Emails: HTML emails use table-based layouts and embedded media to deliver rich, interactive content.

Mobile App Development: HTML5 is used with frameworks like PhoneGap to build mobile apps for
iOS and Android.

Limitations of HTML

No Logic or Functionality: HTML cannot handle complex logic, interactivity, or dynamic content on its
own. It requires JavaScript for such tasks.

SEO Limitations: While HTML provides structure, it’s not enough by itself for search engine
optimization (SEO). Proper metadata and content structuring, as well as external SEO practices, are
necessary.

Limited Styles: While HTML can handle basic styles via the style attribute, it is typically complemented
by CSS for complex styling and layout.

HTML5: Enhancements and New Features

HTML5 Introduced several powerful features that improve the structure and functionality of web pages,
including:

Semantics: New tags like <article>, <footer>, <header>, and <section> to improve the meaning of the
content.

Multimedia: <audio> and <video> tags for embedding audio and video without plugins.

APIs: New APIs like Geolocation, Web Storage, and Canvas allow for more dynamic content and
interactive websites.

What is an HTML Tag?

An HTML tag is a piece of markup language used to indicate the beginning and end of an HTML element
in an HTML document.

As part of an HTML element, HTML tags help web browsers convert HTML documents into web pages.
For example, the <p> tag is used to organize text content into paragraph elements and the <img> tag is
used to embed image elements.

Many tags, though not all, use an opening tag and closing tag to wrap around the content that they are
used to modify. Closing tags are denoted with a backslash like this: </tag_name>. HTML tags are not
visible in the browser.

The following diagram illustrates how tags are commonly used in HTML elements:
Opening Tag Closing Tag Description

<h1> to <h6> </h1>to</h6> Headings. H1 is the main heading, H2 is secondary, etc.

<p> </p> Paragraph

<div> </div> A container for a block of content

<span> </span>A container for in-line content, such as content inside a paragraph.

<em> </em> Gives the contained text emphasis (usually as italics).

<strong> </strong> Makes the contained text bold.

<a href = "document location"> </a> Link

<ol> </ol> Ordered (numbered) list

<ul> </ul> Unordered (bulleted) list

<li> </li> List item, must be nested inside a list element such as a <ol> or <ul>

<!-- --> Comment. Anything between these tags is not displayed on the screen. This is useful for
making notes to yourself or to others who may view the source code of the web page.

HTML5 Semantic Tags

HTML5 introduced several new tags called semantic tags. These tags were designed to communicate the
function of blocks of content that were common on many web pages. Prior to HTML5, developers just
used <div> tags for all blocks.

Opening Tag Closing Tag Description

<header> </header> Contains introductory content for a page (e.g., a banner), or a section of a
page.

<nav> </nav> Contains navigation content, such as a website navigation menu.

<main> </main> Contains the main content of the web page.

<aside></aside> Contains content that is tangentially related to the main content of the page (often
this is presented in a sidebar).
<footer> </footer> Contains the footer of a page, or of a section of a page. Typically the
footer contains information about the content, such as the author and a copyright statement.

Empty (Non-Container) Tags

Tag Description

<br /> Line break.

<img src ="image location" alt="alternate text" /> Inserts an image into a web page.

Tables

Opening Tag Closing Tag Sample Attributes Description

<table> </table> Adds a table

<tr> </tr> Table row (start & end).

<th> </th> scope="row"

scope="col" When creating a table to display data, use this tag to differentiate the first row or column
of cells as heading cells for all the other cells in the same column or row. Browsers typically display this
element bold and centered within the table cell. The scope attribute defines whether this is a row header
or column header.

<td> </td> Table data cell.

colspan="number" Use with <th> or <td> elements. Spans cells across multiple
columns.

rowspan="number" Use with <th> or <td> elements. Spans cells across multiple
rows.

HTML tags are the foundation of web pages, providing the structure and organization needed to display
content on a browser. They are instructions to the browser, defining how elements should be rendered.
Tags are always enclosed in angle brackets < and >.

Here's a breakdown of HTML tags:

Elements:

Tags define HTML elements, which are the building blocks of a web page.

Structure:

Tags help organize and structure the content, making it easier to read and understand.

Display:

Tags tell the browser how to display elements, such as text, images, links, and more.
Purpose:

Different tags have different purposes, ranging from creating headings to embedding images and creating
tables.

Examples:

<h1>...</h1>: Defines a heading.

<p>...</p>: Defines a paragraph.

<img>: Embeds an image.

<a>: Creates a hyperlink.

Opening and Closing:

Many tags have an opening tag (e.g., <p>) and a closing tag (e.g., </p>). The closing tag is indicated by a
forward slash before the tag name.

Attributes:

Tags can have attributes that provide additional information about an element, like specifying a link's
target or an image's source.

What are HTML tags?

HTML tags are special keywords that specify how a web browser must format and display the content.
Tags are wrapped in brackets < and >. They start with an open angle bracket (<) and close with a closed
angle bracket (>). The ending tag has a forward slash before the name of the element. They can nest (be
placed) inside one another.

HTML Tag Syntax:

<example>The first tag is the opening tag that indicates the start, while the second tag is the closing tag
that depicts the end </example>.

For Example –

<p>This is a paragraph</p>

Copy code

Stay updated with the latest blogs on online courses and skills

Enter Mobile Number

In the above example, the opening <p> tag indicates the start of a new paragraph. The </p> is the closing
tag that ends it.
Why do we need to open and close HTML tags?

Opening and closing HTML tags are crucial because they outline the structure and content of a webpage,
allowing the browser to know how to render the information. Here's a detailed breakdown:

Purpose of Opening and Closing Tags:

Opening Tag: Marks the beginning of an element. For instance, <p> indicates the start of a paragraph.

Closing Tag: Marks the end of that element. For example, </p> tells the browser the paragraph ends.

Together, these tags help encapsulate content, ensuring that the webpage layout and styling remain
organized and predictable.

Importance in Browser Interpretation:

The browser reads in HTML code sequentially. One missing closing tag can make it puzzling for the
browser, so it will render an unexpected overlap or misplaced element. For example, a browser might try
to consider all the following elements as part of that <div>, which will cause positioning issues.

Error Prevention and Debugging:

When debugging HTML, developers often look for missing closing tags. The browser developer console
or validation services usually point to such errors.

Self-Closing Tags:

Not all tags require a closing counterpart. Self-closing tags represent elements that don't contain any
content. Examples include:

<img> for embedding images

<br> for line breaks


<hr> for horizontal rules

unit 2

You might also like