UNIT-1

INTERNET AND THE WORLDWIDE WEB

WHAT IS INTERNET?
• A computer network consisting of a worldwide network of computers that use the
TCP/IP network protocols to facilitate data transmission and exchange.
• The Internet is a global system of interconnected computer networks that use the
standard Internet Protocol Suite (TCP/IP) to serve billions of users worldwide.
• The term Internet actually refers to the combined collection of academic, commercial,
and government networks connected over international telecommunication backbones
and routed using IP addressing.

KEY MILESTONES IN INTERNET HISTORY

• 1969: Launch of ARPANET, the first operational packet-switching network.
• 1971: The first email is sent by Ray Tomlinson.
• 1983: Adoption of TCP/IP as the standard protocol for ARPANET.
• 1989-1990: Tim Berners-Lee invents the World Wide Web.
• 1993: The first graphical web browser, Mosaic, is released.
• 1998: Google is founded, revolutionizing search engines.
• 2007: The iPhone introduces widespread mobile Internet access.
• 2010s: Rise of cloud computing, social media, and streaming services.

APPLICATIONS OF INTERNET
Here are some key applications of the internet:
1. Communication: Email, instant messaging, video conferencing (e.g., Zoom, Skype).
2. Information Sharing: Access to websites, blogs, e-books, and news platforms.
3. E-Commerce: Online shopping, auctions, and payment systems (e.g., Amazon, eBay,
PayPal).
4. Social Networking: Platforms like Facebook, Twitter, Instagram for connection and
interaction.
5. Entertainment: Streaming music, videos, games, and movies (e.g., Netflix, Spotify).
6. Education: Online courses, virtual classrooms, and e-learning platforms (e.g., Coursera,
Khan Academy,nptel).
7. Healthcare: Telemedicine, online consultations, and health information systems.
 8. Banking and Finance: Online banking, stock trading, and cryptocurrency transactions.
9. Cloud Computing: Data storage and SaaS applications like Google Drive and Microsoft
365.
10. IoT and Smart Devices: Controlling and monitoring smart homes, wearables, and
industrial IoT.
11. Research and Development: Access to scientific journals, datasets, and research
forums.
EMAIL
Electronic mail (also known as email or e-mail) is one of the most commonly used services on
the Internet, allowing people to send messages to one or more recipients.
• Emailwasinvented by Ray Tomlinson in1972.
• Electronic mail is a method of exchanging digital messages from an author to one or more
recipients.
• Modern email operates across the Internet or other computer networks. Today's email systems
are based on a store-and-forward model.
• Email servers accept, forward, deliver and store messages. Neither the users nor their
computers are required to be online simultaneously; they need connect only briefly, typically
to an email server, for as long as it takes to send or receive messages.
• An email message consists of three components, the message envelope, the message header,
and the message body.
• Header contains information about who sent the message, the recipient(s) and the route.
• Header also usually contains descriptive information, such as a subject header field and a
message submission date/timestamp.
• Email message body contains text (7bit ASCII) as well as multimedia messages. These
processes are declared in Multipurpose Internet Mail Extensions (MIME). MIME is set of
RFCs (Request for Comment)
• Network based emails are exchanged over the internet using the SMTP (Simple Mail Transfer
protocol).
STRUCTURE OF EMAIL
The structure of an email consists of the following key components:
1. Header
Contains metadata about the email, including:
• From: The sender's email address.
• To: The recipient's email address(es).
• Cc: Carbon Copy; recipients visible to all other recipients.
• Bcc: Blind Carbon Copy; recipients invisible to others.
• Subject: A brief description of the email's content.
• Date: The timestamp when the email was sent.
• Reply-To: (Optional) The email address to which replies should be sent.
2. Body
The main content of the email:
• Plain Text or HTML Content:
o Plain Text: Simple text without formatting.
o HTML: Richly formatted content with text styles, images, and hyperlinks.
• Sections: May include greetings, the main message, and a closing signature.
3. Attachments
Files or documents attached to the email, such as PDFs, images, or other file formats.
4. Footer
• Email signature: Contains the sender's contact details, designation, or company info.
• Disclaimers or legal notices: (Optional) Often used in professional emails.
5. Encoding (Technical Aspect)
• MIME (Multipurpose Internet Mail Extensions): Allows for attachments and non-
text content.
• Content-Type: Specifies the format (e.g., text/plain or text/html).

TELNET
Telnet is a network protocol used in any network (internet or LAN) for bidirectional text
oriented communication.
• telnet standard was defined in 1973, before which it was considered as a dhocprotocol.
• Original purpose of the telnet protocol was to login to the remote computers on the network.
• Telnet protocol uses ‘virtual terminal’ to connect to the remote hosts.
• Virtual terminal is a application service that allows host in a multi terminal network to
communicate with other hosts irrespective of terminal type or characteristics.
• Telnet uses the TCP protocol for transmission of 8 byte data.
• Most network equipment and operating systems with a TCP/IP stack support a Telnet service
for remote configuration (including systems based on Windows NT)
• The term telnet may also refer to the software that implements the client part of the protocol.
• Telnet is a client server protocol, which is based upon reliable connection oriented
communication transport and basic use of telnet is to make a connection to the TCP protocol.
• Data transferred over telnet is vulnerable as telnet does not use any encryption technique to
mask or protect the data.
• Most implementations of Telnet have no authentication that would ensure communication is
carried out between the two desired hosts and not intercepted in the middle.
• Commonly used Telnet daemons have several vulnerabilities discovered over the years.
• Extensions to the Telnet protocol provide Transport Layer Security (TLS) security and Simple
Authentication and Security Layer (SASL) authentication that address the above issues.
• Few applications of telnet include the ‘putty’ TCP client which can access a linux server using
windows operating system, Absolute telnet (windows client) and RUMBA (terminal emulator).

