Web Technology Fundamentals

Module Number: 02

Module Name: The World Wide Web

The World Wide Web

AIM:

To get familiarize with the world wide web using Hyper text transfer protocol

2
The World Wide Web

Objectives:

• Hyper Text Transfer Protocols

• Methods of Upload using HTTP
• Web versions
• Browser Interface through Internet

3
The World Wide Web

Outcome:

• What is World Wide Web

• What are Server Clients
• HTTP Types and Methods
• Web Server Components

4
The World Wide Web

Contents
1. World Wide Web
2. Hyper Text Transfer Protocol
3. Web Technologies and Web Services

5
The World Wide Web

World Wide Web

6
The World Wide Web

Is the Internet same as

the World Wide Web?

7
The World Wide Web

WHY?

The web
was born at CERN
in Geneva in 1990,
to allow its researchers who were
geographically dispersed to share
documents using a hypertext system.

Tim Berners Lee

Father of World Wide Web

8
The World Wide Web

The web is not the same as the internet, it is a service provided by the internet.

The World Wide Web is a system

of interlinked hypertext
documents accessed via the
internet.

9
The World Wide Web

History of the Web

Diagram: World Wide Web Timeline

10
The World Wide Web

Web 1.0

Diagram: Internet Explorer web page from 1995

11
The World Wide Web

Web 2.0

12
The World Wide Web

Web 3.0

Diagram: The Semantic Web

13
The World Wide Web

Web 1.0 / 2.0 / 3.0 summary

14
The World Wide Web

World Wide Web Consortium

In 1994, Tim Berners-Lee with the help of Massachusetts Institute of Technology founded the World Wide
Web Consortium (W3C), an international community which is devoted to developing ‘Open web
standards’.

The W3C describes itself as,

“The World Wide

Web Consortium
exists to realize
the full potential
of the web”

15
The World Wide Web

Unified Resource Identifier (URI)

1. The web servers host web resources.

2. A web resource is a content source, it can be anything from a static file, a live image from a camera or
dynamic content resources.

3. Each web server resource has a name to identify the resource uniquely called the ‘Uniform Resource
Identifier’ or URI.

4. For example:

Below is an example of an image resource URI.

http://www.example.com/specials/polar.gif

16
The World Wide Web

The Uniform Resource Identifier has two forms:

• Uniform Resource Locator

• Uniform Resource Name

Uniform Resource
Identifier

Uniform Uniform
Resource Locator Resource Name

Unified Resource Locator and Unified Resource Name 17

The World Wide Web

Unified Resource Locator (URL)

1. Uniform Resource Locator is the most common form of resource identifier.

2. A URL defines the specific location of the resource on a particular server.

3. Example: http://www.yahoo.com/images/logo.gif is the URL for the Yahoo! Website’s logo.

http:// Scheme

www.yahoo.com Address

Resource
/images/logo.gif location
18
The World Wide Web

Unified Resource Name (URN)

1. Uniform Resource Name serves as a unique name to a resource irrespective of the location
where it resides.

2. Being location-independent these resources can move freely and can be accessed by multiple
network access protocols.

3. Uniform Resource Names are still in experimental stage and not yet widely adopted.

4. For example: The Uniform Resource Name urn:ietf:rfc:2141 can be used to name the internet
standards document “RFC 2141”.

19
The World Wide Web

Web Server

1. A web server can be both software and hardware.

2. It is a program that responds to the requests made by the client.

3. A computer where the websites are hosted or stored can also be called as a web server. 20
The World Wide Web

Web Clients
1. A web client can be both software and hardware.

2. A web client is an application that communicates with a web server, using Hypertext Transfer Protocol
(HTTP).

3. A Web client contains two parts: dynamic Web pages and the Web browser.

4. Dynamic Web pages are produced by components that run in the Web tier, and a Web browser delivers
Web pages received from the server.

21
The World Wide Web

Web Browser

1. A web browser is an application program used to request, view and traverse the web pages.

2. It can display information in the form of text, images, multimedia and more.

3. We can upload or download files using the browser.

22
The World Wide Web

The World Wide Web

