Chapter 1

INTRODUCTION
Title and Contents
• Web Technology
• What is HTTP and HTTPS?
• FTP Protocol
• Internet
• Brief history of Internet
• What is www?
• What is Browser?
• What is URL?
• What is HTML?
• What is HTML Tags?
 WEB TECHNOLOGY
• Web technology can be defined as technology that requires browser.
• It is very simple actually, you create a web page or application using
markup language such as HTML, styling language such as CSS and
some scripts to make it dynamic and store it on a server.
• Web technology is basically based on two things SERVER and CLIENT.
Note:
“Web means a network of computers which are interconnected
globally. When you say web technology it is actually the exchange of
information between this network.”
 WEB TECHNOLOGY
• And for this exchange of information we requires certain
protocol/rules to ensure that the exchange of information is
proper.
 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.
• HTTP is the protocol that lets us access the data on the web,
such as text, images, audio, and video.
• HTTP provides standard rules for web browsers & servers to
communicate.
 WHAT IS HTTPS?
• HTTPS stands for Hyper Text Transfer Protocol Secure. It is highly
advanced and secure version of HTTP.
HTTP AND HTTPS?

HTTP HTTPS
It is hypertext transfer protocol. It is hypertext transfer protocol secure.
It is less secure It is less more secure
It uses port 80 by default It was use port 443 by default.
HTTP URLs begin with http:// HTTPs URLs begin with https://
Fast Slow
HTTP AND HTTPS?
 WHAT IS FTP?
• File Transfer Protocol (FTP) is a standard Internet protocol for
transmitting files between computers on the Interne.
INTERNET
• The Internet is a collection of computers around the world
that are connected to one another.
• These computers are connected using:
• Phone Lines
• Fiber Optic Lines
• Wireless connection
• These computers use a common protocol called TCP / IP for
communication.
INTERNET
HISTORY
The work on the internet was started in 1960’s during the war of Russia and America.
America wanted to communicate with its Armed Forces.
A network of Four computers was developed for this purposes.
WWW
• Stands for World Wide Web, which is also known as a Web.
• is a collection of websites or web pages stored in web servers
and connected to local computers through the internet.
• These websites contain text pages, digital images, audois,
videos, etc.
• Users can access the content of these sites from any part of the
world over the internet using their devices such as computers,
laptops, cell phones, etc.
WWW
HISTORY WWW
• The World Wide Web was invented by a
British scientist, Tim Berners-Lee in 1989.
• Originally, it was developed by him to fulfill
the need of automated information
sharing between scientists across the
world.
WHAT IS A BROWSER?
• Browser is the tool that we use to access the content of the
Web
• 1993 - The 1st major browser “Mosaic” was developed at the
National Center for Supercomputing Applications (NCSA)
• Initially handled text only, later graphics-viewing capability
was added.
Types of Browser
Text Based Browsers
Is used to see only textual information,
Does not support mouse. For Example Lynx
Graphical Browsers
Used to see formatted text, graphics, animation can also play
sound and video
For Example Netscape, Internet Explorer
WHAT IS A URL?
• URL stands for Uniform Resource Locator , and is used to specify
addresses on the World Wide Web.
• The unique address assigned to each unique site on the Web
Example
http://www.yahoo.com
Where
• HTTP is a protocol that is used to transfer information from web.
• WWW indicates that the web page which you are looking is a part of web.
• Next part of the address is the domain name and indicates the unique address of
a web site.
WHAT IS HTML?

Stands for Hyper Text Markup Language

The language used to develop web pages.

With HTML you can create your own Web site.

Is a language interpreted by a browser.

Web pages are also called HTML documents.

An HTML file must have an htm or html file extension

UPPERCASE OR LOWERCASE?
• You can use uppercase or lowercase when coding HTML.
• however, most developers use lowercase.
• This helps the readability of your code.
WHAT IS THE DIFFERENCE BETWEEN WEB
PAGE AND A DOCUMENT?

• In a web page the user is not able to make

changes directly.

• In a document the user is able to make changes

directly.
TOOLS FOR WEB CREATION

The basic requirements to create web pages using HTML are as follows
1. Text Editor
Text editor is the place where we can write HTML code like:
• Notepad
• Notepad ++
• sublime

2. Web Browser
Web Browser is a software used to read HTML documents and display them.
• Chrome
• IE
• Firefox
• Safari
WHAT IS AN HTML TAG
• An HTML tag is a signal to the browser that it
should do some thing other than just through text
on the screen.
• HTML tags are surrounded by the two characters
< and >
• The surrounding characters are called angle
brackets
• HTML tags are not case sensitive, <b> means the
same as <B>
• <tagname>content goes here...</tagname>
TYPES OF HTML TAG

1. Paired tags
Which has a closing tag. For example <p> </p>
2. Singular tags:
Does not have a closing tag. For example <br>
PAIRED TAGS
• HTML tags normally come in pairs like <p> and </p>
• The first tag in a pair is the start tag, the second tag is the end tag
• The end tag is written like the start tag, but with a forward
slash inserted before the tag name
• The start tag is also called the opening tag, and the end tag the closing
tag.
BASIC STRUCTURE OF HTML
The HTML document can be into two sections
<HTML>
<HEAD>

</HEAD>
<BODY>

</BODY>
</HTML>
HTML ESSENTIAL TAGS
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
EXAMPLE EXPLAINED
• The <!DOCTYPE html> declaration defines this document to be HTML5
• The text between <html> and </html> describes an HTML document
• The text between <head> and </head> provides information about the
document
• The text between <title> and </title> provides a title for the document
• The text between <body> and </body> describes the visible page
content
• The text between <h1> and </h1> describes a heading
• The text between <p> and </p> describes a paragraph
THE <!DOCTYPE> DECLARATION
• The <!DOCTYPE> declaration represents the
document type, and helps browsers to display
web pages correctly.
• It must only appear once, at the top of the page
(before any HTML tags).
• The <!DOCTYPE> declaration is not case
sensitive.
• The <!DOCTYPE> declaration for HTML5 is:
<!DOCTYPE html>
HTML HEADINGS
• HTML headings are defined with the <h1> to <h6> tags.
• <h1> defines the most important heading <h6> defines the
least important heading:

<h1>This is heading 1</h1>

<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
HTML PARAGRAPHS
• HTML paragraphs are defined with the <p> tag.

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
HTML LINKS
• HTML links are defined with the <a> tag:

<a href="https://www.w3schools.com" > This is a link <a>

• The link's destination is specified in the href attribute.
• Attributes are used to provide additional information about
HTML elements.
 HTML IMAGES
• HTML images are defined with the <img> tag.
• The source file (src) , alternative text (alt) ,width and height
are provided as attributes:

<img src=“rana.jpg" alt="W3Schools.com" width="104" height="142">

THANK YOU.
Any Questions?