FTP
• File transfer protocol is a simple and standard network protocols that transfers a file from one
host to the other over a TCP network.
• Based on client server architecture.
• Utilizes separate control and data connection for client and server to transmit and receive
file(s) over the network.
• Itis an application protocol that uses the internet’s TCP/IP suite.
• Mainly used to transfer the web pages or related data from the source or creator to a host that
acts as a server to make the page or file available to other hosts (uploading) or downloading
programs and other files from server to a host.
• FTPprotocol can perform over a active or passive connection.
• When a connection is made from the client to server, it is called as control connection and it
remains open for duration of session. This connection is responsible for establishing
connectivity between client and server.
• Other connection opened by client (passive) or server (active) is called data connection and
is used to transfer the data.
• Asseparate ports are used by client and server for these connections, FTP becomes an put of
band protocol.
• Datatransfer can take place in following three modes o Stream mode : data is sent in a
continuous stream where FTP does not do any formatting.
o Block mode: FTP breaks the data into several blocks (block header, byte count, and data
field) and then passes it on to TCP.
o Compressed mode: Data is compressed using a single algorithm.
• FTP is a old protocol and is basically low in security aspect. Data transferred over FTP is not
encrypted and is in clear text format.
Hence the data like usernames, passwords can be read by anyone who can capture the FTPed
package. Newer versions of the protocol, however, apply secure shell protocol (SSH) and avoid
all the problems faced by FTP.
• Following are few types of FTP protocol with additional features
• Anonymous FTP : Users login using an ‘anonymous’ account to protect their confidential
data.
• Remote FTP: FTP commands executed on a remote FTP server FTP with web browser and
firewall support. Secure FTP (SFTP,FTPS)

E-COMMERCE AND E-BUSINESS

E-Commerce : E-Commerce refers to the performing online commercial activities,
transactions over internet. It includes activities like buying and selling product, making
monetary transactions etc over internet. Internet is used for E-commerce. Websites and
applications (apps) are required for e-commerce. it is mainly connected with the end process
of flow means connected with the end customer.
Examples of E-Commerce are online retailers like amazon, flipkart, Myntra, paytm mall, seller
of digital goods like ebooks, online service etc.
Activities of E-Commerce are :
• Buying and selling product online
• Online ticketing
• Online Payment
• Paying different taxes
• Online accounting software
• Online customer support
2. E-Business : E-Business refers to performing all type of business activities through internet.
It includes activities like procurement of raw materials/goods, customer education, supply
activities buying and selling product, making monetary transactions etc over internet. Internet,
intranet, extranet are used in e-business. Websites, apps, ERP, CRM etc are required for e-
business.
Examples of E-Business are e-commerce companies and its various internal business
activities, auction site, classified site, software and hardware developer site etc.
Activities of E-Business are :
• Online store setup
• Customer education
• Buying and selling product
• Monetary business transaction
• Supply Chain Management
• E-mail marketing

INTERNET SERVICE PROVIDER

AnInternet service provider (ISP) is a company that provides access to the Internet, hosts data,
or does both. ISP is also known as IAP (internet access provider) Access ISPs connect
customers to the Internet using copper, wireless or fibre connections.
Hosting ISPs lease server space for smaller businesses and host other people servers
(colocation)..
• As internet gained popularity, it was essential to provide internet access to many people or
many hosts. Due to the increasing demand to access internet, commercial ISP came into
existence in1990. Technologies used For users and small business applications
• Dialupconnection
 • DSL(digital subscriber line)
• Broadband wireless connection
• Cablemodem
• Fibre optical connection
For medium to large businesses or for other ISPs,
• DSL
• Ethernet
• Gigabyte Ethernet
• Framerelay
• Satellite Ethernet
• ISPconnections

ISPs which provide connections through phone lines like dial ups, do not seek any information
about the caller’s (user of the internet) physical location or address. So, caller from any location
which is in reach of the ISP, can use the services provided. Other way of getting connected
through ISP is using cable or any other lines. Here, fixed registration of the user at the ISP side
is essential.
•Services provided
ISP host usually provide e mail, FTP and web hosting services. Other services can be like
virtual machines, clouds or entire physical servers where clients can run their own softwares.
ISPs often take services from their upstream ISPs. i.e. they work in hierarchy. The ISPs are
divided into three categories
•Peering : ISPs taking services from upstream and getting connected to each other to exchange
data and to control network traffic through peering points, orinternetex change points. These
points help save one more upstream ISP and cut down on the cost. The ISPs which do not need
upstream ISP are called Tier 1 ISP.
• Virtual ISP (VISP) : this is an ISP which purchases services from other ISP and gives them
to the end user, without any set up of its own.
•Free ISP: these are ISPs which provide services free of cost to the users and display
advertisements till the users are connected. These are called as freenets. These are normally
run on no profit basis.
DOMAIN NAME SERVER
The Domain Name System (DNS) is like the internet’s phone book. It helps you find websites
by translating easy-to-remember names (like www.example.com) into the numerical IP
addresses (like 192.0.2.1) that computers use to locate each other on the internet. Without DNS,
you would have to remember long strings of numbers to visit your favorite websites.

What is the Need for DNS?

