Internet and Web Technologies

I
NTERNET
& WEBT
ECHNOLOGIES
byAbhi
las
hSahoo
1 Internet and Web Technologies
Chapter 1 | The Internet and WWW
Internet
A vast network of interconnected computer systems which permit users to communicate and share
information.
It is a network of networks that consists of millions of private and public, academic, business, and
government networks of local to global scope that are linked by a broad array of electronic and
optical networking technologies.
The Internet carries a vast array of information resources and services, most notably the interlinked
hypertext documents of the World Wide Web (WWW) and the infrastructure to support electronic
mail.

World Wide Web
The World Wide Web is a system of interlinked hypertext documents contained on the Internet.
With a web browser, one can view web pages that may contain text, images, videos, and other
multimedia and navigate between them using hyperlinks.
Hypertext
Hypertext is text displayed on a computer with references (hyperlinks) to other text that the
reader can immediately access, usually by a mouse click or keypress sequence. Apart from
running text, hypertext may contain tables, images and other presentational devices.
A hypertext document consists of non‐linear text with links to other text or documents. One
navigates through hypertext by following the active links in the text.
Hyperlinks
A hyperlink, more commonly called a link, is an electronic connection between one web page
to either (1) other web pages on the same web site, or
(2) Web pages located on another web site. More specifically, a hyperlink is a connection
between one pages of a hypertext document to another.

Introduction: Web Architecture
One of the greatest things about the Internet is that nobody really owns it. It is a global collection of networks,
both big and small. These networks connect together in many different ways to form the single entity that we
know as the Internet. In fact, the very name comes from this idea of interconnected networks.
The Internet: Computer Network Hierarchy
Internet Service Provider (ISP)
An Internet service provider (ISP, also called Internet access provider, or IAP) is a company or organization
that has the equipment and telecommunication line access to provide connectivity to the Internet for
customers. This is usually done for a set yearly or monthly fee.
Point of Presence (POP)
The POP is a place for local users to access the company's network, often through a local phone
number or dedicated line.
Every computer that is connected to the Internet is part of a network, even the one in your home.
For example, you may use a modem and dial a local number to connect to an Internet Service
Provider (ISP). At work, you may be part of a local area network (LAN), but you most likely still
connect to the Internet using an ISP that your company has contracted with. When you connect to
your ISP, you become part of their network. The ISP may then connect to a larger network and
become part of their network.
Most large communications companies have their own dedicated backbones connecting various
regions. In each region, the company has a Point of Presence (POP). The amazing thing here is that
there is no overall controlling network. Instead, there are several high‐level networks connecting to
each other through Network Access Points or NAPs.

When you connect to the Internet, your computer becomes part of a network.
DNS: Domain Name System
When the Internet was in its infancy, it consisted of a small number of computers hooked together
with modems and telephone lines. You could only make connections by providing the IP address of
the computer you wanted to establish a link with.
For example, a typical IP address might be 216.27.22.162. This was fine when there were only a few
hosts out there, but it became unwieldy as more and more systems came online.
The first solution to the problem was a simple text file maintained by the Network Information
Center that mapped names to IP addresses. Soon this text file became so large it was too
cumbersome to manage. In 1983, the University of Wisconsin created the Domain Name System
(DNS), which maps text names to IP addresses automatically. This way you only need to remember
www.example.com, for example, instead of example.com's IP address.
URL: Uniform Resource Locator
When you use the Web or send an e‐mail message, you use a domain name to do it. For example,
the Uniform Resource Locator (URL) "http://www.example.com" contains the domain name
example.com. So does this e‐mail address: admin@example.com. Every time you use a domain
name, you use the Internet's DNS servers to translate the human‐readable domain name into the
machine‐readable IP address.
Top‐level domain names, also called first‐level domain names, include .COM, .ORG, .NET, .EDU and
.GOV. Within every top‐level domain there is a huge list of second‐level domains. For example, in the
.COM first‐level domain there is:
Google
Yahoo
Microsoft

Every name in the .COM top‐level domain must be unique. The left‐most word, like www, is the host
name. It specifies the name of a specific machine (with a specific IP address) in a domain. A given
domain can, potentially, contain millions of host names as long as they are all unique within that
domain.
DNS servers accept requests from programs and other name servers to convert domain names into
IP addresses. When a request comes in, the DNS server can do one of four things with it:
1 It can answer the request with an IP address because it already knows the IP address for the
requested domain.
2 It can contact another DNS server and try to find the IP address for the name requested. It
may have to do this multiple times.
3 It can say, "I don't know the IP address for the domain you requested, but here's the IP
address for a DNS server that knows more than I do."
4 It can return an error message because the requested domain name is invalid or does not
exist.

Internet Protocol
Protocols
Protocols (rules determining the format and transmission of data) are often text and simply describe how
the client and server will have their conversation.
Internet Protocol Suite
The Internet Protocol Suite (commonly known as TCP/IP) is the set of communications protocols used for the
Internet and other similar networks. It is named from two of the most important protocols in it: the
Transmission Control Protocol (TCP) and the Internet Protocol (IP), which were the first two networking
protocols defined in this standard.
Internet Protocol (IP)
The Internet Protocol (IP) is a protocol used for communicating data across a packet‐switched internetwork
using the Internet Protocol Suite, also referred to as TCP/IP.
IP is the primary protocol in the Internet Layer of the Internet Protocol Suite and has the task of delivering

