Fundamentals

of Web
Engineered for
Tomorrow
Date
18-11-13

8/10/2019
Origins
 In the 1960s, the U.S. Department of Defense (DoD) developed a
new largescale computer network for communications, program
sharing, and remote computer access for researchers working on
defense-related contracts.

 One fundamental requirement was that the network be sufficiently

robust so that even if some network nodes were lost to destruction,
war, or some more other cause, the network would continue to
function.

 The DoD’s Advanced Research Projects Agency (ARPA) funded the

construction of the first such network, which connected about a
dozen ARPA-funded research laboratories and universities.

 Because it was funded by ARPA, the network was named ARPAnet.

8/10/2019
Drawbacks:

 ARPAnet provided simple text-based

communications through e-mail.

 Because ARPAnet was available only to

laboratories and universities that conducted
ARPA-funded research, the great majority of
educational institutions were not connected.

As a result, a number of other networks were

developed during the late 1970s and early
1980s.

8/10/2019
BITNET and CSNET

 BITNET, which is an acronym for Because It’s Ti me Network, began at

the City University of New York. It was built initially to provide
electronic mail and file transfers.

 CSNET, which is an acronym for Computer Science Network,

connected many major universities. Its purpose was to provide
electronic mail.

 For a variety of reasons, neither BITNET nor CSNET became a widely

used national network.

8/10/2019
 A new national network, NSFnet, was created in 1986, sponsored, by
the National Science Foundation (NSF).

 NSFnet initially connected the NSF-funded supercomputer centers at

five universities.

 Soon after being established, it became available to other

academic institutions and research laboratories.

 By 1992 NSFnet connected more than 1 million computers around the

world and became known as the Internet,

8/10/2019
 What Is the Internet?
 The Internet is a huge collection of computers connected in a
communications network.

 These computers are of every imaginable size, configuration, and

manufacturer.

 The innovation that allows all of these diverse devices to

communicate with each other is a single, low-level protocol: the
Transmission Control Protocol/Internet Protocol (TCP/IP). TCP/IP
became the standard for computer network connections in 1982.

 It can be used directly to allow a program on one computer to

communicate with a program on another computer via the Internet.
In most cases, however, a higher level protocol runs on top of TCP/IP.

 All devices connected to the Internet must be uniquely identifiable.

8/10/2019
 Internet Protocol Addresses

 The Internet Protocol (IP) address of a machine

connected to the Internet is a unique 32-bit number.

 IP addresses usually are written as four 8-bit numbers,

separated by periods.

 The four parts are separately used by Internet-routing

computers to decide where a message must go next
to get to its destination.

8/10/2019
 An IP address consists of 32 bits, often shown as 4 octets of numbers
from 0-255 represented in decimal form instead of binary form.

 For example, the IP address: 168.212.226.204 in binary form is

10101000.11010100.11100010.11001100.

 An IP address consists of two parts, one identifying the network and

one identifying the node, or host.

 The Class of the address determines which part belongs to the

network address and which part belongs to the node address.

8/10/2019
 Class A Network
 In a Class A Network binary address start with 0, therefore the
decimal number can be anywhere from 1 to 126.

 The first 8 bits (the first octet) identify the network and the remaining
24 bits indicate the host within the network.

 An example of a Class A IP address is 102.168.212.226, where "102"

identifies the network and "168.212.226" identifies the host on that
network.

8/10/2019
 Class B Network
 In a Class B Network, binary addresses start with 10, therefore the
decimal number can be anywhere from 128 to 191.

 The first 16 bits (the first two octets) identify the network and the
remaining 16 bits indicate the host within the network.

 An example of a Class B IP address is 168.212.226.204 where "168.212"

identifies the network and "226.204" identifies the host on that
network.

8/10/2019
 Class C Network

 Binary addresses start with 110, therefore the decimal number can be
anywhere from 192 to 223.

 The first 24 bits (the first three octets) identify the network and the
remaining 8 bits indicate the host within the network.

 An example of a Class C IP address is 200.168.212.226 where

"200.168.212" identifies the network and "226" identifies the host on
that network.

8/10/2019
Class D Network
In a Class D Network, binary addresses start
with 1110, therefore the decimal number
can be anywhere from 224 to 239.
Class D networks are used to
support multicasting.

Class E Network
In a Class E Network, binary addresses start
with 1111, therefore the decimal number
8/10/2019
 Domain Names

 Because people have difficulty dealing with and remembering

numbers, machines on the Internet also have textual names.

 Domain names are used to identify one or more IP addresses.

 For example, the domain name microsoft.com represents about

a dozen IP addresses.

 Domain names are used in URLs to identify particular Web pages.

For example, in the
URLhttp://www.pcwebopedia.com/index.html,
 the domain name is pcwebopedia.com.

8/10/2019
 Every domain name has a suffix that indicates which top level
domain (TLD) it belongs to. There are only a limited number of such
domains. For example:

 gov - Government agencies

 edu - Educational institutions
 org - Organizations (nonprofit)
 mil - Military
 com - commercial business
 net - Network organizations
 ca - Canada
 th - Thailand

8/10/2019
 Hostnames are human-readable nicknames that correspond to the
address of a device connected to a network.

 On the Internet, a hostname is a domain name assigned to a host

computer. This is usually a combination of the host's local name with
its parent domain's name.

 For example, en.wikipedia.org consists of a local hostname (en) and

the domain name wikipedia.org.

 The hostname and all of the domain names are together called a
fully qualified domain name.

 This kind of hostname is translated into an IP address via the

localhosts file, or the Domain Name System (DNS) resolver.

8/10/2019
 Because IP addresses are the addresses used internally by the
Internet, the fully qualified domain name of the destination for a
message,, must be converted to an IP address before the message
can be transmitted over the Internet to the destination.

 These conversions are done by software systems called name

servers, which implement the Domain Name System (DNS).
The Domain Name System (DNS) is a standard technology for
managing the names of Web sites and other Internet domains.

 DNS technology allows you to type names into the Web browser
like compnetworking.about.com and the computer to automatically
find that address on the Internet.

 Name servers serve a collection of machines on the Internet and are