Every host is identified by the IP address but remembering numbers is very difficult for people
also the IP addresses are not static therefore a mapping is required to change the domain name
to the IP address. So DNS is used to convert the domain name of the websites to their numerical
IP address.
DOMAINNAMES
Domain names are human-readable addresses used to identify and access websites on the
internet. They serve as a way for users to easily find websites without having to remember
complex numerical IP addresses. Here's a breakdown of domain names:
Structure of a Domain Name
A domain name consists of two main parts:
1. Second-Level Domain (SLD):
o This is the unique part of the domain that identifies the website. For example,
in "google.com", "google" is the second-level domain.
2. Top-Level Domain (TLD):
o This is the suffix or extension that appears after the second-level domain.
Common TLDs include .com, .org, .net, .edu, and country-specific TLDs like
.uk, .ca, and .in.
o TLDs are divided into two categories:
▪ Generic TLDs (gTLDs): These include common extensions like .com,
.org, .net, .info, and more.
▪ Country Code TLDs (ccTLDs): These are specific to countries (e.g.,
.us for the United States, .de for Germany).
3. Subdomain:
o A subdomain is an optional prefix added to the domain. For example, in
"blog.google.com", "blog" is a subdomain of the domain "google.com".

Example of a Domain Name

In the domain name "www.example.com":
• "www" is a subdomain (often used for web access).
• "example" is the second-level domain (SLD).
• ".com" is the top-level domain (TLD).

Inverse Domain
The inverse domain is used for mapping an address to a name. When the server has received a
request from the client, and the server contains the files of only authorized clients. To determine
whether the client is on the authorized list or not, it sends a query to the DNS server and ask
for mapping an address to the name.

DNS Servers Involved in Loading a Webpage

Upon loading the webpage, several DNS Servers are responsible for translating the domain
name into the corresponding IP Address of the web server hosting the website. Here is the list
of main DNS servers involved in loading a Webpage.
• Local DNS Resolver
• Root DNS Servers
 • Top-Level Domain (TLD) DNS Servers
• Authoritative DNS Servers
• Web Server
What is DNS Resolver?
DNS Resolver is simply called a DNS Client and has the functionality for initiating the
process of DNS Lookup which is also called DNS Resolution. By using the DNS Resolver,
applications can easily access different websites and services present on the Internet by using
domain names that are very much friendly to the user and that also resolves the problem of
remembering IP Address.

Working of DNS
o DNS is a client/server network communication protocol. DNS clients send requests to
the. server while DNS servers send responses to the client.
o Client requests contain a name which is converted into an IP address known as a
forward DNS lookups while requests containing an IP address which is converted into
a name known as reverse DNS lookups.
o DNS implements a distributed database to store the name of all the hosts available on
the internet.
o If a client like a web browser sends a request containing a hostname, then a piece of
software such as DNS resolver sends a request to the DNS server to obtain the IP
address of a hostname. If DNS server does not contain the IP address associated with a
hostname, then it forwards the request to another DNS server. If IP address has arrived
at the resolver, which in turn completes the request over the internet protocol.
Applications of DNS
• DNS enables users to access websites by typing in domain names (e.g.,
www.example.com) instead of needing to remember the website's IP address (e.g.,
192.0.2.1).
• DNS is used to resolve the mail exchange (MX) records, directing email traffic to the
correct mail server based on the domain name.
• DNS can be used to block access to malicious websites or filter content.
• DNS is used in VoIP systems to resolve the domain names of service providers and
connect voice traffic to the correct servers for calls, ensuring proper call routing.
•
INTERNET ADDRESS
Internet address follows the TCP/IP suite hence, it is also known as the IP address. Internet
address has a job of identifying a node on the network. In other words, it is a numeric label
attached to every system (computer or any other device). IP address provides two basic
functionalities:
• Identification of computer or node or device and location addressing.
• The designers of the Internet Protocol defined an IP address as a 32-bit number[1] and this
system, known as Internet Protocol Version 4 (IPv4), is still in use today. However, due to the
enormous growth of the Internet and the predicted depletion of available addresses, a new
addressing system (IPv6), using 128 bits for the address, was developed in 1995,[3]
standardized as RFC 2460 in 1998,[4] and is being deployed worldwide since themid-2000s.
• IP addresses are binary numbers, but they are usually stored in text files and displayed in
human-readable notations, such as 172.16.254.1 (forIPv4).Both IPV4 as well as IPV6 have
reserved addresses for private or internal networks. This is termed as private addressing.
• Both IPV4 and IPV6 have sub netting effect. That mean, IP networks can be divided into
smaller groups or subnets. IP addresses two constituents that is network address and host
identifier or interface identifier are used for this purpose.
• Internet Protocol addresses are assigned to a host either anew at the time of booting, or
permanently by fixed configuration of its hardware or software. Persistent configuration is also
known as using a static IP address. In contrast, in situations when the computer's IP address is
assigned newly each time, this is known as using a dynamic IP address.

WORLDWIDEWEB AND ITS EVOLUTION