distinguished protocol datagrams (packets) from the source host to the destination host solely based on their
addresses.
Transmission Control Protocol (TCP)
The Transmission Control Protocol (TCP) is one of the core protocols of the Internet Protocol Suite. TCP
provides a communication service at an intermediate level between an application program and the Internet
Protocol (IP). That is, when an application program desires to send a large chunk of data across the Internet
using IP, instead of breaking the data into IP‐sized pieces and issuing a series of IP requests, the software can
issue a single request to TCP and let TCP handle the IP details.
TCP is used extensively by many of the Internet's most popular applications, including the World Wide Web,
E‐mail, File Transfer Protocol, Secure Shell, and some streaming media applications.
File Transfer Protocol
File Transfer Protocol (FTP) is a standard network protocol used to exchange and manipulate files over a
TCP/IP based network, such as the Internet. FTP is built on client‐server architecture and utilizes separate
control and data connections between the client and server applications. Applications were originally
interactive command‐line tools with standardized command syntax, but graphical user interfaces have been
developed for all desktop operating systems in use today
Hypertext transfer protocol (HTTP).
A protocol (utilizing TCP) to transfer hypertext requests and information between servers and browsers.
Hypertext Transfer Protocol (HTTP) is an application‐level protocol for distributed, collaborative, hypermedia
information systems. Its use for retrieving inter‐linked resources, called hypertext documents.
There are two major versions, HTTP/1.0 that uses a separate connection for every document and HTTP/1.1
that can reuse the same connection to download, for instance, images for the just served page. Hence
HTTP/1.1 may be faster as it takes time to set up such connections.
Request line, such as GET /images/logo.gif HTTP/1.1, which requests a resource called
/images/logo.giffrom server
Ports and HTTP
Any server machine makes its services available using numbered ports: one for each service that is
available on the server.
For example, if a server machine is running a Web server and a file transfer protocol (FTP) server, the
Web server would typically be available on port 80, and the FTP server would be available on port 21.
Clients connect to a service at a specific IP address and on a specific port number.
Once a client has connected to a service on a particular port, it accesses the service using a specific
protocol. Every Web server on the Internet conforms to the hypertext transfer protocol (HTTP).
Internet Servers and Clients
Internet servers make the Internet possible. All of the machines on the Internet are either servers or
clients. The machines that provide services to other machines are servers. And the machines that are
used to connect to those services are clients. There are Web servers, e‐mail servers, FTP servers and
so on serving the needs of Internet users all over the world.
When you connect to example.com to read a page, you are a user sitting at a client's machine. You
are accessing the example.com Web server. The server machine finds the page you requested and
sends it to you. Clients that come to a server machine do so with a specific intent, so clients direct
their requests to a specific software server running on the server machine. For example, if you are
running a Web browser on your machine, it will want to talk to the Web server on the server
machine, not the e‐mail server.
A server has a static IP address that does not change very often. A home machine that is dialing up
through a modem, on the other hand, typically has a dynamic IP address assigned by the ISP every
time you dial in. That IP address is unique for your session ‐‐it may be different the next time you dial
in. This way, an ISP only needs one IP address for each modem it supports, rather than one for each
customer.
Website and Web Pages
Webpage
A webpage or web page is a document or resource of information that is suitable for the World
Wide Web and can be accessed through a web browser and displayed on a computer screen.
This information is usually in HTML or XHTML format, and may provide navigation to other webpages
via hypertext links.
Webpages may be retrieved from a local computer or from a remote web server. The web server may restrict
access only to a private network, e.g. a corporate intranet, or it may publish pages on the World Wide Web.
Webpages are requested and served from web servers using Hypertext Transfer Protocol (HTTP).
These are of two types:
1. Static webpage
A static web page is a web page that always comprises the same information in response to all download
requests from all users.
Classical web page design using only HTML or XHTML provides static content, meaning that a page retrieved
by different users at different times is always the same.
Advantages
Quick and easy to put together, even by someone who doesn't have much experience.
Ideal for demonstrating how a site will look.
Cache friendly, one copy can be shown to many people.

Disadvantages
Difficult to maintain when a site gets large.
Difficult to keep consistent and up to date.
Offers little visitor personalization (all would have to be client side).

2. Dynamic Webpage
A dynamic web page is a hypertext document rendered to a World Wide Web user presenting content
that has been customized or actualized for each individual viewing or rendition or that continually updates
information as the page is displayed to the user.
However, a web page can also provide a live user experience. Content (text, images, form fields, etc.)
on a web page can change, in response to different contexts or conditions. There are two ways to
create this kind of effect:
Using client‐side scripting to change interface behaviors within a specific web page, in
response to mouse or keyboard actions or at specified timing events. In this case the dynamic
behavior occurs within the presentation.
Using server‐side scripting to change the supplied page source between pages, adjusting the
sequence or reload of the web pages or web content supplied to the browser. Server responses may
be determined by such conditions as data in a posted HTML form, parameters in the URL, the type of
browser being used, the passage of time, or a database or server state.