operated by organizations that are responsible for the part of the
Internet to which those machines are connected.

8/10/2019
  All document requests from browsers are routed to the
nearest name server. If the name server can convert
the fully qualified domain name to an IP address, it
does so.
 If it cannot, the name server sends the fully qualified
domain name to another name server for conversion.
 Like IP addresses, fully qualified domain names must
be unique.
 Figure 1.1 shows how fully qualified domain names
requested by a browser are translated into IPs before
they are routed to the appropriate Web server.

8/10/2019
 Domain Name Conversion

8/10/2019
 By the mid-1980s, a collection of different protocols that run on top of
TCP/IP had been developed to support a variety of Internet uses. Among
these protocols, the most common were :

 telnet: which was developed to allow a user on one computer on the

Internet to log onto and use another computer on the Internet;

 File Transfer Protocol (ftp) : which was developed to transfer files

 among computers on the Internet;

 Usenet : which was developed to serve as an electronic bulletin

Board. Users read and post messages (called articles or posts, and
collectively termed news) to one or more categories, known
as newsgroups.

 mailto : which was developed to allow messages to be sent from the user
of one computer on the Internet to other users of other computers on the
Internet.

8/10/2019
 The World Wide Web

 Origins
 In 1989, a small group of people led by Tim Berners-Lee
at CERN (Conseil Européen pour la Recherche
Nucléaire, or European Organization for Particle
Physics) proposed a new protocol for the Internet, as
well as a system of document access to use it.

 The intent of this new system, which the group named

the World Wide Web, was to allow scientists around
the world to use the Internet to exchange documents
describing their work.

8/10/2019
 The proposed new system was designed to allow a user anywhere on
the Internet to search for and retrieve documents from databases on
any number of different document-serving computers connected to
the Internet.

 In 1991, the system was ported to other computer platforms and

released to the rest of the world.

 For the form of its documents, the system used hypertext, which is text
with embedded links to text in other documents to allow
nonsequential browsing of textual material.

8/10/2019
 Web or internet

8/10/2019
 Web Browsers
 A web browser (commonly referred to as a browser) is a software
application for retrieving, presenting and traversing information
resources on the World Wide Web.
 When two computers communicate over some network, in many
cases one acts as a client and the other as a server.
 The client initiates the communication, which is often a request for
information stored on the server, which then sends that information
back to the client.
 The Web, as well as many other systems, operates in this client-server
configuration.

8/10/2019
 Web browser function

8/10/2019
 Documents provided by servers on the Web are requested by
browsers, which are programs running on client machines.

 They are called browsers because they allow the user to browse the
resources available on servers.

 The first browsers were text based—they were not capable of

displaying graphic information, nor did they have a graphical user
interface.(World Wide Web later renamed Nexus.).

 The first browser with a graphical user interface is Mosaic (1993).

8/10/2019
 In the simplest case, a browser requests a static document from a
server. The server locates the document among its servable
documents and sends it to the browser, which displays it for the user.

 The server may also provide a document that requests input from the
user through the browser. After the user supplies the requested input,
it is transmitted from the browser to the server, which may use the
input to perform some computation and then return a new
document to the browser to inform the user of the results of the
computation.

 Sometimes a browser directly requests the execution of a program

stored on the server. The output of the program is then returned to
the browser.

8/10/2019
 Commonly used browsers
 Microsoft Internet Explorer (IE),
 Firefox,
 Google chrome
 Netscape Navigator,
 Opera
 Apple’s Safari……..many more.

8/10/2019
 Web Servers

 Web servers are programs that provide documents to

requesting browsers.

 They act only when requests are made to them by

browsers running on other computers on the Internet.

 The most commonly used Web servers are Apache,

which has been implemented for a variety of
computer platforms, and Microsoft’s Internet
Information Server (IIS), which runs under Windows
operating systems.

8/10/2019
 Web Server Operation

 Web browsers initiate network communications with

servers by sending them URLs .

 A URL can specify one of two different things:

 the address of a data file stored on the server that is to

be sent to the client,

 a program stored on the server that the client wants

executed, with the output of the program returned to
the client.

8/10/2019
 All the communications between a web client and a web server use
the HTTP
 When a web server begins execution, it informs the OS under which it
is running & it runs as a background process
 A web client or browser, opens a network connection to a web
server, sends information requests and possibly data to the server,
receives information from the server and closes the connection.
 The primary task of web server is to monitor a communication port on
host machine, accept HTTP commands through that port and
perform the operations specified by the commands.
 When the URL is received, it is translated into either a filename or a
program name.

8/10/2019
General characteristics of web server:
 The file structure of a web server has two separate directories
 document root :stores web documents
 server root : stores server and its support softwares.

 The files stored directly in the document root are those available to
clients through top level URLs

 The secondary areas from which documents can be served are

called virtual document trees.

 Some servers can serve documents that are in the document root of
other machines on the web; in this case they are called as proxy
servers

8/10/2019
 Apache
 Apache is the most widely used Web server.
 The primary reasons are as follows:
 It is is both fast and reliable.
 It is open-source software, which means that it is free.
 Apache is capable of providing a long list of services beyond the
basic process of serving documents to clients.

8/10/2019
 IIS

 Microsoft IIS server is supplied as part of Windows—and

because it is a reasonably good server—most
Windows-based Web servers use IIS.
 With IIS, server behaviour is modified by changes
made through a window-based management
program, named the IIS snap-in, which controls both
IIS and ftp.

 Under Windows XP and Vista, the IIS snap-in is

accessed by going to Control Panel, Administrative
Tools, and IIS Admin.

8/10/2019
 Uniform Resource Locators
(URLs)

 Uniform Resource Locators (URLs) are used to identify different

kinds of resources on Internet.
 If the web browser wants some document from web server, just
giving domain name is not sufficient because domain name can
only be used for locating the server.
 It does not have information about which document client
needs. Therefore, URL should be provided.
 The general format of URL is: scheme: object-address
 Example: http: www.vtu.ac.in/results.php
 The scheme indicates protocols being used. (http, ftp, telnet...)
 In case of http, the full form of the object address of a URL is as