The World Wide Web (WWW), commonly referred to as the web, is a system of interlinked
hypertext documents and resources accessed via the Internet. It allows users to view and
navigate web pages using a web browser.
Evolution of the World Wide Web
• Inception (1989-1991)
o Tim Berners-Lee invented the web at CERN to facilitate information sharing
between scientists.
o He introduced:
▪ HTML (HyperText Markup Language)
▪ HTTP (HyperText Transfer Protocol)
▪ URL (Uniform Resource Locator)
• Web 1.0: Static Web (1990s)
o Features:
▪ Static, read-only web pages.
▪ Limited interactivity; information could only be consumed.
o Examples: Early websites like informational portals, simple directories.
• Web 2.0: Dynamic and Interactive Web (2000s)
o Features:
▪ User-generated content and interactivity (e.g., social media, blogs,
wikis).
▪ Technologies like JavaScript, AJAX, and CSS enhanced user
experience.
▪ Platforms: Facebook, YouTube, Wikipedia.
• Web 3.0: Semantic Web (2010s - Present)
o Features:
▪ Machine-readable data for better search and personalization.
▪ Integration of Artificial Intelligence and data analysis.
▪ Blockchain and decentralized applications (e.g., cryptocurrencies, smart
contracts).
o Goal: Provide tailored experiences based on user data.
• Future Directions: Web 4.0 (Ongoing Research)
o Fully intelligent, self-learning web.
o Integration of IoT (Internet of Things), 5G networks, and AR/VR.
 • Highly personalized and immersive experiences.

Impact of the Web

• Transformed communication, education, business, and entertainment.
• Enabled the global sharing of information and collaboration.
• Foundation for modern technologies like e-commerce, cloud computing, and social
networks.

UNIFORM RESOURCE LOCATOR(URL)

A URL (Uniform Resource Locator, also called a web address) is a unique identifier used to
locate a resource on the internet. URLs consist of multiple parts -- including a protocol and
domain name -- that tell web browsers how and where to retrieve a resource.
End users use URLs by typing them directly into a browser address bar or by clicking a
hyperlink found on a webpage, bookmark list, email or another application.
Example
https://www.example.com/page.html
• Protocol: https (secure HyperText Transfer Protocol)
• Domain: www.example.com
• Path: /page.html (specific file or page on the website)
This URL points to the page.html file hosted on www.example.com using HTTPS.
Parts of a URL
1. The protocol or scheme. This is used to access a resource on the internet.
2. Host name or domain name. This is the unique reference that represents a webpage.
3. Subdomain. This precedes the main domain name.
4. Port name. These usually aren't visible in URLs, but they're necessary. Ports 80 and
443 are the default ports for web servers, but there are other options. In a URL, ports
always follow a colon.

5. Path. A path refers to a file or location on the web server. For this example, the path is
whatis/search/query.

6. Query. Found in the URL of dynamic pages, the query consists of a question mark,
followed by parameters or the query string. In this example, "?" marks the beginning of
the query.

7. Parameters. These are pieces of information in a query string of a URL. Multiple

parameters can be separated by ampersands (&). In this example, the parameter is
"q=URL."

