World Wide Web

(WWW”, "Web" or "W3“) Presented By

Mrs Parimala G
Asst. Professor
 OVERVIEW
 What is World Wide Web?
 History of the World Wide Web
 Structure
 WWW Components
 Web Fundamentals
 How to access the web?
 Full Structure of a Public URL
 The Difference Between Internet and WWW
 Static web page
 Dynamic web pages, web application
 The hyper text transfer protocol
 The mobile web
 Web search
 WHAT IS WORLD WIDE
WEB
❖Commonly known as “www” or triple w (w3)” also
called as “web” .
❖Way of exchanging information.
❖A document on the web is called a Web page ,
identified by a unique address called URL[1].
❖Uniform Resource Locator (URL) commonly referred
to as a Web address.
 HISTORY OF THE WORLD WIDE WEB
❖ Invented By : Tim Berners-Lee
❖In 1989 invents the World Wide
Web (www) at CERN [2].
❖ Published in 1992
❖ Text mark up language Tim Berners-Lee
❖ Not invented by Berners-Lee
❖ Simple and easy to use.
 HOW TO ACCESS THE
WEB?
❖Follow these steps, Open your web
browser .
❖ Write the address in the address
bar.
❖Hit the ENTER key or click on the
GO button.
 DIFFERENCE BETWEEN INTERNET & WWW

❑ Internet
➢Internet is a global system of interconnected computer
network.
➢ Massive network of networks.
➢ connecting millions of computers.

❑ World Wide Web

➢ WWW is one of the services that run on internet.
➢ WWW is a system of interlinked hypertext
documents accessed via Internet.
➢ Simply, Large portion of internet .
Internet FIREF
OX Opera
Explorer

Google
Safari Chrome
 STRUCTURE

❖ Web pages constructed by HTML.

❖ Clients use browser application to send URIs via HTTP
to servers requesting a Web page.
❖ Servers respond with requested Web page or with error
message.
❖ Page is written using Hyper Text Markup
Language (HTML)
❖ Displaying text, graphics and sound in browser[3].
Three questions had to be ;answered before a
selected page could be displayed:
A) what is the page called?
B) Where I is the page located?
C) How can the page be accessed?
 HOW THE WEB WORKS
 The client-server model
 Client and server operate on machines which are able to
communicate through a network
 The server waits for requests from a clients
 Server receives a requests from a client
 Performs a the requested work
 Or lookup the requested data
 And send a response to the client

 Servers: file servers, web servers, name servers

 Clients: browsers, email clients
WWW STRUCTURE AT CLIENT SLIDE
 Clients use browser application to send URIs via HTTP to servers
requesting a Web page
 Web pages constructed using HTML (or other markup language) and
consist of text, graphics, sounds plus embedded files
 Servers (or caches) respond with requested Web page
 Or with error message
 Client’s browser renders Web page returned by server
 Page is written using Hyper Text Markup Language (HTML)
 Displaying text, graphics and sound in browser
 Writing data as well
 The entire system runs over standard networking protocols (TCP/IP,
DNS,…)
 WWW COMPONENTS

❖ Structural Components:
✓ Clients/browsers
✓ Servers
✓ Caches
✓ Internet [4].

❖ Semantic Components:
✓ Hyper Text Transfer Protocol (HTTP)
✓ Hyper Text Markup Language (HTML)
✓ Extensible Markup Language (XML)
✓ Uniform Resource Identifiers (URIs)[3].
 WEB
FUNDAMENTALS
World Wide Web (WWW)
✓Global hypertext network of millions of Web
servers & browsers
✓ Connected by Hypertext Transfer Protocol
(HTTP)
✓ Web pages can be designed by Hypertext
Markup Language (HTML)
 WEB
FUNDAMENTALS
❑ Web Browser
✓A web browser displays a web
document and enables users to access
web documents.

❑ Web Server
✓ Servers respond with requested
Web page
or with error message.

❑ Uniform Resource
Locator(URL)
✓ These are the web addresses.
We type URL in address bar of the browser then hit on
FULL STRUCTURE OF A PUBLIC URL

It identifies
The domain
the location
name of web
of the
server on which
document on
page is located.
internet
It identifies
It is the Hypertext the resource
Transfer Protocol name.
 When the user types a URL or clicks on a line of hypertext, the browser the URL
and interprets the part between http:// and next slash establishes a TCP
connection to port 80 on that server.
 The server performs the following
1. Accepts a TCP connection from a client(a browser)
2. Get the path to the page, which is the name of the file requested.
3. Get the file ( from the disk).
4. Send the comments of the file to the client.
5. Release the TCP connection.

WWW ARCHITECTURE AT SERVER

SIDE
The following steps occur after the TCP connection have been established:
 Resolve the name of the Web page requested.
 Perform access control on the web page.
 Check the Cache.
 Fetch the requested page from disk or run a program to build it.
 Determine the rest of the response( e.g., the MIME type to send).
 Return the response to the client.
 Make an entry the server log.
 Request the browser to store a small data file (cookie) on
the users hard disk.
 Which can serve to identify users only.
 For instance it could contain a key into a database on the
server machine.
 Most browsers nowadays allow you to decide whether or not
you want cookies on your machine.