Client‐Side Scripting
Client‐side scripting generally refers to the computer programs on the web that are executed at client‐side, by
the user's web browser.
This type of computer programming is an important part of the Dynamic HTML (DHTML) concept, enabling
web pages to be scripted; that is, to have different and changing content depending on user input,
environmental conditions (such as the time of day), or other variables
JavaScript (Client‐side JavaScript) and VBScript are examples of client‐side scripts.
Server‐Side Scripting
Server‐side scripting is a web server technology in which a user's request is fulfilled by running a script directly
on the web server to generate dynamic web pages. It is usually used to provide interactive web sites that
interface to databases or other data stores.
In contrast, server‐side scripts, written in languages such as Perl, PHP, and server‐side VBScript, are executed
by the web server when the user requests a document.
Web Browser
A Web browser is a software application for retrieving, presenting, and traversing information resources on
the World Wide Web.
Although browsers are primarily intended to access the World Wide Web, they can also be used to access
information provided by Web servers in private networks or files in file systems.
Microsoft Internet Explorer
It is a series of graphical web browsers developed by Microsoft and included as part of the Microsoft Windows
line of operating systems starting in 1995.The latest release is Internet Explorer 8, which is available as a free
update for Windows XP with Service Pack 2 or later.

Internet Explorer Ver. 8.0
Netscape Navigator
Netscape Navigator and Netscape are the names for the proprietary web browser popular in the 1990s, the
flagship product of the Netscape Communications Corporation and the dominant web browser in terms of
usage share, although by 2002 its usage had almost disappeared. One of the reasons for this was due to the
popularity of Microsoft's Internet Explorer web browser software and other web browsers, and partly because
the Netscape Corporation (later purchased by AOL) did not sustain Netscape Navigator's technical innovation
after the late 1990s
Web Server
The primary function of a web server is to deliver web pages (HTML documents) and associated
content (e.g. images, style sheets, JavaScripts) to clients.
A client, commonly a web browser, makes a request for a specific resource using HTTP and, if all goes
well, the server responds with the content of that resource. While the primary function is to serve
content, a full implementation of HTTP also includes a way of receiving content from clients. This
feature is used for submitting web forms, including uploading of files.
Many generic web servers also support server‐side scripting (e.g. Apache HTTP Server and PHP). This
means that the behavior of the web server can be scripted in separate files, while the actual server
software remains unchanged
Apache HTTP Server
The Apache HTTP Server commonly referred as Apache. Apache was the first viable alternative to the
Netscape Communications Corporation web server (currently known as Sun Java System Web Server).
The application is available for a wide variety of operating systems, including Unix, GNU, FreeBSD, Linux,
Solaris, Novell NetWare, Mac OS X, Microsoft Windows, OS/2, TPF, and eComStation. The majority of web
servers using Apache run the Linux operating system.
Apache is developed and maintained by an open community of developers under the auspices of the Apache
Software Foundation. It has been the most popular HTTP server software in use.
Features of Apace Server
1 Supports server‐side programming language and authentication schemes.
2 Virtual hosting allows one Apache installation to serve many different actual websites. For example,
one machine with one Apache installation could simultaneously serve www.example.com, www.test.com,
test47.test‐server.test.com, etc.

Uses of Apache Server
Apache is primarily used to serve both static content and dynamic Web pages on the World Wide
Web. Many web applications are designed expecting the environment and features that Apache provides.
Apache is used for many other tasks where content needs to be made available in a secure and
reliable way. One example is sharing files from a personal computer over the Internet. A user who has Apache
installed on their desktop can put arbitrary files in Apache's document root which can then be shared.

Chapter 2 | Introduction to HTML
What is Hypertext Markup Language?
HTML (Hypertext Markup Language) is the set of markup symbols or codes inserted in a file intended for
display on a World Wide Web browser page. The markup tells the Web browser how to display a Web page's
words and images for the user.HTML documents are also called Web Pages.
HTML Tags
HTML tags (otherwise known as "HTML elements"), and their respective attributes are used to create HTML
documents so that you can view them in browsers.
Complete list of HTML tags
Below is a complete list of HTML tags from the HTML 4.01 specification.
1. <!‐‐...‐‐> 31. <em> 61. <p>

2. <!doctype> 32. <fieldset> 62. <param>
3. <a> 33. <font> 63. <pre>
4. <abbr> 34. <form> 64. <q>
5. <acronym> 35. <frame> 65. <s>
6. <address> 36. <frameset> 66. <samp>
7. <applet> 37. <h1> 67. <script>
8. <area> 38. <head> 68. <select>
9. <b> 39. <hr> 69. <small>
10. <base> 40. <html> 70. <span>
11. <basefont> 41. <i> 71. <strike>
12. <bdo> 42. <iframe> 72. <strong>
13. <big> 43. <img> 73. <style>
14. <blockquote> 44. <input> 74. <sub>
15. <body> 45. <ins> 75. <sup>
16. <br> 46. <isindex> 76. <table>
17. <button> 47. <kbd> 77. <tbody>
18. <caption> 48. <label> 78. <td>
19. <center> 49. <legend> 79. <textarea>
20. <cite> 50. <li> 80. <tfoot>
21. <code> 51. <link> 81. <th>
22. <col> 52. <map> 82. <thead>
23. <colgroup> 53. <menu> 83. <title>
24. <dd> 54. <meta> 84. <tr>
25. <del> 55. <noframes> 85. <tt>
26. <dfn> 56. <noscript> 86. <u>
27. <dir> 57. <object> 87. <ul>
28. <div> 58. <ol> 88. <var>
29. <dl> 59. <optgroup>
30. <dt> 60. <option>

HTML tags can be of two types. They are:
1 Paired Tags
2 Unpaired Tags

Paired Tags
A tag is said to be a paired tag if the text is placed between a tag and its companion tag. In paired tags,
the first tag is referred to as Opening Tag and the second tag is referred to as Closing Tag.
Example: <i>I am in italics. </i>
Note: Here <i> is called opening tag and </i> is called closing tag.