This link is an excerpt from a chapter titled “Introduction to World Wide Web” from "Raggett on
HTML 4", by Dave Raggett, Jenny Lam, Ian Alexander and Michael Kmiec.
Explains what is WWW, its components and how it is different from the internet.

Explains world wide web and it’s working.

Topic URL

History of internet https://www.youtube.com/watch?v=1Cs

PHKJWiw0

23
The World Wide Web

Hyper Text Transfer Protocol

24
The World Wide Web

Self Assessment Questions

1. _____________________ is the father of World Wide Web.

Answer: Tim Berners Lee.

2. WWW is:

a) Same as the internet.

b) A system of interlinked hypertext documents accessed via the internet.

Answer: b)
25
The World Wide Web

3. Is it possible to share a file without using the world wide web.

a) Yes
b) No

Answer: a)

4. The World Wide Web Consortium develops _________________________.

a) web standards
b) web sites
c) web servers
d) the web architecture

Answer: a)
26
The World Wide Web

5. Which of these browsers is a browser for a Linux machine?

a) Internet Explorer
b) Opera
c) Safari
d) Google Chrome

Answer: b)

6. Web 3.0 aims at:

a) Data that can be understood by machines.
b) Dynamic web content.

Answer: a)
27
The World Wide Web

7. WWW is: (Select all that apply)

a) A universal system of information capture and delivery.

b) A collection of documents connected by hyperlinks.
c) An application platform
d) A framework of internet

Answer: a), b)

8. Web 2.0 is also called the __________ web.

Answer: Social Web.

28
The World Wide Web

9. Communication between the web client and web server happens using:

a) HTTP
b) TCP

Answer: a)

10. A computer where your website is hosted is called the:

a) Web browser
b) Web Server

Answer: b)
29
The World Wide Web

11. URI stands for ____________.

Answer: Uniform Resource Identifier.

12. _______ serves as a unique resource name for a resource on the web.

Answer: Unified Resource Name (URN).

30
The World Wide Web

Hyper Text Transfer Protocol

Hyper Text Transfer Protocol or HTTP is the protocol that is used to enable a web browser and a web
server to communicate.

HTTP Request
URL

HTML Document
response Internet Client
Server

The Hyper Text Transfer Protocol

31
The World Wide Web

HTTP Kitchen Analogy

Hyper Text Transfer Protocol Eating in a Restaurant

1. Suppose I want to access a web page like 1. The first thing you need to do is find the
www.example.com/myvideos/vid1. restaurant you want to eat from.

2. The HTTP protocol uses the URL to identify the server, 2. Once in the restaurant you would send an order
it makes a connection and sends the request to the to the kitchen for whatever you like to eat.
server and terminates the connection.
3. The kitchen checks to see if the ordered item is
3. The server receives the request and checks if the available, if yes it is delivered to you on your
requested resource is available, if so it re-establishes table.
the connection with the client and sends the response.
4. You can make multiple orders while in the
4. The browser can make multiple requests and each restaurant and the kitchen while processing a
request is processed independent of the previous given order does not keep in mind what your
requests. previous orders were.

32
The World Wide Web

HTTP Client-Server Model

HTTP Request
Client
Server
HTTP Response

33
The World Wide Web

HTTP MIME Types

Document MIME type

HTML formatted text document text/html

Plain ASCII text document text/plain

JPEG version image/jpeg
GIF format image/gif
Apple quick time movie video/quicktime

Microsoft power point presentation application/vnd.ms-powerpoint

34
The World Wide Web

HTTP Transaction

Method URI HTTP version HTTP version Status code Start line

Name1: value1 Name1: value1

Name2: value2 Name2: value2 Headers

Name3: value3 Name3: value3

Requested Resource Body

Request Message Response Message

HTTP Message Formats

35
The World Wide Web

Using the format let us write request and response messages for our index.html example.

Request Message Response Message

HTTP 1.0 200 : OK

GET /index.html HTTP 1.0
Host: www.example.com
Host: www.example.com
Accept: text/html
Accept: text/html
Accept-language: en-us
Accept-language: en-us
index.html

Request and Response Messages

36
The World Wide Web

HTTP Methods

Method Description

GET Used to get a named resource from the server using URI