8. Fragment. This is an internal page reference, which refers to a section within the
webpage. It appears at the end of a URL and begins with a pound sign (#).
URL vs. URI
Uniform Resource Identifiers (URIs) are strings of characters used to identify a resource over
a network. A URL is the most common type of URI. URLs are essential to navigating the
internet.

BROWSERS
A web browser or Internet browser is a software application for retrieving, presenting, and
traversing information resources on the World Wide Web.
• Web browsers can also be used to access information provided by Web servers in private
networks or files in file systems. Some browsers can also be used to save information resources
to file systems.
• Primary function of a browser is to identify the URI and brings the information resource to
user.
• This process begins when user inputs the URI in the browser. Prefix of the URI describes
how to interpret the URI. Most URIs have resource retrieved over Hyper text Transfer Protocol.
Some web browsers also support prefixes like FTP. • Once this is done, the HTML script is
passed to the browser’s layout engine. To make the script interactive java script support is
needed. With this, browser can interpret text, images, video and interactive scripts.
• All major browsers allow users to access multiple information resources at the same time in
different windows or in tabs. Major browsers include pop up blockers to prevent windows to
open without users consent.
• Most major web browsers have these user interface elements in common: Back and forward
buttons to go back to the previous resource and forward again.
• A history list, showing resources previously visited in a list (typically, the list is not visible
all the time and has to be summoned)
• Arefresh or reload button to reload the current resource.
• Astopbutton to cancel loading the resource. In some browsers, the stop button is merged
with the reload button.
• Ahomebutton to return to the user's homepage
• Anaddress bar to input the Uniform Resource Identifier (URI) of the desired resource and
display it.
• Asearchbar to input terms into a search engine o Astatus bar to display progress in loading
the resource and also the URI of links when the cursor hovers over them, and page zooming
capability.
• Some special web browsers are listed below.

INTERNET EXPLORER
• Windows Internet Explorer (formerly Microsoft Internet Explorer, commonly abbreviated IE
or MSIE) is a series of graphical web browsers developed by Microsoft and included as part of
the Microsoft Windows line of operating systems starting in1995.
• It was first released as part of the add-on package Plus! for Windows 95 that year. Later
versions were available as free downloads, or in service packs. It was part of later versions of
windows operating systems.
NETSCAPE NAVIGATOR
• Netscape Navigator is a proprietary web browser that was popular in the 1990s. It was the
most popular web browser till 2002, after which competitor browsers have taken over the
market of Netscape.
• Netscape Navigator was based on the Mosaic web browser.

OPERA
• Opera is a web browser and Internet suite developed by Opera Software. The browser handles
common Internet-related tasks such as displaying web sites, sending and receiving e-mail
messages, managing contacts, chatting on IRC, downloading files via Bit Torrent, and reading
webfeeds.
• Opera is offered free of charge for personal computers and mobile phones. This is the most
popular mobile phone browser and is not packages in desktop operating system.
• Features include tabbed browsing, page zooming, mouse gestures, and an integrated
download manager. Its security features include built-in 16 phishing and malware protection,
strong encryption when browsing secure websites, and the ability to easily delete private data
such as HTTP cookies.
MOZILLAFIREFOX
• Mozilla Firefox is a free and open source web browser descended from the Mozilla
Application Suite and managed by Mozilla Corporation. As of February 2011[update], Firefox
is the second most widely used browser with approximately 30% of worldwide usage share of
web browsers.
• To display web pages, Firefox uses the Gecko layout engine, which implements most current
web standards.
• The latest Firefox featuresinclude tabbed browsing, spell checking, incremental find, live
book marking, a download manager, private browsing, location-aware browsing (also known
as "geolocation") based exclusively on a Google service.
CHROME
• Chrome,
The web browser by Google, is rapidly becoming popular due to following features .
• SPEED: Chrome is designed to be fast in every possible way: It's quick in staring up from
the desktop, loading web pages and running complex web applications.
• SIMPLICITY: Chrome's browser window is streamlined, clean and simple. Chrome also
includes features that are designed for efficiency and ease of use. For example, you can
search and navigate from the same box, and arrange tabs however you wish.
• SECURITY: Chrome is designed to keep you safer and more secure on the web with built-
in malware and phishing protection, auto updates to make sure the browser is up-to-date
with the latest 17 security updates, and more. Learn more about Chrome's security features

COMMON FEATURES OF BROWSERS

Here are six common features of web browsers:
1. Tabbed Browsing:
o Allows users to open multiple web pages in separate tabs within a single
window.
2. Address Bar:
o Enables users to input and navigate to URLs or search queries directly.
 3. Bookmarks/Favorites:
o Lets users save frequently visited websites for quick access.
4. History:
o Maintains a record of previously visited web pages for easy retrieval.
5. Private/Incognito Mode:
o Allows browsing without storing history, cookies, or temporary files.
6. Extensions/Add-ons:
o Supports third-party tools to enhance browser functionality (e.g., ad blockers,
password managers).

SEARCH ENGINE
A search engine is a software system designed to search for information on the World Wide
Web. When you type a query into a search engine, it searches its index for relevant content and
displays the results in a ranked order. Search engines are essential tools for navigating the vast
amount of information available online.

How Search Engines Work

1. Crawling:
o Search engines use automated programs called crawlers or spiders to browse
the web. They visit web pages and follow links to other pages, collecting
information about each page they visit.
2. Indexing:
o The crawlers index the collected data into a massive database, creating a record
of each webpage. The indexing process involves analyzing content, keywords,
and metadata, among other factors.
3. Ranking:
o When a user submits a search query, the search engine compares the query with
its indexed data and ranks the results based on relevance. The ranking is
determined by algorithms that take into account numerous factors, such as
keyword relevance, site authority, backlinks, and user engagement.
4. Displaying Results:
o The search engine presents the results in a Search Engine Results Page
(SERP), listing relevant pages in order of their rank. It also may display rich
results such as featured snippets, maps, and images, depending on the search
type.
Factors Affecting Search Engine Ranking
1. Keywords: The presence of search terms in titles, headers, and content.
2. Backlinks: Links from other high-quality websites that point to the page.
3. User Experience (UX): Page load time, mobile-friendliness, and ease of navigation.
4. Content Quality: Relevant, useful, and high-quality content that answers users'
queries.
5. Technical SEO: Website structure, sitemaps, and URL optimization.
TOP FIVE SEARCH ENGINES
• Google
• Bing
 • Yahoo!
• Baidu
• DuckDuckGo

WEBSERVER

Web pages are a collection of data, including images, text files, hyperlinks, database files etc.,
all located on some computer (also known as server space) on the Internet. A web server is
dedicated software that runs on the server-side.

This intercommunication of a web server with a web browser is done with the help of a protocol
named HTTP (Hypertext Transfer Protocol). These stored web pages mostly use static
content, containing HTML documents, images, style sheets, text files, etc. However, web
servers can serve static as well as dynamic contents. Web Servers also assists in emailing
services and storing files. Therefore it also uses SMTP (Simple Mail Transfer
Protocol) and FTP (File Transfer Protocol) protocols to support the respective services. Web
servers are mainly used in web hosting or hosting the website's data and running web-based
applications.

How do web servers work?

Whenever any web browser, such as Google Chrome, Microsoft Edge or Firefox, requests for
a web page hosted on a web server, the browser will process the request forward with the help
of HTTP. At the server end, when it receives the request, the HTTP server will accept the
request and immediately start looking for the requested data and forwards it back to the web
browser via HTTP.
Web server software available in the market
• Apache HTTP Server
• Microsoft Internet Information Services (IIS)
• Nginx
• Lighttpd
• Sun Java System Web Server

HTTP PROTOCOL
• HTTPstands for Hyper Text Transfer Protocol.
• It is a protocol used to access the data on the World Wide Web (www).
• The HTTP protocol can be used to transfer the data in the form of plain text, hypertext, audio,
video, and so on.
• This protocol is known as Hyper Text Transfer Protocol because of its efficiency that allows
us to use in a hypertext environment where there are rapid jumps from one document to another
document.
• The HTTP protocol is a request/response protocol based on the client/server based
architecture where web browsers, robots and search engines, etc. act like HTTP clients and the
Web server acts as a server.

The HTTP protocol is a request/response protocol based on the client/server based architecture
where web browsers, robots and search engines, etc. act like HTTP clients, and the Web server
acts as a server.
Basic Features:
• HTTP is connectionless protocol
• HTTP is media independent
• HTTP is stateless
INTRODUCTION TO HTML
HTML (HyperText Markup Language) is the standard language used to create and design
web pages. It provides the basic structure of web documents, using a system of tags to define
elements like headings, paragraphs, links, images, and more. HTML is essential for building
websites and web applications and is the backbone of every webpage you see on the internet.
Here are some key events in the history of HTML:
• 1980: Tim Berners-Lee, a CERN physicist, proposes and prototypes ENQUIRE, a
system for CERN researchers to share documents.
• 1989: Berners-Lee writes a memo proposing an internet-based hypertext system.
• 1991: Berners-Lee introduces the first publicly available description of HTML, a
document called "HTML Tags".
• 1993: HTML 1.0 is released, consisting of 18 HTML tags.
• 1995: HTML 2.0 is released, which builds on HTML 1.0 and adds new features.
• 1997: HTML 3.0 is released, which improves on HTML's features.
• 1999: HTML 4.0 is released, which is widely adopted and used globally.
• 2014: HTML 5 is released, which is the fifth major version.

Basic Structure of HTML

An HTML document is made up of several key components:
1. <!DOCTYPE html>:
o This declaration defines the document type and version of HTML being used
(HTML5 in this case).
2. <html>:
 o The root element that wraps the entire content of the web page.
3. <head>:
o Contains meta-information about the page, such as the title, character set, and
links to stylesheets or scripts.
4. <body>:
o Contains the actual content of the webpage, such as text, images, and links.
Basic HTML Tags
• <html>: The root element that defines the start and end of an HTML document.
• <head>: Contains metadata, including the title and links to external files like
stylesheets.
• <title>: Specifies the title of the webpage that appears in the browser’s title bar or tab.
• <body>: Contains the visible content of the webpage.
• <h1>, <h2>, <h3>, etc.: Heading tags for defining titles and sections.
• <p>: Defines a paragraph.
• <a>: Defines a hyperlink.
• <img>: Defines an image.
In the given example, we are going to use the <!DOCTYPE html> tag to declare the version
of HTML the page is written in. It is an empty tag and does not contain any information.
<!DOCTYPE html>
<html>
<head>
<title>!DOCTYPE tag</title>
</head>
<body>
<h1> !DOCTYPE tag </h1>
</body>
</html>
HTML5:INTRODUCTION
HTML5 is the latest version of the HyperText Markup Language (HTML), which is the
standard language used to create and structure content on the web. HTML5 introduces new
features, APIs, and elements that provide enhanced functionality, multimedia support, and
more control over web page presentation. It focuses on improving the web experience across
different devices, including desktops, tablets, and smartphones.
Key Features of HTML5
1. New Semantic Elements
HTML5 introduces several new tags to provide more meaningful structure to web
content. Some of the key semantic elements are:
• <header>: Represents the introductory content or navigation links.
• <footer>: Defines the footer content of a document or section.
• <article>: Defines independent, self-contained content.
• <section>: Groups related content together.
• <nav>: Defines a navigation block, typically used for links.
• <aside>: Represents content that is tangentially related to the main content.
2. MultimediaSupport
HTML5 introduces new elements to easily integrate multimedia content, such as:
• <audio>: Embeds audio files without needing third-party plugins.
 • <video>: Embeds video files directly into the webpage.
• <source>: Allows different media sources to be specified for <audio> and <video>.
3. ImprovedForms
HTML5 adds new input types and attributes to enhance form functionality:
• <input type="email">: Validates email addresses.
• <input type="date">: Provides a date picker interface.
• <input type="range">: Allows users to select a value from a range.
• New form attributes like placeholder, required, and autofocus.
4. Canvas Element
• The <canvas> element allows for drawing graphics and animations via JavaScript,
enabling dynamic and interactive content like games and visualizations directly in
the browser.
5. Offline Web Applications
• HTML5 includes the Application Cache and Service Workers to enable offline
functionality for web applications, allowing users to interact with the site even without
an internet connection.

FORMATTING TEXT BY USING TAGS

HTML text formatting refers to the use of specific HTML tags to modify the appearance and
structure of text on a webpage. It allows you to style text in different ways, such as making it
bold, italic, underlined, highlighted, or struck-through.
Categories of HTML Text Formatting
HTML text formatting can be divided into two main categories: Logical Tags and Physical
Tags.
1. Logical Tags
Logical tags convey the meaning or importance of the text without necessarily altering its
visual appearance. These tags help browsers, search engines, and assistive technologies
understand the purpose of the text.
• <em>: Emphasizes text, typically rendered in italics. It implies that the text carries
special importance or requires emphasis.
• <strong>: Marks text as important, often displayed in bold. It implies the content is of
strong importance.
2. Physical Tags
Physical tags directly affect how text looks on the webpage by changing the font, size, or style.
• <b>: Displays text in bold without implying importance.
• <i>: Italicizes text without any implied emphasis.
HTML Formatting Elements
1. <i> – Italicizes text
Use the <i> tag to display text in italics without implying emphasis.
<i>This is italic text.</i>
2. <small> – Reduces the font size of the text
The <small> tag renders text in a smaller font than the surrounding text.
<small>This text is smaller than the rest.</small>
3. <ins> – Highlights inserted text
The <ins> tag marks text as newly added or inserted, often displayed with an underline.
<ins>This is inserted text.</ins>
4. <sub> – Displays subscript text
Use the <sub> tag for subscripted text, often used in chemical formulas or footnotes.
H₂O
5. <strong> – Emphasizes important text, often rendered in bold
The <strong> tag is semantically meaningful and indicates that the text is of high importance.
<strong>This text is bold and important.</strong>
6. <b> – Makes text bold
The <b> tag visually makes the text bold but does not imply any special significance.
<b>This is bold text.</b>
7. <mark> – Highlights text with a background color
The <mark> tag highlights text with a background color, similar to using a highlighter on
paper.
<mark>This text is highlighted.</mark>
8. <del> – Strikes through text
The <del> tag is used to show that text has been deleted or is no longer relevant.
<del>This text is crossed out.</del>
9. <em> – Emphasizes text, typically italicized
The <em> tag is used for emphasized text and is usually rendered in italics to highlight
importance.
<em>This text is emphasized.</em>
10. <sup> – Displays superscript text
Use the <sup> tag to show superscripted text, commonly used in exponents or footnotes.
E = mc²
HTML Heading
A HTML heading or HTML h tag can be defined as a title or a subtitle which you want to
display on the webpage. When you place the text within the heading tags <h1>.........</h1>, it
is displayed on the browser in the bold format and size of the text depends on the number of
heading.
There are six different HTML headings which are defined with the <h1> to <h6> tags, from
highest level h1 (main heading) to the least level h6 (least important heading).
1. <h1>Heading no. 1</h1>
2. <h2>Heading no. 2</h2>
3. <h3>Heading no. 3</h3>
4. <h4>Heading no. 4</h4>
5. <h5>Heading no. 5</h5>
6. <h6>Heading no. 6</h6>
USING LISTS
An HTML List allows you to organize data on web pages into an ordered or unordered format
to make the information easier to read and visually appealing. HTML Lists are very helpful for
creating structured, accessible content in web development.
Types of HTML Lists
There are three main types of lists in HTML:
1. Unordered Lists (<ul>): These lists are used for items that do not need to be in any
specific order. The list items are typically marked with bullets.
2. Ordered Lists (<ol>): These lists are used when the order of the items is important.
Each item in an ordered list is typically marked with numbers or letters.
3. Description Lists (<dl>): These lists are used to contain terms and their corresponding
descriptions.
HTML List Tags
Tag Description

<ul> Defines an unordered list.

<ol> Defines an ordered list.

<li> Defines a list item.

<dl> Defines a description list.

<dt> Defines a term in a description list.

<dd> Details the term in a description list.

HTML Ordered List or Numbered List

In the ordered HTML lists, all the list items are marked with numbers by default. It is known
as numbered list also. The ordered list starts with <ol> tag and the list items start with <li> tag.
<ol>
<li>Aries</li>
<li>Bingo</li>
<li>Leo</li>
<li>Oracle</li>
</ol>
EXAMPLE 2
<ol start="5">
<li>HTML</li>
<li>CSS</li>
<li>JS</li>
</ol>

The sequence of the above lists will start with 5 instead of 1.

Using HTML Unordered List or Bulleted List
Unordered lists are ideal for scenarios where the sequence of the items is not important.
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
HTML Description List or Definition List
HTML Description list is also a list style which is supported by HTML and XHTML. It is also
known as definition list where entries are listed like a dictionary or encyclopedia.
<dl>
<dt>Aries</dt>
 <dd>-One of the 12 horoscope sign.</dd>
<dt>Bingo</dt>
<dd>-One of my evening snacks</dd>
<dt>Leo</dt>
<dd>-It is also an one of the 12 horoscope sign.</dd>
<dt>Oracle</dt>
<dd>-It is a multinational technology corporation.</dd>
</dl>

FORMATTING OF BACKGROUNDS
The background-color property provides a color for the background of the text, but not for the
whole document. If you wish to change the HTML color for the whole page, you should use
the bgcolor attribute in the opening tag of the
section: 28 HTML provides you following two good ways to decorate your webpage
background.
• HTMLBackgroundwithColors
• HTMLBackgroundwithImages
Html Background with Colors: The bgcolor attribute is used to control the background of an
HTML element, specifically page body and table backgrounds. Syntax The example below
shows the attribute.
This background is yellow
Html Background with Images: The background attribute can also be used to control the
background of an HTMLelement, specifically page body and table backgrounds.
CREATING HYPERLINKS AND BOOKMARKS
Hyperlinks allow users to navigate to other pages or websites by clicking a link.
Syntax:
<a href="URL">Clickable Text</a>
EXAMPLE
<!DOCTYPE html>
<html>
<head>
<title>Hyperlink Example</title>
</head>
<body>
<h2>Hyperlink Example</h2>
<a href="https://www.google.com" target="_blank">Visit Google</a>
</body>
</html>
• The <a> tag creates a hyperlink.
• The href attribute specifies the URL.
• target="_blank" opens the link in a new tab.

2. Bookmarks
Bookmarks allow users to navigate to specific sections of the same page.
Syntax:
1. Define a target section using id.
 2. Link to the section using #id.
<!DOCTYPE html>
<html>
<head>
<title>Bookmark Example</title>
</head>
<body>
<h2>Bookmark Example</h2>
<a href="#section2">Go to Section 2</a>

<h2 id="section2">Section 2</h2>

<p>This is Section 2 of the page!</p>
</body>
</html>
• The id attribute identifies the target section (id="section2").
• The hyperlink references it with href="#section2".
Note: Bookmarks can be used to navigate not only to specific sections within the same page
but also to sections in different pages.
DEFINING METADATA ABOUT AN HTML DOCUMENT
Metadata provides information about the HTML document, such as its title, character set,
author, and keywords. Metadata is defined in the <head> section using <meta> and other
related tags. Metadata does not appear on the webpage but is vital for browsers, search engines,
and other web services.

Common Metadata Tags

1. <meta charset>
Specifies the character encoding of the document.

2. <meta name="description">
Defines a brief description of the webpage for search engines.
3. <meta name="keywords">
Specifies keywords related to the content of the webpage.
4. <meta name="author">
Defines the author's name.
5. <meta name="viewport">
Improves responsiveness by controlling the layout on mobile devices.
6. <title>
Specifies the title of the webpage (appears in the browser tab).
7. <meta http-equiv>
Provides HTTP headers or refreshes the page.
Example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="A simple HTML document to demonstrate metadata.">
<meta name="keywords" content="HTML, metadata, tutorial, SEO">
<meta name="author" content="Jane Doe">
<title>Metadata Example</title>
</head>
<body>
<h1>Welcome to Metadata in HTML</h1>
<p>This page shows how to use metadata in an HTML document.</p>
</body>
</html>
Why Use Metadata?
1. SEO: Helps search engines index the page better.
2. User Experience: Improves mobile responsiveness and page behavior.
3. Identification: Provides essential information like author, keywords, and descriptions.

CSS: INTRODUCTION
CSS (Cascading Style Sheets) is a styling language used to design and enhance the appearance
of HTML elements. It controls layout, colors, fonts, spacing, and more, separating content from
presentation. CSS makes websites visually appealing and responsive across devices. Styles can
be applied inline, internally, or externally. CSS works with selectors to target specific elements
for styling.

IMPLEMENTING STYLES USING CSS

1. Inline CSS
Applied directly to an HTML element using the style attribute.
<p style="color: blue; font-size: 20px;">This is inline CSS.</p>
2. Internal CSS
Defined within a <style> tag in the <head> section of the document.
<!DOCTYPE html>
<html>
<head>
<style>
p{
color: green;
font-size: 18px;
}
</style>
</head>
<body>
<p>This is internal CSS.</p>
</body>
</html>
3. External CSS
Written in a separate file with a .css extension and linked to the HTML file.
CSS File (styles.css):
p{
color: red;
font-size: 16px;
}
HTML File(rr.html)
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<p>This is external CSS.</p>
</body>
</html>
CSS SELECTORS
CSS selectors are patterns used to select and style HTML elements.
1. Universal Selector (*)
Applies styles to all elements.
*{
margin: 0;
padding: 0;
}
2. Element Selector
Targets specific HTML tags.
p{
color: blue;
}
3. Class Selector (.)
Targets elements with a specific class attribute.
.intro {
font-weight: bold;
}
4. ID Selector (#)
Targets an element with a specific ID attribute.
CSS
#header {
text-align: center;
}
HTML
<h1 id="header">This is an ID selector.</h1>

5. Grouping Selector
Styles multiple elements with the same declaration.
h1, h2, p {
color: purple;
}
CHANGING BACKGROUND,ADDING BORDER,MARGIN AND PADDING
CSS properties like background-color, border, margin, and padding are essential for styling and
layout. These can be demonstrated effectively using Internal CSS.
What is Margin?
Margin is the space around an element. It is used to move an element up or down on a page as
well as left or right.
What is Padding?
Padding is the space between the element and the related content inside it. It determines how
elements look and sit within a container.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CSS Styling Example</title>
<style>
body {
background-color: lightgray;
}
.box {
background-color: white;
border: 2px solid blue;
margin: 20px;
padding: 15px;
width: 300px;
}
</style>
</head>
<body>
<h1>CSS Styling Example</h1>
<div class="box">
<p>This box demonstrates background color, border, margin, and padding.</p>
</div>
</body>
</html>

SETTING DIMENSIONS
CSS provides properties to set the dimensions of HTML elements. The most commonly used
dimension properties are:
• width: Sets the width of an element.
• height: Sets the height of an element.
• max-width: Specifies the maximum width of an element.
• max-height: Specifies the maximum height of an element.
• min-width: Specifies the minimum width of an element.
• min-height: Specifies the minimum height of an element.
Example
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CSS Dimensions Example</title>
<style>
/* Setting width and height */
.box1 {
width: 200px; /* Fixed width */
height: 100px; /* Fixed height */
background-color: lightblue;

/* Using max-width and max-height */

.box2 {
max-width: 300px; /* Maximum width */
max-height: 150px; /* Maximum height */
background-color: lightgreen;
}

/* Using min-width and min-height */

.box3 {
min-width: 150px; /* Minimum width */
min-height: 80px; /* Minimum height */
background-color: lightcoral;

}
</style>
</head>
<body>
<h1>CSS Dimensions Example</h1>

<!-- Box with fixed dimensions -->

 <div class="box1">Fixed Dimensions</div>

<!-- Box with max dimensions -->

<div class="box2">
This box will not grow larger than 300px in width and 150px in height. Add more text to
see the effect of scrolling.
</div>

<!-- Box with min dimensions -->

<div class="box3">Minimum Dimensions</div>
</body>
</html>

USING INLINE CONTAINER TO MARKUP A PART OF A TEXT

The <span> element is a generic inline container, often used for styling specific parts of text.
Inline containers are used for:
• Emphasizing keywords.
• Highlighting text.
• Applying specific styles to parts of a sentence without disrupting the flow.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Inline Container Example</title>
<style>
/* Styling for inline containers */
.highlight {
background-color: yellow;
font-weight: bold;
}
.italic {
font-style: italic;
color: gray;
}
</style>
</head>
<body>
<p>
This is a normal sentence, but <span class="highlight">this part is highlighted</span>
and
<span class="italic">this part is italicized</span>.
</p>
</body>
</html>
INTERNET VS WORLDWIDEWEB

WEB BROWSER VS WEB SERVER

HTML VS HTML5