Unpaired Tags:
An unpaired tag does not have a companion tag. Unpaired tags are also known as Singular or Stand‐
Alone Tags.
Example : <br> , <hr> etc. These tags do not require any companion tag.

Now using the above tags we can create a web page.

Structure and Model of Website
To create a basic HTML page having a title and some text in the body, we have to follow some steps.

Step 1: Open the notepad or some text editor.
Step 2: Write the basic format or the skeleton of the webpage.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01

Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head> <title>My First HTML
Page</title></head> <body> My
text goes here. </body>
</html>
Step 3: The text editor, which normally saves files with the extension “.txt”. We want to make it save in
“.html” instead, so, in your text editor click File ‐‐Save As…. Find the place on your hard drive where you want
to keep all your pages. If you use Microsoft Windows, there will be a box labeled “save as type”; change it to
“all files *.*” Now type in the name index.html or index.htm for your file and click save.
Step 4: Now open the index.html webpage from your hard drive with a Web Browser.
Tags Description
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01

Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
This complicated looking bit at the top isn’t something you need to worry about just yet. It basically tells your
browser which version of HTML you’re using in your page. We are using HTML 4.01, the most recent version
of HTML.
<html>
These are the standard start and end tags on any page that means “you must put” and these two tags will
contain the rest of the HTML that makes your page.
<head>
The head can contain other HTML tags that provide information about the document such as title,
description, keywords etc. Most of this information is not displayed in the browser (although the title
usually appears in the browser's title bar)
<title>
The title is usually displayed in the browser's title bar (at the top). It is also typically used by search
engines (to display the page title in the search results page) and browsers "favorites" lists.
<body>
The HTML body tag is used for indicating the main content section of the HTML document. The body tag is
placed between the </head> and the </html> tags.
HTML Attributes
HTML tags can contain one or more attributes. Attributes are added to a tag to provide the browser with
more information about how the tag should appear or behave. Attributes consist of a name and a value
separated by an equals (=) sign.
Some of the more common attributes are:

Align Specifies the horizontal alignment of an left, center, or right
element
(the name of a
Class Used with Cascading Style Sheets (CSS)
class)
Style Used with Cascading Style Sheets (CSS) (style information)
(You supply the
Title Can be used to display a "tooltip" for
text)
your elements.

Some Important Tags
1. <a>
The HTML atag is used for creating a hyperlink to either another document, or somewhere within the current
document.
Example
<a href="http://www.example.com/index.html" target="_blank">Home</a>
name Marks an area of the page that a link jumps to.
href Specifies the URL of a page or the name of the anchor that the link goes to.
target Specifies the target frame to load the page into. Possible values:
_blank
_self
_top
_parent

2. <area>
The HTML areatag is used for defining an area in an image map. This tag is used in conjunction with the
<map> tag and <img> tag to create an image map.
Example
<img src ="/images/logo.jpg"width="225" height="151" border="0"
alt="Logo of Innovate7 Technologies"usemap ="#Innovate7" />
<map id ="Innovate7" name="Innovate7">
<area shape ="rect" coords ="90,80,120,151"

href="http://www.innovate7.com/index.html" target="_blank"alt="Innovate7" />
</map>
Attributes specific to this tag:

shape Defines a shape for the clickable area. Possible values:
default
rect
circle
poly

coords Specifies the coordinates of the clickable area. Coordinates are specified as follows:
rect: left, top, right, bottom
circle: center‐x, center‐y, radius
poly: x1, y1, x2, y2, ...

nohref Specifies that the area has no link.
3. <b>
The HTML btag is used for specifying bold text.
Example
<b>The Text is Bold</b>
Output will be: Text is Bold
4. <body>
The HTML body tag is used for indicating the main content section of the HTML document. The body tag is
placed between the </head> and the </html> tags.
Example
<html>
<head>
<title>HTML body tag</title>
</head>
<body style="background-color:orange">
Document content goes here
</body>
</html>

background Specifies the URI/URL of a background image.
text Specifies the text color.
Link Specifies the color of unvisited hyperlink text
Vlink Specifies the color of visited hyperlink text.
Specifies the color of active hyperlink text (i.e. when the user clicks on
Alink it)

5. <br>
The HTML brtag is used for specifying a line break.
Example
This is before the line break <br> and this after the line break.

Output will be:
This is before the line break
and this after the line break.

5. <button>
The HTML buttontag is used for creating a button within forms.
Example
<form>
<button name="Button" value="Submit" type="button">Click Me</button>
</form>


name Assigns the name of the button control.
value Assigns an initial value to the button.
type Specifies the type of button. Possible values:
submit (default)
reset
button

6. <center >
The HTML centertag is used to center‐align HTML elements.
Example
<center>This text is centered</center>.
Output will be:
This text is centered
7. <del>
The HTML deltag is used for markup of deleted text.
ExampleI am <del>Deleted</del>text
Output will be:
I am Deleted text
8. <em>
The HTML emtag is used for indicating emphasis. The em tag surrounds the word/term being emphasized.
Example
I can <em>not</em> emphasize this enough!
Output will be:
I can not emphasize this enough!
9. <font>
The HTML fonttag is used to specify the font to use.
Example
<font face="Comic Sans,serif" size="4">The HTML font tag is now Comic Sans.
</font>
Output will be:

The HTML font tag is now Comic Sans.
10. <form>
The HTML form tag is used for declaring a form. The <form> tag is used in conjunction with form‐associated

elements. To create a form, you can nest form‐associated elements inside the opening/closing <form>tags.
Here are the elements that you can use with your forms.
<input>
<textarea>
<button>
<select>
<option>
<optgroup>
<fieldset>
<label>

Example
<form name="form1" action="index.php" method="get">
</form>

unique.
action Specifies a URI/URL of the page that will process the form.
method Specifies the HTTP method to use when the form is submitted. Possible values:
get (the form data is appended to the URL when submitted)
post (the form data is not appended to the URL)

enctype Specifies the content type used to encode the form data set when it's submitted to the server.
Possible values:
application/x‐www‐form‐urlencoded (default)
multipart/form‐data (use this when uploading files)

10. <frame>
The HTML frametag is used to specify each frame within a frameset. For example, you can have a left frame
for navigation and a right frame for the main content. For each frame, you specify the frame with the frame
tag.
Example
<frameset cols = "25%, *"><noframes> <body>Your browser doesn't support
frames.Therefore, this is the noframe version of the site.</body></noframes>
<frame src ="frame_example_left.html" />
<frame src ="frame_example_right.html" />
</frameset>

name Assigns a name to a frame. This is useful for loading contents into one frame from
another.
longdesc A long description ‐this can elaborate on a shorter description specified with the title
attribute.
src Location of the frame contents (for example, the HTML page to be loaded into the
frame).
nosize Specifies whether the frame is resizable or not (i.e. whether the user can resize the
frame or not).

scrolling Whether the frame should be scrollable or not. Possible values:
auto
yes
no

11. <h1>
The HTML h1tag is used for specifying level 1 headings. There are 6 levels of headings (h1‐h6) with h1 the

most important and h6the least important.
Example
<h1>Level 1 heading using the HTML h1 tag</h1>
Output will be:
Level 1 heading using the HTML h1 tag
12. <head>
The HTML headtag is used for indicating the head section of the HTML document.
Example
<head>
<title>HTML head tag</title>
</head>
The head can contain other HTML tags that provide information about the document such as title,
description, keywords etc. Most of this information is not displayed in the browser (although the title
usually appears in the browser's title bar) but can be useful for search engines etc. The head tag is
placed between the <html> and the <body> tags.
12. <hr>
The HTML hrtag is used for creating a horizontal rule.
Example
<p>Here is a horizontal rule :<hr/></p>
13. <iframe>
The HTML iframetag is used to specify an inline frame. An inline frame allows you to embed another
document within the current HTML document. You use the iframe srcattribute to specify the source of the
other document, as well as other attributes to determine the height, width, scrolling properties, border etc.
Example
<iframe src="images/logo.jpg"
width="200" height="150" scrolling="auto"
frameborder="1">
</iframe>

longdesc A long description ‐this can elaborate on a shorter description specified with the
title
attribute.
Width Specifies the width of the inline frame.

13. <img>
The HTML imgtag is used for embedding images into an HTML document.
To use this tag, the images you specify in the src attribute needs to be available on a web server. This could be
your own web server or another web server (such as Flickr).
Example<img src="images/background.jpg" width="225" height="151"

alt="BackgroundImage">

scripts. However, you should use the idattribute instead.
longdesc Specifies a URI/URL of a long description ‐this can elaborate on a shorter
description
specified with the altattribute.
src Location of the image.

14. <input>
The HTML inputtag is used within a form to declare an input element ‐a control that allows the user to input
data.

type Specifies the type of control. Possible values:
text
password
checkbox
radio
submit
reset
file
hidden
image
button

name Assigns a name to the input control.
Specifies the intial value for the control. Note: If type="checkbox" or type="radio"
value
this
attribute is required.
Specifies the width of the control. If type="text" or type="password" this refers to
size
the
width in characters. Otherwise it's in pixels.
Specifies the maximum number of characters that the user can input. This can be
maxlength
bigger
than the value indicated in the sizeattribute.
checked If type="radio" or type="checkbox" it will already be selected when the page loads.
src If type="image", this attribute specifies the location of the image.

15. <li>
The HTML litag is used for specifying a list item in ordered, unordered, directory, and menu lists.
Example
<li>ol - ordered list</li>
<li>ul - unordered list</li>
<li>dir - directory list (deprecated)</li>
<li>menu - menu list (deprecated)</li>

Output will be:
ul ‐unordered list
• ol ‐ordered list

dir ‐directory list (deprecated)
menu ‐menu list (deprecated)

16. <object>
The HTML objecttag is used for embedding an object within an HTML document. Use this tag to
embed multimedia in your web pages.
The objecttag is used to include objects such as images, audio, videos, Java applets, ActiveX, PDF, and Flash.
Example
<object data="video.avi" type="video/avi" /> </object>

Plug‐Ins
A helper application is a program that can be launched by the browser to "help" playing a video. Helper
applications are also called Plug‐Ins.

archive A space separated list of URL's to archives. The archives contains resources
relevant to the object
border Defines a border around the object
classid Defines a class ID value as set in the Windows Registry or a URL
codebase Defines where to find the code for the object
codetype The internet media type of the code referred to by the classid attribute
data Defines a URL that refers to the object's data

hspace Defines the horizontal spacing around the object
name Defines the name for an object (to use in scripts)
standby Defines a text to display while the object is loading
type Defines the MIME type of data specified in the data attribute
usemap Specifies a URL of a client‐side image map to be used with the object

vspace Defines the vertical spacing around the object

17. <option>
The optiontag is used for defining option items within the selectlist.
Example
<select> <option value ="Bhubaneswar">Bhubaneswar</option><option value
="Balasore">Balasore</option><option value ="Cuttack"
selected>Cuttack</option><option value ="Khurdha">Khurdha</option>
</select>

selected Specifies that this option will be pre‐selected when the user first loads the
page.
value Specifies the initial value of the option item.
label Specifies a shorter label for an option

18. <p>
The HTML ptag is used for defining a paragraph. The p element automatically creates some space before and
after itself. The space is automatically applied by the browser.
Example
<p>This paragraph is defined using the HTML p tag.</p>
<p>This is a new paragraph which is also defined using the HTML p tag.</p>
Output will be:
This paragraph is defined using the HTML p tag.
This is a new paragraph which is also defined using the HTML p tag.

19. <param>
The HTML param tag is used for passing parameters to an embedded object. This tag is used in conjuction
with the <object> tag to embed an object within an HTML document.
Example
<object title="Woofer dog." classid="wooferDog.class"><param name="audio"
value="woof.mp3"><param name="width" value="600"><param name="height" value="400">
</object>

value Specifies the value of the parameter.
valuetype Specifies the type of value. Possible values:
data (default)
ref ‐the value is a URI of a resource • object ‐the value is an object within the same document

20. <pre>
The HTML pretag is used for indicating preformatted text. The code tag surrounds the code being marked
up.
Browsers normally render pre text in a fixed‐pitched font, with whitespace intact, and without word wrap.
Example
<pre>This text hasbeen formatted usingthe HTML pre tag. The browser
shoulddisplay all white spaceas it was entered.
Output will be:
This text has been formatted
usingthe HTML pre tag. The
browser shoulddisplay all white
spaceas it was entered.
20. <script>
The HTML scripttag is used for declaring a script (such as JavaScript) within your HTML document.
Example
<script type="text/javascript">
document.write('The HTML Script tag allows
you to place a
script within your HTML documents');
</script>

name Defines the name of the parameter.
src Specifies a URI/URL of an external script.
language Specifies the scripting language.
type Specifies the scripting language as a content‐type (MIME type).
Declares that the script will not generate any content. Therefore, the browser/user
defer
agent
can continue parsing and rendering the rest of the page.

Output will be:
The HTML Script tag allows you to place a script within your HTML documents
21. <select>
The selecttag is used to create a select list (drop‐down list).
The optiontags inside the select element define the available options in the list.

Example
<select> <option value="volvo">Volvo</option><option
value="saab">Saab</option><option value="mercedes">Mercedes</option><option
value="audi">Audi</option>
</select>

disabled Specifies that a drop‐down list should be disabled
multiple Specifies that multiple options can be selected
Specifies the number of visible options in a drop‐down
size list

21. <table>
The HTML tabletag is used for defining a table. The table tag contains other tags that define the structure of
the table. A simple HTML table consists of the table element and one or more tr, th, and td elements.
The tr element defines a table row, the th element defines a table header, and the td element defines a table
cell.
Example
<table border="1">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
•
<td>January</td><
td>$100</td></tr>
</table>
center
right

bgcolor Specifies the background color for a table.
border Specifies the width of the borders around a table.
Specifies the space between the cell wall and the cell
cellpadding
content.
cellspacing Specifies the space between cells.

22. <td>
The HTML <td> tag is used for specifying a cell (or table data) within a table. An HTML table has two kinds
of cells:
Header cells ‐contains header information (created with the th element)
Standard cells ‐contains data (created with the td element)

align Aligns the content in a cell
left
right
center
justify
char

bgcolor Specifies a background color for a cell
valign Vertical aligns the content in a cell
top
middle
bottom
baseline

cellpadding Specifies the space between the cell wall and the cell content
nowrap Specifies that the content inside a cell should not wrap
22. <textarea>
The HTML <textarea>tag is used within a form to declare a textarea element ‐a control that allows the user
to input text over multiple rows
Example<textarea rows="3" cols="40"> Textarea provides
space for as many characters as you like.</textarea>
Attributes specific to this tag: 23. <title>

name Assigns a name to the input control.
rows Specifies the height of the textarea based on the number of visible lines of text. If there's
more text than this allows, users can scroll using the textarea's scrollbars.
cols Specifies the width of the textarea based on the number of visible character widths.

The HTML <title> tag is used for declaring the title of the HTML document.
The title is usually displayed in the browser's title bar (at the top). It is also typically used by search
engines (to display the page title in the search results page) and browsers "favorites" lists.
Example
<title>HTML title tag</title>
24. <tr>
The HTML <tr> tag is used for specifying a table row within a table. A table row contains one or more td
and/or th tags which determine individual cells.
Example
<table border = "1"><tr>
<td>Cell 1</td>
<td>Cell 2</td></tr>
</table>
25. <u>
The HTML utag is used for rendering underlined text.
Example
The HTML u tag renders <u>underlined</u> text.
Output will be:
The HTML u tag renders underlined text.

Introduction: The Common Gateway Interface
1. Data Communication on the Web
A Web client program (such as a web browser) can access data from many different servers, such as FTP or
HTTP. The HTTP server was designed specifically for the Web, and employs a protocol (system of messages)
that supports sending documents from the server to a browser, and that also support sending complex data
from the client back to the server. There are several HTTP methods for doing this. The most common
methods are
• GET: the data are passed within the query string of the URL.
For example, accessing the URL http://bla.bla.edu/stuff/program?query_string; sends the data
included in query_string to the HTTP server running on the machine bla.bla.edu.
POST: The data are sent as a message body that follows the request message sent by the client to the
server. This is more complex than GET, but allows for more complex data.

The data can be sent from the client browser to the HTTP server. The Common Gateway Interface, or CGI, is
the mechanism used by most servers to process these client data.
2. Server Processing of Passed Data: Gateway Programs
Sending data to the server is one thing, but in most cases the server cannot itself process the data, most HTTP
server program are designed only to serve out documents, and are not designed to process data sent from a
client. Therefore, if you want to do server‐side processing of the data sent from a fill‐in HTML FORM (or by
any other mechanism), you need three things:
a second program to do process the data sent by the client,
a mechanism by which the server can forward the data to this second program. Such secondary
programs are called gateway programs, because they act as a gateway between the Web and other resources
on the HTTP server machine, such as databases
a way whereby this second program can return data to the client, so that the gateway program can
return results of its analysis to the user.

An example of this flow of information is shown in the attached figure ‐‐the arrows show the flow of data,
while the small ovals straddling the lines show the protocols and mechanisms by which the data are
communicated from client(browser)‐to‐server‐to‐gateway and back again.

Figure: Flow of Data to Gateway Programs
This figure illustrates the flow of data when a user accesses a CGI program. The solid line shows to data flow
using HTTP and CGI. HTTP transfers data from the client to the HTTP server and back again. The CGI
mechanisms control the flow of data from the server to the gateway program (shown as the prism) and back
again. These are called gateway programs because they generally act as gateways between the World Wide
Web and server‐side resources such as databases, feedback forms, clickable imagemaps, and so on.
3. The Common Gateway Interface
CGI (Common Gateway Interface) is the generic interface between the server and server‐side 'gateway'
programs. CGI specifies how data are sent to the gateway program, and how data can be returned by the
gateway program, through the server and back to the browser that originally sent the data. The basic
mechanisms are:
1. Sending Data to the Gateway Program
The CGI specifies how data are sent to the gateway program (as environment variables or as data
read, by the gateway program, from standard input) and what data are sent (in general, all the data
sent by the client to the server, plus extra environment variables describing the status of the server).
2. Returning Data to the Client
To return data back to the client program (the user's web browsers) the gateway program just writes
data to its regular (standard) output. These data are sent back to the client, after some processing by
the server to ensure they have the correct message headers describing the data and the state of the
transaction.
Illustration
The best way to illustrate this is with an example: A web page is created to add up numbers. The viewer
enters in 2 numbers, and the webpage then adds up those numbers, and returns the answer to the viewer.
HTML is not designed to process or calculate numbers, but what it can do, is pass those numbers to another
program, and then accept an answer from that program for the viewer to see. So you really have 2 programs
communicating with each other ‐one to calculate, and one to display (the HTML). Common Gateway Interface
is the standard way for these programs to communicate.
4. Some more about Common Gateway Interface
Web servers often have a cgi‐bin directory at the base of the directory tree to hold executable files
called with CGI.
The program returns the result to the web server in the form of standard output, prefixed by a
header and a blank line.

5. Internal Workings of CGI
So how does the whole interface work? Most servers expect CGI programs and scripts to reside in a special
directory, usually called cgi‐bin, and/or to have a certain file extension. When a user opens a URL associated
with a CGI program, the client sends a request to the server asking for the file.
For the most part, the request for a CGI program looks the same as it does for all Web documents. The
difference is that when a server recognizes that the address being requested is a CGI program, the server
does not return the file contents verbatim. Instead, the server tries to execute the program. Here is what a
sample client request might look like:
GET /cgi-bin/index.pl HTTP/1.0Accept: www/sourceAccept: text/htmlAccept:

image/gifUser-Agent: Lynx/2.4 libwww/2.14From: abhilash@nmgroup.edu
This GET request identifies the file to retrieve as /cgi‐bin/index.pl. Since the server is configured to recognize
all files in the cgi‐bin directory tree as CGI programs, it understands that it should execute the program
instead of relaying it directly to the browser. The string HTTP/1.0 identifies the communication protocol to
use.
The client request also passes the data formats it can accept (www/source, text/html, and image/gif),
identifies itself as a Lynx client, and sends user information. All this information is made available to the CGI
program, along with additional information from the server.
The server is then responsible for adding the complete header information and using the HTTP protocol to
transfer the data to the client.
Here is the sample output of a program generating an HTML virtual document, with the complete HTTP
header:
HTTP/1.0 200 OKDate: Monday, 30-November-09 08:28:00 GMTServer:
NCSA/1.4.2MIME-version: 1.0 Content-type: text/htmlContent-length: 2000<HTML>
<HEAD><TITLE>Welcome to Abhilash's WWW Server!</TITLE></HEAD><BODY>
<H1>Welcome!</H1> . . </BODY></HTML>
6. Advantages of Common Gateway Interface
1. Language independent: CGI programs can be written in any language that allows one to write normal
programs since they are executed in the same way as the normal programs. A CGI program can be written in
any language that allows it to be executed on the system, such as:
C/C++
Fortran
PERL
TCL
Any Unix shell
Visual Basic
AppleScript

1 Platform Independent: The popular Web servers developed their own extension mechanisms that
allow third‐party software to run inside the web server itself, e.g. Apache modules, Netscape NSAPI plug‐ins,
IIS ISAPI plug‐ins.
2 Simple interface: It’s not necessary to have any special library to create a CGI program, or write
programs using a particular API. Instead, CGI programs rely on the standard concepts of standard input,
standard output, and environment variables to communicate with the Web server.

7. Drawbacks of Common Gateway Interface
1 CGI call involves use of a scripting language such as csh or perl, coding errors are highly likely to result
in a code injection vulnerability.
2 One disadvantage is that CGI programs are slow since they need to form a new process for every
HTTP request and the database connection must be reopened for the next instance of the program, which is
quite costly.

Basic JavaScript
JavaScript is a very easy way to add all sorts of dynamic elements to your website. Unless you've had some
programming experience, JavaScript will be quite a new concept at the start — it's fairly different to HTML. In
this chapter we'll be laying some groundwork on the language, and writing our first script.
What is JavaScript?
JavaScript is a simple scripting language invented specifically for use in web browsers to make websites more
dynamic. On its own, HTML is capable of outputting more‐or‐less static pages. Once you load them up your
view doesn't change much until you click a link to go to a new page. Adding JavaScript to your code allows
you to change how the document looks completely, from changing text, to changing colours, to changing the
options available in a drop‐down list (and much, much more!)
JavaScript is a client‐side language, which means all the action occurs on the client's (reader's) side of things.
JavaScript operations are usually performed instantaneously. In fact, JavaScript is often used to perform
operations that would otherwise encumber the server, like form input validation. This distribution of work to
the relatively quick client‐side service speeds up the process.
The Java Connection
Understandably, JavaScript's connection with Java is regularly misunderstood. They are not the same thing.
Java, created by Sun Microsystems, is a full computer programming language like C++, suitable for
writing complete, large‐scale programs.
JavaScript, on the other hand, was created by Netscape. It was based to some degree on Java — the
syntax of the code is very similar — but it is very rarely used for anything outside of a browser. It was actually
originally to be called 'Live Script', but Java's increasing popularity at the time made Netscape change the
name for marketing reasons.

Similarities:
They are both forms of Object‐Oriented Programming, or OOP. This means that you work with small objects
that are combined together to form larger objects.
Scripting language or Script
A scripting language is a programming language; that can be interpreted by a browser without needing to
be compiled first. The script is actually just some commands that the browser has to do.
Implementation
So how are we going to get our JavaScript into our pages? JavaScript is written in the same way as HTML
— in a text‐editor. JS implementation is quite easy; you can link to outside files (with the file extension
.js), or write blocks of code right into your HTML documents with the <script> tag. The usual choosing
criteria apply — if you're using the same script on many pages, link to an external file; otherwise embed.
We'll do our first example with an embedded script. This will simply print a line of text to the page.
document.write("<i>Hello World!</i>");
</script>
When you place that in your code the text Hello World will appear on your screen wherever you put it. Like
so:
Hello World!
Let's break this down a bit. The script tag encloses any script code you want to use. The typeattribute we
have in their alert the browser to the type of script it is about to deal with (there are others, like VBScript),
and so helps it to interpret the code.
External Scripts
To import scripts from external JS files, save the code in a text file with the .js extension; without the

script tags and comments. In this case the code would just be the document.write("Hello World!");
part (although this won't do much on its own). We then link to this document, in the page's <head>, with
<script type="text/javascript"src="simplemethods.js"></script>
We should always place includes in the head so that the browser is ready to execute scripts when the user
calls for them. If a user clicked a button that called for a script that the browser wasn't aware of yet, you'd
get an error. Having them in the head means they're always ready before they're needed.
A Simple Script
So what did our code above actually accomplish? Take another look at it.
<!-‐
document.write("<i>Hello World!</i>");
//-->
</script>

We start by taking control of the document object, and use its write() method to output some text to the

document. The text inside the double quotes is called a String, and this string will be added to the page.
Simple, right? To use an object's methods or properties, we write the object's name, a dot, and then the
method/property name. Each line of script ends with a semicolon (;). JavaScript isn't very forgiving; if you
make any mistakes in typing this out, you'll get a script error, so code carefully.

Internet and Web Technologies

Caricato da

Informazioni sul documento

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

Internet and Web Technologies

Caricato da

Copyright:

Formati disponibili

I

IP is the primary protocol in the Internet Layer of the Internet Protocol Suite and has the task of delivering

1. <!‐‐...‐‐> 31. <em> 61. <p>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01

<head> <title>My First HTML

text goes here. </body>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01

<img src ="/images/logo.jpg"width="225" height="151" border="0"

alt="Logo of Innovate7 Technologies"usemap ="#Innovate7" />

<map id ="Innovate7" name="Innovate7">

<area shape ="rect" coords ="90,80,120,151"

<b>The Text is Bold</b>

The HTML form tag is used for declaring a form. The <form> tag is used in conjunction with form‐associated

The HTML h1tag is used for specifying level 1 headings. There are 6 levels of headings (h1‐h6) with h1 the

Example<img src="images/background.jpg" width="225" height="151"

GET /cgi-bin/index.pl HTTP/1.0Accept: www/sourceAccept: text/htmlAccept:

To import scripts from external JS files, save the code in a text file with the .js extension; without the

We start by taking control of the document object, and use its write() method to output some text to the

Potrebbero piacerti anche