PUT Replace all representations of the resource with the new upload

POST Used to send data to the server like customer information using HTML form

DELETE Deletes the resource from the server

HEAD Similar to GET, but transfers the status line and header section of the message

CONNECT Establishes a connection with the server identified by the URI

37
The World Wide Web

The HTTP Status Codes

38
The World Wide Web

Hyper Text Transfer Protocol

A tutorial on HTTP and its working.

Explains HTTP and its working along with the request response messages.

Topic URL
Tutorial on HTTP https://www.youtube.com/watch?v=JFZ
MyhRTVt0

39
The World Wide Web

Self Assessment Questions

13. HTTP stands for _____________________.

Answer: Hyper Text Transfer Protocol.

14. The communication between the browser and server happens in a:

a) Request/response pair
b) request/message pair

Answer: a)
40
The World Wide Web

15. The server responds with ______________________________, when it does not find the web page
requested by the browser.

a) HTTP 404 Not Found error code

b) HTTPs 505 Not Found error code
c) HTTP 407 Not Found error code
d) HTTP 400 error code

Answer: a)

41
The World Wide Web

16. Status code 500 stands for:

a) file not found

b) internal server error
c) unauthorized access
d) Stack overflow

Answer: b)

42
The World Wide Web

17. Which is an invalid MIME type _______________.

a) text/html
b) application/javascript
c) video/x-flv
d) text/ms-word

Answer: d)

43
The World Wide Web

18. HTTP is a :
a) Connectionless protocol
b) Connection based but stateless protocol
c) Connectionless and stateless protocol

Answer: c)

19. Default HTTP port is:

a) Port 80
b) Port 81

Answer: a)
44
The World Wide Web

20. Processing of all HTTP requests after the first request are dependent on the previous request.

a) Yes
b) No

Answer: b)

21. The HTTP response message header contains:

a) File type
b) Status code

Answer: b)
45
The World Wide Web

22. The HTTP method used to send credit card information is:

a) GET
b) PUT
c) POST

Answer: c)

23. Internet allows for automatic updates.

a) Yes
b) No

Answer: a)
46
The World Wide Web

Web Applications

47
The World Wide Web

Web Application

A Web application (Web app) is an application program that is stored on a remote server and
delivered over the Internet through a browser interface.

It can be:

Static Web Application

A collection of related web pages that may contain text, links, audio, images and videos.
It requires only client-side processing.

48
The World Wide Web

Dynamic Web Application

• A dynamic web application is interactive.

• They can automatically update different sections based on information from other applications
or databases. Users see different inputs based on the input given.

• Dynamic web applications require back-end processing in addition to client-side processing.

• Facebook app is an example of dynamic web application.

49
The World Wide Web

Static and Dynamic Web Applications

Diagram: Static vs. Dynamic Web Applications

50
The World Wide Web

Front-end and Back-end Web Development

The web development functions can be categorized into five areas:

1. Preparing page structure.

2. Organizing and managing content hierarchy.
3. Serving content to the user.
4. Capturing user input.
5. Performing back-end processing and integration.

Different web technologies are required to accomplish these functions. Web development can be
divided into two categories:

1. Front-end Web Development

2. Back-end Web Development
51
The World Wide Web

Front-end Development is also called the client-side development

1. It is used for developing what the user sees when they open a website or load a web application.
2. It is used to develop the structure and design of websites.

Back-end development - Most of the code that makes a web application work is on the back-end.

1. The back-end code runs on the server therefore, a back-end developer must have a good
understanding of the programming languages, database and server architecture.

2. The server-side programming can be divided into four main components:

• The Servers
• Databases
• Middleware
• Programming languages and framework.
52
The World Wide Web

Self Assessment Questions

24. A _______________ is an application program that is stored on a remote server and delivered over the
Internet through a browser interface.

a) Web application
b) Network application

25. Different users are shown different output based on the input given in a:

a) Static application
b) Dynamic application

26. Static web applications require backend processing as well as client side programming. State true or
false.
53
The World Wide Web

27. Front end web development is used to:

a) Design the structure and appearance of the website

b) To store the user data in the database.