follows:
 //fully-qualified-domain-name/path-to-document

8/10/2019
  URLs can never have embedded spaces
 It cannot use special characters like semicolons, ampersands
and colons
 The path to the document for http protocol is a sequence of
directory names and a filename, all separated by whatever
special character the OS uses. (forward or backward slashes)
 The path in a URL can differ from a path to a file because a URL
need not include all directories on the path
 A path that includes all directories along the way is called a
complete path.
 Example: http://www.webopedia.com/index.html
 In most cases, the path to the document is relative to some
base path that is specified in the configuration files of the server.
Such paths are called partial paths.
 Example: http://www.webopedia.com/

8/10/2019
 MULTIPURPOSE INTERNET
MAIL EXTENSIONS

 MIME stands for Multipurpose Internet Mail Extension.

 The server system apart from sending the requested
document, it will also send MIME information.
 The MIME information is used by web browser for
rendering the document properly.
 The format of MIME is: type/subtype
 Example: text/html , text/doc , image/jpeg ,
video/mpeg
 When the type is either text or image, the browser
renders the document without any problem

8/10/2019
  if the type is video or audio, it cannot render the
document
 It has to take the help of other software like media player,
win amp etc.,
 These softwares are called as helper applications or
plugins
 These non-textual information are known as HYPER MEDIA
 This helper application will be used for rendering the
document by browser.
 The list of MIME specifications is stored in configuration
file of web server.

8/10/2019
 Hypertext Transfer Protocol
 All Web communications transactions use the same protocol: the
Hypertext Transfer Protocol (HTTP).
 Hypertext is structured text that uses logical links (hyperlinks)
between nodes containing text. HTTP is the protocol to exchange or
transfer hypertext.
 HTTP consists of two phases: the request and the response.
 Each HTTP communication (request or response) between a browser
and a Web server consists of two parts: a header and a body.
 The header contains information about the communication; the
body contains the data of the communication if there is any.

8/10/2019
8/10/2019
 The protocol is typically http, but it can also be https for secure
communications. The default port is 80, but one can be set
explicitly, as illustrated in the above image. The resource path is
the local path to the resource on the server.

8/10/2019
 The Request Phase

The general form of an HTTP request is as follows:

 1. HTTP method Domain part of the URL HTTP version
 2. Header fields
 3. Blank line
 4. Message body

The following is an example of the first line of an HTTP

request:
 GET /storefront.html HTTP/1.1

8/10/2019
8/10/2019
8/10/2019
 Few request methods defined by HTTP are:

8/10/2019
 Two commonly used methods for a request-response between a
client and server are: GET and POST.

 GET - Requests data from a specified resource

 Note that query strings (name/value pairs) is sent in the URL of a GET
request:
 /test/demo_form.html?name1=value1&name2=value2

 POST - Submits data to be processed to a specified resource.

 Note that query strings (name/value pairs) is sent in the HTTP message
body of a POST request:
 POST /test/demo_form.asp HTTP/1.1
Host: google.com
name1=value1&name2=value2

8/10/2019
 The format of a header field is the field name followed by a colon
and the value of the field. There are four categories of header fields:

1. General: For general information, such as the date

2. Request: Included in request headers
3. Response: For response headers
4. Entity: Used in both request and response headers
All the above mentioned headers follow the same generic format and
each of the header field consists of a name
followed by a colon (:) and the field value as follows:
message-header = field-name ":" [ field-value ]

8/10/2019
  A wildcard character, the asterisk (*), can be used to
specify that part of a MIME type can be anything.

8/10/2019
 The Host: host name request field gives the name of the host. The
Host field is required for HTTP 1.1.

 The If-Modified-Since: date request field specifies that the requested

file should be sent only if it has been modified since the given date.

 If the request has a body, the length of that body must be given with
a Content-length field.

 The header of a request must be followed by a blank line, which is

used to separate the header from the body of the request.

8/10/2019
 The Response Phase:
 The general form of an HTTP response is as follows:
1. Status line
2. Response header fields
3. Blank line
4. Response body

The status line includes the HTTP version used, a three-digit status code
for the response, and a short textual explanation of the status code.
For example, most responses begin with the following:
HTTP/1.1 200 OK

8/10/2019
 The status codes begin with 1, 2, 3, 4, or 5. The general meanings of
the five categories specified by these first digits are shown in Table.

One of the more common status codes is : 404 Not Found, which
means the requested file could not be found.

8/10/2019
 HTTP Request

URL http://www.test101.com/doc/index.html

GET /docs/index.html HTTP/1.1