COOKIES
 WHAT IS AN HTML FILE?

 HTML stands for HyperText Markup Language

 An HTML file is a text file containing small markup tags

 The markup tags tell the Web browser how to display the page

 An HTML file must have an htm or html file extension

 An HTML file can be created using a simple text editor

 INTERNET - SERVICES

 Email & MIME (Multipurpose Internet Mail Extensions)

text (text/html), image, video, etc.
 Telnet & ssh
 FTP – File Transfer Protocol
 Gopher
 IRC – Internet Relay Chat
 Newsgroups
 WWW – World Wide Web
HTTP (Hypertext transfer protocol) uses a Question-Answer-Scheme, i.e.
a browser sends a request und gets a response from a server. Note the
server does not send out anything without a request.
COOKIES
WHAT IS AN HTML FILE?

 HTML stands for HyperText Markup Language

 An HTML file is a text file containing small markup tags

 The markup tags tell the Web browser how to display the page

 An HTML file must have an htm or html file extension

 An HTML file can be created using a simple text editor

 INTERNET - SERVICES

 Email & MIME (Multipurpose Internet Mail Extensions)

text (text/html), image, video, etc.
 Telnet & ssh
 FTP – File Transfer Protocol
 Gopher
 IRC – Internet Relay Chat
 Newsgroups
 WWW – World Wide Web
HTTP (Hypertext transfer protocol) uses a Question-Answer-
Scheme, i.e. a browser sends a request und gets a response from a
server. Note the server does not send out anything without a request.
MARKUP LANGUAGES

 Suppose we have a document containing only plain text

 We tag certain parts of the document to indicate what they are

and how they should be formatted

 This procedure is called marking-up the document

 Tags are usually paired:
 e.g. <title>My Memoirs</title>
 A pair of tags plus their content constitute an element
 Un-paired tags are called empty tags
MARKUP LANGUAGES

 Physical vs Semantic markup

 physical refers to appearance (style) on the page
 semantic refers to structure and meaning

 HTML is the HyperText Markup Language

 HTML is based on SGML (Standard Generalised Markup
Language) which is more complex

 HTML has a fixed set of tags but is constantly evolving, but

newer versions are downward compatible
MARKUP LANGUAGES

 HTML places primary emphasis on structure

 paragraphs, headings, lists, images, links, ….
 HTML places secondary emphasis on style (CSS)
 fonts, colours, ….
 HTML does not label the meaning of the text (XML)
 A BASIC DOCUMENT

 Every document should start with the following line

<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>

• There are three required elements, defined by the tags <html>,

<head> and <body>

<html>
<head>
<title>My Home Page</title>
</head>
<body>
<h1>Welcome</h1>
</body>
</html>
BASIC STRUCTURE ELEMENTS

• first and last tags

 The HEAD section
 must come before the BODY section
 contains generic information about the document
 Elements specified in the HEAD section can include
– title, link, script, style
 The BODY section
 contains the content of the document (text, images etc)
 this content is structured by other tags
STATIC WEB PAGES

Fig : The HTML for a sample web page

 request-line ( request request-URI HTTP-version)
headers (0 or more)
<blank line>
body (only for POST request)

 First type of HTTP message: requests

 Client browsers construct and send message
 Typical HTTP request:
GET http://www.cs.wisc.edu/index.html HTTP/1.0
HTTP REQUEST FORMAT


36
CS 640
 status-line (HTTP-version response-code response-phrase)
headers (0 or more)
<blank line>
body

 Second type of HTTP message: response

 Web servers construct and send response messages
 Typical HTTP response:

HTTP RESPONSE FORMAT

HTTP/1.0 301 Moved Permanently


Location: http://www.wisc.edu/cs/index.html
37
CS 640
  Both requests and responses can contain a variable number of header fields
 Consists of field name, colon, space, field value
 17 possible header types divided into three categories
 Request
 Response
 Body
 Example: Date: Friday, 27-Apr-01 13:30:01 GMT
HTTP HEADERS
Example: Content-length: 3001

38
CS 640
  Hyper-Text Markup Language
 A subset of Standardized General Markup Language (SGML)
 Facilitates a hyper-media environment
 Embedded links to other documents and applications
 Documents use elements to “mark up” or identify sections of text
for different purposes or display characteristics
 Mark up elements are not seen by the user when page is displayed
 Documents are rendered by browsers
HTML NOTE:
BASICSNot all documents in the Web are HTML!
 Most people use WYSIWYG editors (MS Word) to generate HTML
39
CS 640
 <HTML>
<HEAD>
<TITLE> PB’s HomePage </TITLE>
</HEAD>
<BODY>
<CENTER><IMG SRC = “bad_picture.gif” ALT = “ “><BR></CENTER>
<P><CENTER><H1>UW Computer Science Department</H1></CENTER>
Welcome to my goofy HomePage!
…
<A HREF = http://www.cs.wisc.edu/~pb/mydogs_page.html> Spot’s Page </A>
</BODY>
HTML EXAMPLE
</HTML>

40
CS 640
HTML FOR AN ORDERED FORM
THE FORMATTED PAGE
DYNAMIC WEB PAGES, WEB
APPLICATION
DYNAMIC WEB PAGES, WEB
APPLICATION