28. Middleware is a software that connects the application’s front-end to its back-end. State true or false.

54
The World Wide Web

Web Technologies
Web Services
55
The World Wide Web

Web Technologies
Web technologies is a general term referring to the many languages and multimedia packages that are used in
conjunction with one another, to produce dynamic web sites. Some of the important technologies are:

1. Hyper Text Markup Language (HTML) - HTML is the standard markup language for creating
web pages and web applications.

2. Cascading Style Sheets (CSS) - the Cascading Styling Sheets is used to style an HTML document.

3. JavaScript - It is a dynamic programming language which when applied to a HTML document can
make the websites interactive with the user.

4. Extensible Markup Language (XML) - it is an extensible language which can be used to create
specific mark-up languages such as chemical mark-up.

5. ASP.NET - ASP .NET is a web framework for building dynamic web sites, web applications and web
services. 56
The World Wide Web

6. Servlets – It is a server-side programming language. An efficient and powerful solution for creating
dynamic web content.

7. Java Server Pages (JSP) - The Java Server Pages is a server-side technology that is used to create
dynamic web pages based on HTML, XML or other document types. Java code is inserted into HTML
using JSP tag <% ----Java code----%>.

8. Hypertext Preprocessor (PHP) - PHP is an open source general purpose scripting language for server-
side development. It can be embedded in HTML.

9. Asynchronous JavaScript And XML (AJAX) - AJAX is not a programming language in itself. It uses
the XMLHttpRequest object to request data from the server and java script and HTML DOM to display
or use the data. The most appealing characteristic of the AJAX is that it can communicate with the
server, exchange data and update a page without even refreshing the page.

We will learn about HTML, CSS, JavaScript, XML and PHP in the coming chapters.
57
The World Wide Web

Web Services analogy

Consider the aircraft reservation software,

1. In addition to doing reservations, the software also requires to communicate with e-commerce sites
like PayPal for payments made online.

2. But we know that the reservation system and the PayPal software are separate systems written in
different languages.

3. Communication between the two heterogeneous software systems happens through a special kind
of web application known as a web service.

Web
Services

Airline Reservation Software PayPal Software

Service Requester Service Provider 58
The World Wide Web

Web Services
• Web service is a service offered by one electronic device to another via the World Wide Web.

The W3C defines a web service as,

‘A web service is a
software system
designed to support
interoperable machine-
to-machine interaction
over a network.’

59
The World Wide Web

Web Service Components

1. SOAP – Simple Object Access Protocol

2. REST – Representational State Transfer
3. WSDL – Web Services Description Language
4. UDDI – Universal Description, Discovery and Integration

60
The World Wide Web

SOAP – Simple Object Access Protocol

SOAP is an XML based messaging protocol which allows programs running on different operating
systems such as Windows and Linux to communicate using HTTP and XML.

Web server hosting the

various web services

SOAP over HTTP

request
Consume Data
XML based
response

INTERNET

SOAP – accessing web services

61
The World Wide Web

REST – Representational State Transfer

1. REST was defined by Roy Fielding in 2000.

2. REST is an architectural style for developing web services. It uses HTTP for accessing resources,
but unlike SOAP the web service developed using REST are light weight and use less bandwidth.

62
The World Wide Web

3. REST defines a way of accessing resources such as documents, pictures or videos which reside on a
different environment.

4. The key elements of RESTful implementation are:

• Resources – the resource itself.

• Request Verbs – to describe what to do with the resource. The verbs include GET, POST, DELETE,
PUT.

• Request Header – additional information such as authorization details.

• Request Body – contains Data, usually sent when POST is used.

• Response Body – an XML document with the data.

• Response Status Codes – returned with the response indicating whether there is any error or
response has been sent.
63
The World Wide Web

REST - Example
Let us assume a RESTful web service is defined at a particular location. The client can use any HTTP
verbs to make the request. For Example,

POST – This would be used to create a new employee using the RESTful web service
GET - This would be used to get a list of all employee using the RESTful web service
PUT - This would be used to update all employee using the RESTful web service
DELETE - This would be used to delete all employee using the RESTful web service

Post Get PUT Delete