Host: www.test101.com
Accept: image/gif, image/jpeg, */*
Accept-Language: en-us
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1)
(blank line)

8/10/2019
 HTTP Response

HTTP/1.1 200 OK
Date: Sun, 18 Oct 2009 08:56:53 GMT
Server: Apache/2.2.14 (Win32)
Last-Modified: Sat, 20 Nov 2004 07:16:26 GMT
Content-Length: 44
Connection: close
Content-Type: text/html

<html><body><h1>It works!</h1></body></html>

8/10/2019
 XHTML

 XHTML is almost identical to HTML 4.01 with only few

differences. This is a cleaner and more strict version of
HTML 4.01.

 XHTML stands for

EXtensible HyperText Markup Language

 XHTML was developed by the W3C to help web

developers make the transition from HTML to XML.

8/10/2019
 Why XHTML ?

 XHTML has a more strict syntax rules in comparison of

HTML.

 XHTML gives us a more consistent, well structured

format so that our WebPages can be easily parsed
and processed by present and future web browsers.

 It also makes your website more easy to maintain,

edit, convert and format in the long run.

8/10/2019
 The following HTML code will work fine if you view it in a browser
(even if it does NOT follow the HTML rules):
 <html>
<head>
<title>This is bad HTML</title>
<body>
<h1> HTML
<p>This is a paragraph
</body>

 XML is a markup language where documents must be marked up

correctly and must be "well-formed".
 Some browsers run on computers, and some browsers run on mobile
phones or other small devices. Smaller devices often lack the
resources or power to interpret a "bad" markup language.
 Therefore - by combining the strengths of HTML and XML, XHTML was
developed. XHTML is HTML redesigned as XML.

8/10/2019
 The Most Important Differences
from HTML:
Document Structure
 XHTML DOCTYPE is mandatory
 The xmlns attribute in <html> is mandatory
 <html>, <head>, <title>, and <body> are mandatory

XHTML Elements
 XHTML elements must be properly nested
 XHTML elements must always be closed
 XHTML elements must be in lowercase
 XHTML documents must have one root element

8/10/2019
 XHTML Attributes
 Attribute names must be in lower case
 Attribute values must be quoted
 Attribute minimization is forbidden

8/10/2019
 BASIC SYNTAX
 The fundamental syntactic units of HTML are called tags.
 In general, tags are used to specify categories of content.
 The syntax of a tag is the tag’s name surrounded by angle brackets (<
and >).
 Tag names must be written in all lowercase letters.
 Most tags appear in pairs: an opening tag and a closing tag.
 The name of a closing tag is the name of its corresponding opening tag
with a slash attached to the beginning. For example, if the tag’s name is
p, the corresponding closing tag is named /p.
 Whatever appears between a tag and its closing tag is the content of the
tag. Not all tags can have content.
 The opening tag and its closing tag together specify a container for the
content they enclose.
 The container and its content together are called an element.

8/10/2019
 Example: <p> Web Programming </p>
 The paragraph tag, <p>, marks the beginning of the content; the
</p> tag marks the end of the content of the paragraph element.
 Attributes, which are used to specify alternative meanings of a tag,
can appear between an opening tag’s name and its right angle
bracket.
 They are specified in keyword form, which means that the attribute’s
name is followed by an equal’s sign and the attribute’s value.
<img src = “flower.jpg” />
 Attribute names, like tag names, are written in lowercase letters.
 Attribute values must be delimited by double quotes.

8/10/2019
  Comments in programs increase the readability of those
programs. Comments in XHTML have the same purpose.
They can appear in XHTML in the following form:
 <!-- anything except two adjacent dashes -->
 Browsers ignore XHTML comments—they are for people
only. Comments can be spread over as many lines as are
needed. For example, you could have the following
comment:

 <!– comments.html. Comments in programs increase the

readability of those programs. -->

8/10/2019
 Standard XHTML Document

Structure
XHTML document begins with an xml declaration element that simply
identifies the document as being one based on XML. This element
includes an attribute that specifies the version number 1.0.
 The xml declaration usually includes a second attribute, encoding,
which specifies the encoding used for the document [utf-8].

 Following is the xml declaration element, which should be the first line
of every XHTML document:
 <?xml version = "1.0" encoding = "utf-8"?>

 All XHTML documents must have a DOCTYPE declaration at the top

of document. There are three types of DOCTYPE:
 XHTML 1.0 document type definitions are corresponds to three DTDs:
Strict, Transitional, and Frameset.
8/10/2019
XHTML 1.0 Strict:
 If we are planning to use strictly Cascading Style Sheet and avoiding to write most
of the XHTML attributes, then it is recommended to use this DTD. A document
conforming to this DTD will be of the best quality.
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML 1.0 Transitional:

 To use many XHTML attributes as well as few Cascading Style Sheet properties, we
can adopt this DTD and we should write our XHTML document according to DTD.
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

XHTML 1.0 Frameset:

 when we want to use HTML Frames to partition the browser window into two or
more frames.
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

8/10/2019
 An XHTML document must include the four tags <html>, <head>,
<title>, and <body>.

 The <html> tag identifies the root element of the document. So,
XHTML documents always have an <html> tag immediately following
the DOCTYPE command, and they always end with the closing html
tag, </html>.

 The root element of the document must contain

an xmlns declaration for the XHTML namespace [XMLNS] as shown in
the following element:

 <html xmlns = "http://www.w3.org/1999/xhtml">

8/10/2019
 An XHTML document consists of two parts, named the head and the
body.
 The <head> element contains the head part of the document,
which provides information about the document and does not
provide the content of the document.
 The body of a document provides the content of the document.
 The content of the title element is displayed by the browser at the
top of its display window, usually in the browser window’s title bar.

8/10/2019
<?xml version = "1.0" encoding = "utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml1-strict.dtd">
<!-- complete.html A document which must be followed
throughout the notes -->
<html xmlns = "http://www.w3.org/1999/xhtml">
<head> <title> My first program </title> </head>
<body>
<p> Programming the WEB..!! </p>
</body>
</html>

8/10/2019
8/10/2019
 It beginsParagraphs:
with <p> and ends with </p>. Multiple
paragraphs may appear in a single document.
Trials_1.html
<?xml version = "1.0" encoding = "utf-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml11/DTD/xhtml1-strict.dtd">

<!-- greet.html A first documents -->

<html xmlns = "http://www.w3.org/1999/xhtml">

<head>

<title> First program </title>

</head>

<body>

<p> Web programming refers to the writing, markup and coding involved in
Web development </p>
<p> It includes Web content, Web client and server scripting and network
security. </p>
</p>

</body>

8/10/2019
</html>
 OUTPUT

8/10/2019
 Line Breaks

 Sometimes text requires a line break without the

preceding blank line. This is exactly what the break
tag does.

 The break tag differs syntactically from the paragraph

tag in that it can have no content and therefore has
no closing tag (because a closing tag would serve no
purpose).

 The break tag is specified as <br />. The slash indicates

that the tag is both an opening and closing tag. The
space before the slash represents the absent content.

8/10/2019
 <?xml version = "1.0" encoding = "utf-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml11/DTD/xhtml1-strict.dtd">

<!-- greet.html A first documents -->

<html xmlns = "http://www.w3.org/1999/xhtml">

<head>

<title> First program </title>

</head>

<body>

<p> Web programming refers to the writing, markup and coding involved in Web
development. <br />

It includes Web content, Web client and server scripting and network security. </p>

</p>

</body>

</html>

8/10/2019
 OUTPUT

8/10/2019
 Preserving White Space
 Sometimes it is desirable to preserve the white space in text—
that is, to prevent the browser from eliminating multiple spaces
and ignoring embedded line breaks Pre.html
<?xml version = "1.0" encoding = "utf-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml11/DTD/xhtml1-strict.dtd">

<!-- headings.html. An illustration for headings -->

<html>

<body>

<p> <pre>
Web programming refers to the
writing,
markup
and coding
involved in Web development.
</pre>
</p>
</body>

</html>

8/10/2019
 Output

8/10/2019
Headings

 Text is often separated into sections in documents by beginning each

section with a heading. Larger sections sometimes have headings
that appear more prominent than headings for sections nested inside
them.
 In XHTML, there are six levels of headings, specified by the tags <h1>,
<h2>, <h3>,<h4>, <h5>, and <h6>, where <h1> specifies the highest-
level heading.
 Headings are usually displayed in a boldface font whose default size
depends on the number in the heading tag.
 On most browsers, <h1>, <h2>, and <h3> use font sizes that are larger
than that of the default size of text, <h4> uses the default size, and
<h5> and <h6> use smaller sizes.
 The heading tags always break the current line, so their content
always appears on a new line. Browsers usually insert some vertical
space before and after all headings. Trial_2.html
8/10/2019
 <?xml version = "1.0" encoding = "utf-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml11/DTD/xhtml1-strict.dtd">

<!-- headings.html. An illustration for headings -->

<html>

<body>

<h1>This is heading 1</h1>

<h2>This is heading 2</h2>

<h3>This is heading 3</h3>

<h4>This is heading 4</h4>

<h5>This is heading 5</h5>

<h6>This is heading 6</h6>

</body>

</html>

8/10/2019
 output

8/10/2019
Font Styles and Sizes
 A collection of tags are available to set font styles and sizes. For
example, <i> specified italics and <b> specified bold. Since the
advent of cascading style sheets the use of these tags has become
less.
 Other tags used are the emphasis tag, the strong tag,
 The emphasis tag, <em>, specifies that its textual content is special
and should be displayed in some way that indicates this
distinctiveness. Most browsers use italics for such content.
 The strong tag, <strong> : Browsers often set the content of strong
elements in bold.
 Practice1.html

8/10/2019
  Subscript and superscript characters can be specified
by the <sub> and <sup> tags, respectively.These are
not content-based tags.
 For example, x₂³ +
y₁²

8/10/2019
8/10/2019
 XHTML tags are categorized as being either block or inline.

 The content of an inline tag appears on the current line. So, an inline
tag does not implicitly include a line break. One exception is br,
which is an inline tag, but its entire purpose is to insert a line break in
the content.

 A block tag breaks the current line so that its content appears on a
new line.

 The heading and block quote tags are block tags, whereas <em>
and <strong> are inline tags.

 In XHTML, block tags cannot appear in the content of inline tags.

Therefore, a block tag can never be nested directly in an inline tag.

8/10/2019
 Character Entities
 XHTML provides a collection of special characters that are sometimes
needed in a document but cannot be typed as themselves.
 The collection include the special characters like >,< and &, and also
the characters that do not appear on keyboards, such as small
raised circles that represents degrees in reference to temperature
etc.
 These special characters are defined as entities, which are codes for
the characters. An entity in a document is replaced by its associated
character by the browser.
 Table 1 lists some of the most commonly used entities.
 Char_entity.html

8/10/2019
8/10/2019
 Horizontal Rules
 The parts of a document can be separated from each other, making
the document easier to read, by placing horizontal lines between
them. Such lines are called horizontal rules, and the block tag that
creates them is <hr />.
 The <hr /> tag causes a line break (ending the current line) and
places a line across the screen. The browser chooses the thickness,
length, and horizontal placement of the line.
 Typically, browsers display lines that are three pixels thick. Note again
the slash in the
 <hr /> tag, indicating that this tag has no content and no closing tag.
 Hr.html

8/10/2019
  <?xml version = "1.0" encoding = "utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
http://www.w3.org/TR/xhtml11/DTD/xhtml1-strict.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<body>
<h1>HTML</h1>
<p>HTML is a language for describing web pages.</p>
<hr/>
<h1>CSS</h1>
<p>CSS defines how to display HTML elements.</p>
</body>
</html>

8/10/2019
8/10/2019
 Images
 The inclusion of images in a document can dramatically enhance its
appearance.
 The image is stored in a file, which is specified by an XHTML request.
The image is inserted into the display of the document by the
browser.
 Image Formats
 The two most common methods of representing images are the
Graphic Interchange Format (GIF) and the Joint Photographic
Experts Group (JPEG) format.
 Files in both formats are compressed to reduce storage needs and
provide faster transfer over the Internet.

8/10/2019
 GIF v/s JPEG
JPEG
GIF

Less colour information. (256 colours) More Colour information compared to

GIF (16 million colours)

Image compression is less compared to Uses better compression algorithm than

JPEG GIF for shrinking images

Colour accuracy is more Colour accuracy is less

GIF images are bigger than JPEG images JPEG images are comparatively small

Supports Transparency Does not support Transparency

8/10/2019
 A third image format is Portable Network Graphics (PNG,
pronounced ping).

 PNG was designed in 1996. PNG is a good replacement for both GIF
and JPEG because it has the best characteristics of each (the
possibility of transparency, as provided by GIF, and the same large
number of colors as JPEG).

 One drawback of PNG is that, because its compression algorithm

does not sacrifice picture clarity, its images require more space than
comparable JPEG images.

 Supported by less browsers.

8/10/2019
 Images

 The <img /> Tag

 The image tag, <img />, which is an inline tag,
specifies an image that is to appear in a document.

 The image tag includes two attributes:

 Src  Specifies the file containing the image
 Alt  Specifies text to be displayed when it is not
possible to display the image.

8/10/2019
 If the browser is not capable of displaying images, or if the Internet
connection is slow and the user chooses not to wait for images to
download, in any case, it is helpful to have some text displayed in
place of the ignored image.

 For these reasons, the alt attribute is required by XHTML.

 The value of alt is displayed whenever the browser cannot or has

been instructed not to display the image.

 Two optional attributes of img—width and height—can be included

to specify (in pixels) the size of the rectangle for the image. These
attributes can be used to scale the size of the image.
 Image.html

8/10/2019
 <?xml version = "1.0" encoding = "utf-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml11/DTD/xhtml1-strict.dtd">

<html xmlns = "http://www.w3.org/1999/xhtml">

<head>

<title> First program </title>

</head>

<body>

<h1> HTML IMAGES </h1>

<h2>Images are not technically inserted into an HTML page.</h2

<h3> images are linked to HTML pages.</h3>

<h4> The <img> tag creates a holding space for the referenced
image.</h4>

<img src="download.jpg" alt="Smiley face" width="250"

height="250">

</body>

</html>
8/10/2019
8/10/2019
 Hypertext Links

 A hypertext link in an XHTML document, which we

simply call a link here, acts as a pointer to some
particular place in some Web resource.

 That resource can be an XHTML document anywhere

on the Web, or it may be the document currently
being displayed. Without links, there would be no
convenient way for the browser user to get from one
document to a logically related document.

8/10/2019
 Links

 A link that points to a different resource specifies the

address of that resource. Such an address might be a file
name, a directory path and a file name, or a complete
URL.

 Links are specified in an attribute of an anchor tag (<a>),

which is an inline tag. The anchor tag that specifies a link
is called the source of that link. The document whose
address is specified in a link is called the target of that link.

 The anchor tag can include many different attributes. For

creating links, only one attribute is required: href (an
acronym for hypertext reference). The value assigned to
href specifies the target of the link

8/10/2019
  If the target is in another document in the same directory, the target is just
the document’s file name.

 If the target document is in some other directory, the UNIX pathname

conventions are used. Absolute file addresses could be used in which the
entire path name for the file is given.

 If the document is on some other machine (not the server providing the
document that includes the link), obviously the complete URL must be used.

 The content of an anchor tag, which becomes the clickable link the user
sees, is restricted to text, images, and headings.

 Links are usually implicitly rendered in a different colour than that of the
surrounding text. Sometimes they are also underlined.

8/10/2019
  When the mouse cursor is placed over the anchor-tag
content and the left mouse button is pressed, the link is
taken by the browser.

 If the target is in a different document, that

document is loaded and displayed, replacing the
currently displayed document.

 If the target is in the current document, the document

is scrolled by the browser to display the part of the
document in which the target of the link is defined.

8/10/2019
 <?xml version = "1.0" encoding = "utf-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml11/DTD/xhtml1-strict.dtd">

<!-- SourceLink.html -->

<html xmlns = "http://www.w3.org/1999/xhtml">

<head>

<title> First program </title>

</head>

<body>

<h1> WEB PROGRAMMING </h1>

<h2> Web programming refers to the writing, markup and coding involved in Web
development.</h2>

<h3>It includes Web content, Web client and server scripting and network security.
</h3>

<a href = "webinfo.html"> Information On Web Programming </a>

</body>

</html>

8/10/2019
8/10/2019
 15.2 Targets within Documents
 If the target of a link is not at the beginning of a document, it must be
some element within the document, in which case there must be some
means of specifying it.

 The target element can include an id attribute, which can then be used
to identify it in an href attribute.
 Consider the following example:
 <h2 id = “avionics”> Avionics </h2>
 Nearly all elements can include an id attribute.

 The value of an id attribute must be unique within the document. If the

target is in the same document as the link, the target is specified in the
href attribute value by preceding the id value with a pound sign (#), as in
the following example:
 <a href = “#avionics”> What about avionics? </a>

8/10/2019
  When the What about avionics? link is taken, the
browser moves the display so that the h2 element
whose id is avionics is at the top.

 When the target is a part or fragment of another

document, the name of the part is specified at the
end of the URL, separated by a pound sign (#), as in
this example:
 <a href = “sample.html#avionics”> Avionics </a>

8/10/2019
 2.7 Lists
• Unordered lists
• The list is the content of the <ul> tag
• List elements are the content of the <li> tag
<h3> Some Common Single-Engine Aircraft </h3>
<ul>
<li> Cessna Skyhawk </li>
<li> Beechcraft Bonanza </li>
<li> Piper Cherokee </li>
</ul>

• Ordered lists
• The list is the content of the <ol> tag
• Each item in the display is preceded by a sequence value

8/10/2019
 2.7 Lists (continued)

<h3> Cessna 210 Engine Starting Instructions

</h3>
<ol>
<li> Set mixture to rich </li>
<li> Set propeller to high RPM </li>
<li> Set ignition switch to "BOTH" </li>
<li> Set auxiliary fuel pump switch to
"LOW PRIME" </li>
<li> When fuel pressure reaches 2 to 2.5
PSI, push starter button </li>
</ol>

• Nested lists
• Any type list can be nested inside any type list
• The nested list must be in a list item

8/10/2019
 2.7 Lists (continued)

 Definition lists (for glossaries, etc.)

 List is the content of the <dl> tag
 Terms being defined are the content of the <dt> tag
 The definitions themselves are the content of the <dd> tag
<h3> Single-Engine Cessna Airplanes </h3>
<dl >
<dt> 152 </dt>
<dd> Two-place trainer </dd>
<dt> 172 </dt>
<dd> Smaller four-place airplane </dd>
<dt> 182 </dt>
<dd> Larger four-place airplane </dd>
<dt> 210 </dt>
<dd> Six-place airplane - high performance
</dd>
</dl>

8/10/2019
 2.8 Tables

• A table is a matrix of cells, each possibly having content

• The cells can include almost any element
• Some cells have row or column labels and some have data
• A table is specified as the content of a <table> tag
• A border attribute in the <table> tag specifies a border between
the cells
• If border is set to "border", the browser’s default width border is
used
• The border attribute can be set to a number, which will be the
border width
• Without the border attribute, the table will have no lines!
• Tables are given titles with the <caption> tag, which can
immediately follow <table>

8/10/2019
 2.8 Tables (continued)

 Each row of a table is specified as the content of a <tr> tag

 The row headings are specified as the content of a <th> tag
 The contents of a data cell is specified as the content of a <td> tag
<table border = "border">
<caption> Fruit Juice Drinks </caption>
<tr>
<th> </th>
<th> Apple </th>
<th> Orange </th>
<th> Screwdriver </th>
</tr>
<tr>
<th> Breakfast </th>
<td> 0 </td>
<td> 1 </td>
<td> 0 </td>
</tr>
<tr>
<th> Lunch </th>
<td> 1 </td>
<td> 0 </td>
<td> 0 </td>
</tr>
</table>

8/10/2019
 2.8 Tables (continued)

 A table can have two levels of column labels

 If so, the colspan attribute must be set in the <th> tag to specify that the
label must span some number of columns
<tr>
<th colspan = "3"> Fruit Juice Drinks </th>
</tr>
<tr>
<th> Orange </th>
<th> Apple </th>
<th> Screwdriver </th>
</tr>

8/10/2019
 2.8 Tables (continued)

• If the rows have labels and there is a spanning column

label, the upper left corner must be made larger, using
rowspan

<table border = "border">

<tr>
<td rowspan = "2"> </td>
<th colspan = "3"> Fruit Juice Drinks
</th>
</tr>
<tr>
<th> Apple </th>
<th> Orange </th>
<th> Screwdriver </th>
</tr>
…
</table>

8/10/2019
 2.8 Tables (continued)

 The align attribute controls the horizontal placement of the

contents in a table cell
 Values are left, right, and center (default)
 align is an attribute of <tr>, <th>, and <td> elements
 The valign attribute controls the vertical placement of the
contents of a table cell
 Values are top, bottom, and center (default)
 valign is an attribute of <th> and <td> elements
 SHOW cell_align.html and display it
• The cellspacing attribute of <table> is used to specify the
distance between cells in a table
 The cellpadding attribute of <table> is used to specify the
spacing between the content of a cell and the inner walls of the
cell

8/10/2019
 2.8 Tables (continued)

<table cellspacing = "50">

<tr>
<td> Colorado is a state of …
</td>
<td> South Dakota is somewhat…
</td>
</tr>
</table>

- Table Sections
- Header,
tfoot body, and footer, which are the elements: thead, tbody, and
- If a document
thicker haslines
horizontal multiple tbody elements, they are separated by

8/10/2019
 2.9 Forms

 A form is the usual way information is gotten from a browser to

a server
 HTML has tags to create a collection of objects that implement
this information gathering
 The objects are called widgets (e.g., radio buttons and checkboxes)
 When the Submit button of a form is clicked, the form’s values
are sent to the server
 All of the widgets, or components of a form are defined in the
content of a <form> tag
 The only required attribute of <form> is action, which specifies the URL
of the application that is to be called when the Submit button is clicked
action =
"http://www.cs.ucp.edu/cgi-bin/survey.pl"
 If the form has no action, the value of action is the empty string

8/10/2019
 2.9 Forms (continued)

The method attribute of <form> specifies one of the two

possible techniques of transferring the form data to the
server, get and post
get and post are discussed in Chapter 10
Widgets
Many are created with the <input> tag
The type attribute of <input> specifies the kind of
widget being created
1. Text
 Creates a horizontal box for text input
 Default size is 20; it can be changed with the size attribute
 If more characters are entered than will fit, the box is scrolled (shifted) left

8/10/2019
 2.9 Forms (continued)

 If you don’t want to allow the user to type more characters

than will fit, set maxlength, which causes excess input to
be ignored
<input type = "text" name = "Phone"
size = "12" >
2. Checkboxes - to collect multiple choice input
 Every checkbox requires a value attribute, which is the
widget’s value in the form data when the checkbox is
‘checked’
 A checkbox that is not ‘checked’ contributes no value
to the form data
 By default, no checkbox is initially ‘checked’
 To initialize a checkbox to ‘checked’, the checked attribute
must be set to "checked"

8/10/2019
 2.9 Forms (continued)

 Widgets (continued)
Grocery Checklist
<form action = "">
<p>
<input type = "checkbox" name ="groceries"
value = "milk" checked = "checked">
Milk
<input type = "checkbox" name ="groceries"
value = "bread">
Bread
<input type = "checkbox" name = "groceries"
value= "eggs">
Eggs
</p>
</form>

3. Radio Buttons - collections of checkboxes in which only

one button can be ‘checked’ at a time
 Every button in a radio button group MUST have the same name

8/10/2019
 2.9 Forms (continued)

 Widgets (continued)
3. Radio Buttons (continued)
 If no button in a radio button group is ‘pressed’, the browser often ‘presses’
the first one
Age Category
<form action = "">
<p>
<input type = "radio" name = "age"
value = "under20" checked = "checked"> 0-19
<input type = "radio" name = "age"
value = "20-35"> 20-35
<input type = "radio" name = "age"
value = "36-50"> 36-50
<input type = "radio" name = "age"
value = "over50"> Over 50
</p>
</form>

8/10/2019
 2.9 Forms (continued)

3. Menus - created with <select> tags

 There are two kinds of menus, those that behave like checkboxes and
those that behave like radio buttons (the default)
 Menus that behave like checkboxes are specified by including the multiple attribute,
which must be set to "multiple"
 The name attribute of <select> is required
 The size attribute of <select> can be included to specify the number
of menu items to be displayed (the default is 1)
 If size is set to > 1 or if multiple is specified, the menu is displayed as a pop-up
menu

8/10/2019
 2.9 Forms (continued)

 Widgets (continued)
3. Menus (continued)
 Each item of a menu is specified with an <option> tag, whose
pure text content (no tags) is the value of the item
 An <option> tag can include the selected attribute, which when
assigned "selected” specifies that the item is preselected
Grocery Menu - milk, bread, eggs, cheese
<form action = "">
<p>
With size = 1 (the default)
<select name = "groceries">
<option> milk </option>
<option> bread </option>
<option> eggs </option>
<option> cheese </option>
</select>
</p>
</form>

8/10/2019
 2.9 Forms (continued)

- Widgets (continued)

 After clicking the menu:

 After changing size to 2:

8/10/2019
 2.9 Forms (continued)

- Widgets (continued)
5. Text areas - created with <textarea>
 Usually include the rows and cols attributes to specify the size of
the text area
 Default text can be included as the content of <textarea>
 Scrolling is implicit if the area is overfilled
Please provide your employment aspirations
<form action = "">
<p>
<textarea name = "aspirations" rows = "3”
cols = "40">
(Be brief and concise)
</textarea>
</p>
</form>

8/10/2019
 2.9 Forms (continued)

 Widgets (continued)
6. Reset and Submit buttons
 Both are created with <input>
<input type = "reset" value = "Reset Form">
<input type = "submit” value = "Submit Form">
 Submit has two actions:
1. Encode the data of the form
2. Request that the server execute the server-resident program
specified as the value of the action attribute of <form>
 A Submit button is required in every form
--> SHOW popcorn.html and display it

8/10/2019
 2.10 Frames

• Frames are rectangular sections of the display window,

each of which can display a different document
• Because frames are no longer part of XHTML, you
cannot validate a document that includes frames
• The <frameset> tag specifies the number of frames and
their layout in the window
• <frameset> takes the place of <body>
• Cannot have both!
• <frameset> must have either a rows attribute or a cols attribute, or
both (usually the case)
• The possible values for rows and cols are numbers, percentages,
and asterisks
• A number value specifies the row height in pixels -
• A percentage specifies the percentage of total window height
for the row - Very useful!

8/10/2019
 2.10 Frames (continued)

 An asterisk after some other specification gives the remainder of

the height of the window
 Examples:
<frameset rows = "150, 200, 300">
<frameset rows = "25%, 50%, 25%">
<frameset rows = "50%, 20%, *" >
<frameset rows = "50%, 25%, 25%"
cols = "40%, *">
 The <frame> tag specifies the content of a frame
 The first <frame> tag in a <frameset> specifies the content of
the first frame, etc.
 Row-major order is used
 Frame content is specified with the src attribute
 Without a src attribute, the frame will be empty (such a frame CANNOT
be filled later)
 If <frameset> has fewer <frame> tags than frames, the extra
frames are empty

8/10/2019
 2.10 Frames (continued)

 Scrollbars are implicitly included if needed (they are needed

if the specified document will not fit)

 Note: the Frameset standard must be specified in the

DOCTYPE declaration

8/10/2019
 <meta> tag
 Metadata is data (information) about data.

 The <meta> tag provides metadata about the HTML document.

Metadata will not be displayed on the page, but will be machine
parsable.

 Meta elements are typically used to specify page description, keywords,

author of the document, last modified, and other metadata.

 The metadata can be used by browsers (how to display content or

reload page), search engines (keywords), or other web services.

 <meta> tags always goes inside the <head> element.

 Note: Metadata is always passed as name/value pairs.

8/10/2019
Attribute
Explanation
name
Description of the web page. This again can be used
description by various search engines while indexing your
webpage for searching purpose.
Used to list keywords that describe the content of the
web page
keywords
later these keywords are used by the search engines
while indexing your webpage for searching purpose..
creator or The organization or person who responsible for creating
author the webpage.
date The date of publication in yyyy-mm-dd format.
identifier A unique number identifying a web page.
Language of the page. Use a two-character language
language
code.
rights Used for adding copyright statement.

8/10/2019
 http-euiv attributes :
 The http-euiv attributes are equivalent to HTTP headers and control
the action of a browser on a requested page.

 When displaying, the browser uses the instructions specified by the

http-euiv attributes.

 The instructions may contain information about when the content of

the page will expire or when the page should be refreshed.

 <meta http-equiv="content-type" content="text/html; charset=UTF-8">

 <meta http-equiv="refresh" content="300">

8/10/2019
 Example 1 - Define keywords for search
engines:
<meta name="keywords" content="HTML,
CSS, XML, XHTML, JavaScript">
Example 2 - Define a description of your
web page:
<meta name="description"
content=“Programming the Web">
Example 3 - Define the author of a page:
<meta name="author" content=“Robert
Sabesta">
Example 4 - Refresh document every 30
8/10/2019
  Content of <blockquote>
Blockquotes
 To set a block of text off from the normal flow and appearance of text
 Browsers often indent, and sometimes italicize.
<html>
<head>
<title>HTML blockquote Tag</title>
</head>
<body>
<p>Browsers generally render blockquote text as indented text. If your
quoted text needs to display within a non-quoted paragraph, you
should use the HTML q tag. Most browsers surround q text with
quotation marks.</p>

<blockquote>Browsers generally render blockquote text as indented

text. We can also use the HTML q tag. Most browsers surround q text
with quotation marks.</blockquote>

<q>Browsers generally render blockquote text as indented text. We

can also use the HTML q tag. Most browsers surround q text with
quotation
8/10/2019 marks.</q>
8/10/2019
 <font> Tag

 The <font> tag specifies the font face,

font size, and color of text.
 The <font> tag has following properties
Attribute Value Description

color #hexcode Specifies the color of the text.

colorname

face List of font Specifies the font families.

names

size number Specifies the font size

8/10/2019
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<body>

<p><font size="3" color="red">This is some text!</font></p>

<p><font size="2" color="blue">This is some text!</font></p>

<p><font face="verdana" color="green">This is some

text!</font></p>

<p><strong>Note:</strong> The font element is not supported

in HTML5. Use CSS instead.</p>

</body>
</html>
8/10/2019
 Output

8/10/2019
 XHTML Document Validation

The W3C provides a convenient Web-based way to validate

XHTML documents against its standards.
 Step 1: The URL of the service is
http://validator.w3.org/file-upload.html. Copy & paste
this link.
 Step 2: We will be driven to “Validate by File Upload”
option automatically.
 Step 3: Browse for a XHTML program file in the computer.
(example: F:/complete.html)
 Step 4: Click on “More Options” and select the criteria like
show source
 Step 5: After all the settings, click on “Check” button
Now we will be navigated to another page which shows
success or failure.

8/10/2019
8/10/2019
8/10/2019
THANK YOU