Resource
Create Read Update Delete
/Employee
Create a new Get all employee Update relevant Delete relevant
/Employee/1
employee details employee details employee details

64
The World Wide Web

WSDL – Web Services Description Language

• A web service cannot be used if it cannot be found.

• The WSDL is an XML-based file which tells the client what the web service does and where it is
located.

WSDL
Defines Defines

Web Client Web

Application Service
WEB

WSDL defines the location and functionality of the web service 65

The World Wide Web

UDDI – Universal Description, Discovery and Integration

• UDDI is a standard for describing, publishing, and discovering the web services provided by a
particular service provider.

• It acts as a repository on which the WSDL files are hosted.

UDDI, SOAP and WSDL 66

The World Wide Web

Web Technologies and Web Services

The link describes web services and its components SOAP, WSDL and UDDI.

This link explains the REST web services in detail.

This video is the first in a series of 5 tutorial videos which explain web services, SOAP, WSDL
and UDDI in detail. You are required to refer this entire tutorial for a good understanding of web
services.

Topic URL
Web services https://www.youtube.com/watch?v=1Cs
PHKJWiw0

67
The World Wide Web

Self Assessment Questions

29. _____________ is a standard language for creating web pages.

a) HTML
b) CSS

Answer: a)

30. CSS stands for ____________.

Answer: Cascading Style Sheet.

68
The World Wide Web

31. JavaScript is used to:

a) Add interactivity to a website.

b) Add style to a website.

Answer: a)

32. ASP .NET is a web framework for building dynamic web sites, web applications and web services.
State true or false.

Answer: True.
69
The World Wide Web

33. AJAX sands for _________________.

Answer: Asynchronous JavaScript and XML.

34. PHP is:

a) A client-side scripting language.

b) An open source scripting language for server side programming.

Answer: b)

70
The World Wide Web

35. AJAX is a:

a) Front-end development technology

b) Back-end development technology
c) A group of technologies which enable web page update without reloading
d) A web service

Answer: c)

36. SOAP stands for____________________.

Answer: Simple Object Access Protocol.

71
The World Wide Web

37. SOAP is an:

a) Web technology
b) XML-based messaging protocol
c) a web service
d) a web application

Answer: b)

38. Web Services Description Language is an XML file describing what the web service does and where it
is located. (True/False)

Answer: True.
72
The World Wide Web

39. ___________________ is an architecture style for developing web services.

a) SOAP
b) REST

Answer: b)

40. UDDI stands for_____________________________.

Answer: Universal Description, Discovery and Integration

73
The World Wide Web

41. REST stands for ______________________.

Answer: Representational State Transfer.

42. UDDI is a:

a) a protocol.
b) an architectural style for developing web services.
c) a repository for WSDL files.
d) a language for developing web services.

Answer: c)
74
The World Wide Web

Module
Keyword/Topic E-Book Name Chapter Page Number URL Comments
/Unit

Defines the World

http://pdf.th7.cn/down/files/13
The World Wide Creating a Website: wide web, web
3 Chapter 1 Page No: 7-12 12/creating_a_website_the_mi
Web The Missing Manual browser and web
ssing_manual_3rd_edition.pdf
server.

https://passhojao.com/attachm
ents/7c8727519c30b8baa05ee9
2432e1d9ecdb8075d7/store/9f
Explains the HTTP
Web Technologies – 2d8d06296185d04b4eb79f6536
protocol and HTTP
Hyper Text Transfer A computer Science 879639111d3feef8464d55747a
4 Chapter 1 Page No: 10-20 Request/Response
Protocol Perspective by 803923/Web+Technologies+-
message formats in
Jeffery C. Jackson +A+Computer+Science+Perspec
detail.
tive+-
+J.+Jackson+%28Pearson%2C+2
007%29.pdf

75
The World Wide Web

Assignment

76
The World Wide Web

Assignment
Based on the understanding of Subject in Unit I, You need to find solution of below problem statement:

• Prepare a document to show how Hyper Text Transfer Protocol works and illustrate using an
example.

• Find the ISP and speed of internet for your educational institution.

• Prepare a list of ipv4 and corresponding ipv6 addresses for all computers in the computer lab.

77