Q Answer the following questions vigilantly.

1
: i. Difference b/w web page and
web site.
ANS:
BASIS FOR
WEB PAGE WEBSITE
COMPARISON

Basic Web page is a part of Website is a cluster of

website which comprises related web pages

links to other web pages. addressed to a typical

URL.

Presented by Multiple web pages can have By a unique URL.

the same name if they reside

in different documents.

Use It is a content that is to be It is a place used to

displayed on a website. display the content.

Extension The web page URL has an There is no extension

extension. used in the URL of a

website.

Address Web page address depends Website address doesn't

dependency on website address. rely upon web page

address.

Development Requires less time to develop Usually, take more time

period as it is a part of a website. as compared to a web

page.

ii. What is web application?

Give two examples of web
 application.

Definition
A web application is a computer program that utilizes web
browsers and web technology to perform tasks over the Internet.

Example of a web application

Web applications include online forms, shopping carts, word
processors, spreadsheets, video and photo editing, file
conversion, file scanning, and email programs such as Gmail,
Yahoo and AOL. Popular applications include Google
Apps and Microsoft 365.

Google Apps for Work has Gmail, Google Docs, Google Sheets,
Google Slides, online storage and more. Other functionalities
include online sharing of documents and calendars. This lets all
team members access the same version of a document
simultaneously.

A Web application (Web app) is an application program that is

stored on a remote server and delivered over the Internet through
a browser interface. Web services are Web apps by definition and
many, although not all, websites contain Web apps. According to
Web.AppStorm editor Jarel Remick, any website component that
performs some function for the user qualifies as a Web app.

Web applications can be designed for a wide variety of uses and

can be used by anyone; from an organization to an individual for
numerous reasons. Commonly used Web applications can
include webmail, online calculators, or e-commerce shops. Some
Web apps can be only accessed by a specific browser; however,
most are available no matter the browser.

A web application (or "web app" for short) is any computer

program that performs a specific function by using a web browser
as its client. The application can be as simple as a message
board or a contact form on a website or as complex as a word
processor or a multi-player mobile gaming app that you download
to your phone.

iii. What is World Wide Web?

Also discuss its structural
 component

The World Wide Web ("WWW" or simply the "Web") is a system of interlinked, hypertext

documents that runs over the Internet. With a Web browser, a user views Web pages
that may contain text, images, and other multimedia and navigates between them
using hyperlinks.

The Web was first created around 1990 by Tim Berners-Lee working at CERN
in Geneva, Switzerland. As its inventor, Berners-Lee conceptualised the Web to be
the Semantic Web where all its contents should be descriptively marked-up.

The official description of the World-Wide Web (WWW, W3) is a

"wide-area hypermedia information retrieval initiative aiming to give
universal access to a large universe of documents". It is a way of
viewing all the on-line information available on the Internet as a
seamless, browsable continuum. This section introduces the general
concept of the World-Wide Web and the basic elements in the model.
The content of the section is as follows:

1. Basic World-Wide Web Model

2. Universal Resource Identifies
3. Hypertext Transfer Protocol
4. Hypertext Markup Language
5. Interactive World-Wide Web Model
At its core, the Web is made up of three standards:

 the Uniform Resource Identifier ( URI), which is a universal system for

referencing resources on the Web, such as Web pages;
 the HyperText Transfer Protocol ( HTTP), which specifies how the browser and
server communicate with each other; and
 the HyperText Markup Language ( HTML), used to define the structure and
content of hypertext documents.

Berners-Lee now heads the World Wide Web Consortium (W3C), which develops and
maintains these and other standards that enable computers on the Web to effectively
store and communicate different forms of information.

iv. What are the signs of good or

bad web design?
How To Identify A Bad Web Design Agency
 

1. No Portfolio to Present

Web design is considered an art and a science at the same time, so you want your website
professionally made to ensure a high rate of success. A good web designer has a good eye for
attractive web design and is technologically savvy, like a trusted and reputable web design
agency Melbourne, who would be happy to show you their portfolio.  If a web design agency
cannot present their portfolio, then there are possible reasons why is this so, including the
following:
 A bad web design agency cannot present a portfolio most especially if it’s their first
project. It is so risky to entrust your website to someone new and completely
inexperienced and untested.
 Another reason why a web design agency cannot present a portfolio is that they have
built terrible websites in the past.

2. Overcharging or Too Cheap

Web design services are not highly regulated, so web designers can charge whatever they
like. A bad web design agency may charge too high or too low, but a good web designer
checks the prevailing rates and level with the average rates as much as possible. Here are
some points to remember:

 Web designers have different tiers (e.g., catering to nonprofits or small businesses).
 Web designers also charge based on their experience, portfolio, and presence or
absence of a physical office. Online agencies tend to rate low because they don’t pay for
office rentals and other expensive aspects (e.g., cleaning services) of having a physical
office.
 The cost of the web design services depends on the level of security, attractiveness,
and functionality of your desired website.

3. Offers to Do the Job Without a Contract

While no contract means no red tape, a room to haggle for the best price, and avoiding
overcharging, it also means no guaranteed protection. A web design contract protects you
and the web designer to prevent disputes and major problems in the future. A bad design
agency offers no contract, and it means you’re not even sure if the job will be finished on
your agreed date.

What makes a good web design contract?

 Stipulates the hourly rate or pay rate of the web designer

 Shows the website’s final price and breakdown of the services
 Includes any revisions as part of your verbal agreement and initial contract
 Sets clear expectations (e.g., WordPress theme, layout, speed, font size, etc.)

4. Cannot Show Mockups and Prototypes

A bad web design agency prevents clients from demanding or asking a lot of revisions, so
they cannot present mockups and prototypes. You should be able to check your website in
various stages before launching in order to check it and address any concerns. Before
launching your website, a good web designer should be able to present the following:

 Static mockup of your website

 Site’s working prototype
 Finalized prototype (looking exactly like the final website to be launched)

5. Poor Communication Skills

A bad web designer cannot explain tech terms in layman’s language well. A good web
designer is knowledgeable about web design trends and skilled to present his ideas and
integrate them with yours. If a web designer speaks jargon, how can you fully understand the
process? You might end up having unclear expectations, doubts, and failed results. Ask
relevant questions so you can attest a web designer’s communication skills before hiring one.
Here are some questions you can ask:

 What makes an attractive website?

 How will the website highlight my best products?
 What are the web design skills and courses you have taken?
 Can you please explain the design process in detail?
 Why are your services so expensive?

Conclusion
As a website owner, you have to ensure that your website will be functional, appealing, easy
to navigate, fast, reliable, and mobile responsive. It should represent your brand or purpose.
A bad web design agency is not fit to do the job, offering deals that are too good to be true,
fishy, and not documented. Stay away from such an agency by keeping these five signs at
heart when hiring one.

Congratulations, traffic counts are jumping higher every day! But you still aren’t
making money. You might want to check on your metrics for repeat visitor
percentage and average session length. If these numbers are very low, it means
visitors are leaving quickly and not coming back. Lack of good web
design spoils the best marketing efforts. Here are ten mistakes to avoid if you
want to hold the interest of visitors.

10 Signs You Might Be Bad At Good

Website Design
Do people hate your website design? Have you noticed web traffic trends that
show visitors entering your site and leaving like their lives depend on it? One of
these factors could be the reason:

1. Spelling and Grammar

Proofread all content. Then, have somebody else proofread it. Don’t rely on spell
checkers, since a spelled word can have a different meaning when spoken (called
homonyms – using the wrong word is the most common mistake). Sloppy writing
forfeits respect.

2. Too Much Flash

Clip art and animations look engaging, but if they don’t serve a purpose, they
distract from the message. Keep a professional look. Also, some graphics might
not display correctly on mobile devices. One difference between good and bad
websites is to use graphics sensibly. Keep things organized and uncluttered.
3. Too Technical
Unless your target audience is industry professionals, don’t use complicated
explanations and technical jargon. It may sound impressive but will turn away
people who don’t understand it.

4. It doesn’t work!
Nothing frustrates users – or looks less professional – than having them click a
button or link that does nothing. Be sure everything on your site does what it’s
supposed to do. Check them from time to time to make sure it all works, or sites
you’ve linked to haven’t disappeared.

5. Bad Information
Don’t use info from 1995 just because it sounds good and makes your point. If
you’re using statistics or references, make sure they’re current. This is especially
true for phone numbers and prices – your users won’t like it if you mislead them
or send them on a wild goose chase.

6. Fancy Fonts and Colors

Yes, plain black text on a white background can look boring, but you have a
website, not an art gallery. Unless that’s somehow appropriate, avoid bright color
schemes that are hard on the eyes. That includes fancy fonts – use different fonts
for headings and subheadings, but keep things consistent. You want to impress
people with your information, not your fonts.

7. Weak Structure
Make navigating your site simple and intuitive. Don’t put your pages in
directories four or five levels deep. Don’t force your users to keep hitting the
back button over and over to return to the home page. Load times and repetition
could make this an unpleasant experience that drives them away. Good website
design means menu bars and clearly visible, appropriately labeled buttons so the
user can quickly navigate to whatever part of your site catches their interest.

8. Obscure Intentions
If the purpose of your site is to get users to do something – buy a product, submit
a form, take a poll, whatever – make it clear what you want them to do. One
difference between good and bad websites is that you don’t just throw out some
information and some buttons and hope they get the message. Make it clear what
they should do next, and provide easily visible, clearly labeled links to lead them
there.

9. On-site Search
A lot of pages have a search box. Make sure yours works, and works well.
Nothing is worse than frustrating visitors with useless searches. If your site has a
search box that doesn’t cut it, find a different one. Consider adding keywords
users might be searching for.

10. Big Blocks of Text

If information isn’t readable, it’s useless. Those 1,200-word pages of text make
visitors feel like they’re about to climb a hill. Trim it down to make your points,
but keep it natural, informative, and engaging. Break it up into shorter sentences
and shorter paragraphs with line breaks and subheadings to help them find what
they want. The same goes for forms – keep them simple, and don’t require a lot
of mandatory fields or personal information.

 
 
is not strictly about design, the Web is about Marketing! Or rather, the Web
is about the intersection between the goals of your business and the needs
of your customers and clients. The Web is about information, not entertainment. It's
  about results, not awards. The Web is not just about creativity as much as it's about
communicating with those whose needs you must satisfy in order to succeed.

A Web site that looks great but is vague and unclear about what it is trying to convey to
the visitor is not very effective. Before one graphic is created on a Web site, you need
to define who your target audience is and define what their needs are. A Web site is a
coupling of the goals of the business and the needs of the visitors. The focus of the site
becomes the satisfaction of both the goals and the needs. This is basic Marketing 101
Strategy, and it is just as true on the Web as any other form of media.

Web sites which offer impressive graphics naturally attract and retain Web "surfers",
especially since there are many poorly designed Web sites on the Internet. You need a
good graphics designer who can create graphics which will portray your company's
"image" as effectively as possible. One which will bring out the warmth and feel of your
place of business.

Since the cost of creating a good Web site can be quite reasonable, when compared
with other forms of advertising, there is no reason not to provide plenty of useful
information about the products and services customers are considering buying. Studies
show that people choose information 76% of the time they access a Web site. Satisfy
this desire for information and you will create more sales.

Web sites require careful link architecture and at every page, Web site visitors have to
  know what their options are. If your visitors can't locate easily the information they
desire, they will quickly move on - even if the information is really there! Don't make
visitors to your Web site puzzle out the meaning of the icons and graphic links
employed at your site. Icons and graphics can add visual interest, but they may also
add confusion.

If you are hoping that Web visitors will come back again and again, you should update
the information on your Web site frequently. A "What's New" page or a "tip of the
month" section provides a reason for Web visitors to bookmark your site and return.
The more they visit, the more they will receive your message.

A good Web site is more than just an electronic version of your company catalog or
brochure, visitors are interested in ways of becoming involved with the material you
provide. An on-line order form, an interactive discussion about a related issue, or some
other way to interact with your material is essential.

Most Web surfers access the Internet through a modem, which receives data at a
limited rate. Web sites which contain large graphics and special effects often consume
large amounts of data and take a long time to load onto a Web user's computer. In
order to have a visually appealing Web site which also loads quickly, you should use
techniques to minimize and optimize the size of your Web files without sacrificing their
quality.

v. Write short note on DHTML

Definition - What does Dynamic HyperText Markup Language
(DHTML) mean?
Dynamic HyerText Markup Language (DHTML) is a combination of Web
development technologies used to create dynamically changing websites.
Web pages may include animation, dynamic menus and text effects. The
technologies used include a combination of HTML, JavaScript or VB
Script,
CSS and the document object model (DOM).

Designed to enhance a Web user’s experience, DHTML includes the

following features:

 Dynamic content, which allows the user to dynamically change

Web page content
 Dynamic positioning of Web page elements
 Dynamic style, which allows the user to change the Web page’s
color, font, size or content

DHTML stands for Dynamic HTML, it is totally different from HTML. The
browsers which support the dynamic HTML are some of the versions of
Netscape Navigator and Internet Explorer of version higher than 4.0. The
DHTML is based on the properties of the HTML, javascript, CSS, and
DOM (Document Object Model which is used to access individual
elements of a document) which helps in making dynamic content. It is the
combination of HTML, CSS, JS, and DOM. The DHTML make use of
Dynamic object model to make changes in settings and also in properties
and methods. It also makes uses of Scripting and it is also part of earlier
computing trends.
DHTML allows different scripting languages in a web page to change their
variables, which enhance the effects, looks and many others functions
after the whole page have been fully loaded or under a view process, or
otherwise static HTML pages on the same. But in true ways, there is
noting that as dynamic in DHTML, there is only the enclosing of different
technologies like CSS, HTML, JS, DOM, and different sets of static
languages which make it as dynamic.
DHTML is used to create interactive and animated web pages that are
generated in real-time, also known as dynamic web pages so that when
such a page is accessed, the code within the page is analyzed on the
web server and the resulting HTML is sent to the client’s web browser.

Dynamic HTML or DHTML refers to
a combination of
regular HTML (Hypertext Markup
Language) and various programming
languages to increase a web page's
interactivity. Good examples
are drag-and-drop features
and drop-down menus that appear
when a user moves their mouse over
a certain section of the page.

How it works
DHTML combines standard HTML
 and CSS with client-side scripting
(JavaScript) and server-
side applications written in
languages such as Perl or PHP.
DHTML is beneficial in that it can
be used to create web pages that
react to user input without
sending requests to a web server.

A good example of a DHTML page

on our site is the Computer Hope
system information script, which
uses JavaScript to collect
information from the browser.

Briefly Discuss
1. Principles of web application

design.
https://www.mrc-productivity.com/blog/2019/09/7-principles-of-modern-web-
application-development-2/

2. Write a brief note on TCP/IP

application services .

Application Layer
At the top of the TCP/IP protocol architecture is
the Application Layer. This layer includes all processes that
use the Transport Layer protocols to deliver data. There are
many applications protocols. Most provide user services, and
new services are always being added to this layer.

The most widely known and implemented applications

protocols are:

Telnet

The Network Terminal Protocol, which provides remote login

 over the network.

FTP

The File Transfer Protocol, which is used for interactive file

transfer.

SMTP

The Simple Mail Transfer Protocol, which delivers electronic

mail.

HTTP

The Hypertext Transfer Protocol, which delivers web pages

over the network.

While HTTP, FTP, SMTP, and Telnet are the most widely
implemented TCP/IP applications, you will work with many
others as both a user and a system administrator. Some other
commonly used TCP/IP applications are:

Domain Name System (DNS)

Also called name service, this application maps IP addresses
to the names assigned to network devices. DNS is discussed in
detail in this book.
Open Shortest Path First (OSPF)

Routing is central to the way TCP/IP works. OSPF is used by

network devices to exchange routing information. Routing is
also a major topic of this book.

Network File System (NFS)

This protocol allows files to be shared by various hosts on the

network.

Some protocols, such as Telnet and FTP, can be used only if

the user has some knowledge of the network. Other protocols,
like OSPF, run without the user even knowing that they exist.
As the system administrator, you are aware of all these
applications and all the protocols in the other TCP/IP layers.
And you’re responsible for configuring them!

Summary

In this chapter we discussed the structure of TCP/IP, the

protocol suite upon which the Internet is built. We have seen
that TCP/IP is a hierarchy of four layers: Applications,
Transport, Internet, and Network Access. We have examined
the function of each of these layers. In the next chapter we
look at how the IP datagram moves through a network when
data is delivered between hosts.

https://microchipdeveloper.com/tcpip:common-tcp-ip-applications

http://ecomputernotes.com/computernetworkingnotes/services-and-
applications/tcpip-services

Application Layer
o An application layer is the topmost layer in the TCP/IP model.
o It is responsible for handling high-level protocols, issues of
representation.
o This layer allows the user to interact with the application.
o When one application layer protocol wants to communicate with another
application layer, it forwards its data to the transport layer.
o There is an ambiguity occurs in the application layer. Every application
cannot be placed inside the application layer except those who interact
with the communication system. For example: text editor cannot be
considered in application layer while web browser using HTTP protocol to
interact with the network where HTTP protocol is an application layer
protocol.

Following are the main protocols used in the application layer:

o HTTP: HTTP stands for Hypertext transfer protocol. This protocol allows
us to access the data over the world wide web. It transfers the data in the
form of plain text, audio, video. It is known as a Hypertext transfer
protocol as it has the efficiency to use in a hypertext environment where
there are rapid jumps from one document to another.
o SNMP: SNMP stands for Simple Network Management Protocol. It is a
framework used for managing the devices on the internet by using the
TCP/IP protocol suite.
o SMTP: SMTP stands for Simple mail transfer protocol. The TCP/IP protocol
that supports the e-mail is known as a Simple mail transfer protocol. This
protocol is used to send the data to another e-mail address.
o DNS: DNS stands for Domain Name System. An IP address is used to
identify the connection of a host to the internet uniquely. But, people
prefer to use the names instead of addresses. Therefore, the system that
maps the name to the address is known as Domain Name System.
o TELNET: It is an abbreviation for Terminal Network. It establishes the
connection between the local computer and remote computer in such a
way that the local terminal appears to be a terminal at the remote
 system.
o FTP: FTP stands for File Transfer Protocol. FTP is a standard internet
protocol used for transmitting the files from one computer to another
computer.

a. What are cookies? How

cookies are created and
destroyed? Also discuss
advantages and disadvantages
of cookies.
What Are Cookies? What is a Cookie?

Cookies are small files which are stored on a user's computer. They are designed to
hold a modest amount of data specific to a particular client and website, and can be
accessed either by the web server or the client computer. This allows the server to
deliver a page tailored to a particular user, or the page itself can contain some script
which is aware of the data in the cookie and so is able to carry information from one
visit to the website (or related site) to the next.

When are Cookies Created?

Writing data to a cookie is usually done when a new webpage is loaded - for
example after a 'submit' button is pressed the data handling page would be
responsible for storing the values in a cookie. If the user has elected to disable
cookies then the write operation will fail, and subsequent sites which rely on the
cookie will either have to take a default action, or prompt the user to re-enter the
information that would have been stored in the cookie.

How Long Does a Cookie Last?

The time of expiry of a cookie can be set when the cookie is created. By default the
cookie is destroyed when the current browser window is closed, but it can be made
to persist for an arbitrary length of time after that.

How Long Can a Cookie Last?

The duration of a cookie can be set when the cookie is created. By default, the cookie is
destroyed when the current browser window is closed, but it can be made to persist for a
length of time after the page is closed. Some cookies are ‘session cookies’, which
means they only exist when your browser is open and are automatically deleted when
you close your browser or quit the app. Other cookies are ‘persistent cookies’, meaning
they survive after your browser or app is closed and can be used by websites or apps to
recognize your computer when you re-open your browser or app later.
A computer “cookie” is more formally known as an HTTP cookie, a web
cookie, an Internet cookie or a browser cookie. The name is a shorter version
of “magic cookie,” which is a term for a packet of data that a computer
receives and then sends back without changing or altering it.
No matter what it’s called, a computer cookie consists of information. When
you visit a website, the website sends the cookie to your computer. Your
computer stores it in a file located inside your web browser. (To help you find
it, this file is often called “Cookies.”)

Advantages of using cookies

Here are some of the advantages of using cookies to store session state.
·         Cookies are simple to use and implement.
·         Occupies less memory, do not require any server resources and are stored on the user's
computer so no extra burden on server.
·         We can configure cookies to expire when the browser session ends (session cookies) or they
can exist for a specified length of time on the client’s computer (persistent cookies).
·         Cookies persist a much longer period of time than Session state.

Disadvantages of using cookies

Here are some of the disadvantages:
·         As mentioned previously, cookies are not secure as they are stored in clear text they may
pose a possible security risk as anyone can open and tamper with cookies. You can manually
encrypt and decrypt cookies, but it requires extra coding and can affect application performance
because of the time that is required for encryption and decryption
·         Several limitations exist on the size of the cookie text(4kb in general), number of cookies(20
per site in general), etc.
·         User has the option of disabling cookies on his computer from browser’s setting .
·         Cookies will not work if the security level is set to high in the browser.
·         Users can delete a cookies.
·         Users browser can refuse cookies,so your code has to anticipate that possibility.
·         Complex type of data not allowed (e.g. dataset etc). It allows only plain text (i.e. cookie
allows only string content)
Cookie Cons

 Privacy: The main concern for most users is privacy.

Cookie enabled web browsers keep track of all the websites
you have visited. This means that with permission (or not in
Google’s case), third parties can access the information
stored by these cookies. These third parties can be
advertisers, other users, or even the government in some
cases.
 Security: Cookie security is a large problem. The concern
is that many security holes have been found in different
browsers. Some of these holes were so serious that they
allowed malicious webmasters to gain access to users’
email, different passwords, and credit card information.
 Secrecy: Although third party cookies can be blocked
through your browser settings, most people don’t have the
 technical expertise to do this. Most browsers purposely
make it difficult to find this setting in order to prevent you
from turning them off. No cookies mean no data, which in
turn means less money.

Cookie Pros

 Conveniency: Cookies not only remember which websites

you have been to, they also remember information about
forms. Tired of filling out your address every time you buy
something online? Cookies can make filling out address
forms quick and efficient. Most online shopping websites
nowadays allow cookies for address and email
information but make you fill out your credit card information
each time.
 Personalization: Cookies are like the theme song to the
popular sitcom Cheers, “Where everybody knows your
name”. They are great for serving up personalized
content  that is geared towards that specific user’s
preferences. Amazon uses cookies to offer you related
products, Google uses cookies to better understand your
searches, and Facebook  uses cookies to do just about
everything.
 Effective Advertising: How nice would it be to only be
offered products or services that are relevant to
you? Internet marketing companies  collect data from cookies
to run marketing campaigns aimed at a very specific market
segment  including product group, geolocation, search term,
and demographics.
 Ease of Control: It is actually really easy to manage your
cookies if you know how. Most browsers make it easy for
you to clear your browsing history. Just go to tools, clear
history and select cookies. Cookies are stored on your hard
drive in a text file under cookie.txt, and since it is a text file
you can use just about any viewer or text editor to display,
edit, and delete them.

Advantages and Disadvantage of cookies A cookie is a small

piece of text file stored on user's computer in the form of
name-value pair. Cookies are used by websites to keep
track of visitors e.g. to keep user information like
username etc. If any web application using cookies, Server
send cookies and client browser will store it. The browser
then returns the cookie to the server at the next time the
page is requested. The most common example of using a
cookie is to store User information, User preferences, Password
Remember Option etc

Advantages of cookies

·Cookies are simple to use and implement.

·By means of cookies, websites can track number of users

visiting it. A website maintains user information in its database.

·Some websites allow their users to change the layout and

content of the website to bring about a personalized view of
the site. The cookie technology has made this possible.

·The cookie technology is also useful for the advertisers to

track the on-site behavior of users. While keeping the personal
information of a visitor, confidential, cookies help the
advertisers know the web surfing habits of the visitors.
Advertisers can promote certain products to certain users
based on the information they gather from cookies.

·The very popular e-commerce websites harness the cookie

technology to implement shopping carts. When a user selects
an item, the item is stored in the site's database. When the
user checks out, the website bears the information about the
items he/she has shopped.

Disadvantages of cookies

·Cookie poisoning is defined as the act of manipulating the

contents in the cookie before they are sent to the server.
·Changing the information contained in the cookies can
misguide the websites and advertisers.

·Cookies may generate an inconsistent state between the state

of the client and that stored in the cookie.

·The cookie technology lacks the ability to distinguish

between two users who use the same user account.

·Cookie hijacking refers to the interception of the

information on the cookies by a malicious user.

·When cookies are sent over the network in unencrypted

HTTP sessions, there exists a potential risk that the
information on the cookies can be stolen

Explain the significance of

using Table in HTML pages. Give
coding example of
<Table> <TR> <TH>.

The HTML table model allows authors to arrange data -- text,

preformatted text, images, links, forms, form fields, other tables, etc.
-- into rows and columns of cells.

Each table may have an associated caption (see

the CAPTION element) that provides a short description of the table's
purpose. A longer description may also be provided (via
the summary attribute) for the benefit of people using speech or
Braille-based user agents.

Table rows may be grouped into a head, foot, and body sections,

(via the THEAD, TFOOT and TBODY elements, respectively). Row
groups convey additional structural information and may be rendered
by user agents in ways that emphasize this structure. User agents
may exploit the head/body/foot division to support scrolling of body
sections independently of the head and foot sections. When long
tables are printed, the head and foot information may be repeated on
each page that contains table data.

Authors may also group columns to provide additional structural

information that may be exploited by user agents. Furthermore,
authors may declare column properties at the start of a table
definition (via the COLGROUP and COL elements) in a way that
enables user agents to render the table incrementally rather than
having to wait for all the table data to arrive before rendering.

Table cells may either contain "header" information (see

the TH element) or "data" (see the TD element). Cells may span
multiple rows and columns. The HTML 4 table model allows authors
to label each cell so that non-visual user agents may more easily
communicate heading information about the cell to the user. Not only
do these mechanisms greatly assist users with visual disabilities,
they make it possible for multi-modal wireless browsers with limited
display capabilities (e.g., Web-enabled pagers and phones) to
handle tables.

Tables should not be used purely as a means to layout document

content as this may present problems when rendering to non-visual
media. Additionally, when used with graphics, these tables may force
users to scroll horizontally to view a table designed on a system with
a larger display. To minimize these problems, authors should
use style sheets to control layout rather than tables.

Tables are defined with the <table> tag.

To insert a table on your page you simply add these tags where you want the table to
occur:
 <table>
</table>

The above table would be of no use since it has no rows and no columns.

ROWS:
To add rows to your table use the <tr> and </tr> tags.
Example:
<table>
<tr></tr>
<tr></tr>
</table>

It doesn't make sense to write the above lines in itself, cause you can't write content
outside of table cells.

If you do write things outside of cells it will appear right above the table.

COLUMNS:
You can divide rows into columns with <td> and </td> tags:
Example:
<table>
<tr> <td>This is row one, left side.</td> <td>This is row one, right side.</td> </tr>
<tr> <td>This is row two, left side.</td> <td>This is row two, right side.</td> </tr>
</table>

Result:
This is row one, left side. This is row one, right side.
This is row two, left side. This is row two, right side.

This page has shown the core basics of tables. In addition to these, there are different
options for customizing your tables.
The following pages will focus on the different settings for <table>, <tr> and <td> tags.

https://www.tutorialspoint.com/html/html_tables.htm

a. How to create a frame in

 HTML? Explain with code
example.
Learning how to create frames

Frames have been around for a long time now, supported by every known
browser. While some consider them annoying, nicely designed, frames
could be very helpful when navigating a site. In this tutorial, we will talk
about how to implement frames, and finish up with how to create
borderless frames, and how to create links that load content into another
frame.

 Everything you need to know to create frames

All frames are created using the <frameset> tag. This essentially makes
up the "master" page, which will "contain" the pages that users actually
see. The "master" page, with the <frameset> tag, replaces the <body>
tag, meaning you DO NOT use the <body> tag anywhere inside this
master page. This master page is than fitted with the individual pages
that are "put" inside it. Ok, lets have a look at how exactly this is done:
The following example creates a page with two frames:

//master page page1 page2

<html>
<head>
<title>My example</title>
</head>
<frameset cols="30%,50%">
<frame src="page1.htm">
<frame src="page2.htm">
</frameset>
</html>
Page1.htm and Page2.htm are created separately as "normal" html
pages, and are contained within this master page. We used the keyword
"cols" to indicate that we want to define column frames. To create rows
instead, simply use the keyword "rows":

<html> page1
<frameset rows="50%,50%">
<frame src="page1.htm">
<frame src="page2.htm"> page2
</frameset>
</html>
In both of these examples, we used percentage as the width
measurement. You could also use pixels, with some caution, however:

<html> page page2 page3

<frameset cols="100,200,340"> 1
<frame src="page1.htm">
<frame src="page2.htm">
<frame src="page3.htm">
</frameset>
</html>
If you add up the total width (100+200+340=640), this will equal the
width of a screen at resolution 640*480. Most 14' screens are set as
such, but how about people using screen resolutions of (800*600)? If
they come along, how will your frame page be displayed? Well, the
browser will have no choice but to stretch the width to exceed 640, in
order to accommodate this larger screen. (All frames defined using
percentage will be stretched, (or shrunk) depending on the user's screen
resolution). This could lead to headaches for developers, since you never
know how you frames will be displayed. Does that mean that you should
never use pixels than? Absolutely not. Lets see how we can get over this:
<html> page page2 page3
<frameset cols="100,200,*"> 1
<frame src="page1.htm">
<frame src="page2.htm">
<frame src="page3.htm">
</frameset>
</html>
We used a special keyword "*", which means undefined. By using this,
only this part will be stretched, if necessary. The other two, 100, and 200,
will not be inadvertently stretched. That way, you can keep all pages with
layout that do not want to be stretched on the left two frames, and the
one that's ok with it, on the right frame.

 Creating complex frames:

So far, we've only created simple, either all columns, or all rows, frames.
Now lets march on to ones with both, shall we?

The key to defining frames with both columns and rows is to place
multiple pairs of <frameset></frameset> tags in your master page, each
pair enclosing a "cols" or "rows" declaration. This can get a little tricky, so
I'll try to explain using multiple examples. Let's start slicing

<html> page1 page3

<frameset cols="50%,50%">
<frameset rows="50%,50%">
<frame src="page1.htm"> page2
<frame src="page2.htm">
</frameset>
<frame src="page3.htm">
</frameset>
</html>
Ok, what the heck is going on? First, in blue, we defined two columns.
Then, for the first column, we sliced that even more-into two rows. As
you can see, the rows and columns "chunk" all end with a </frameset>
tag, two to be exact. Like I said, we started out the "framing" by defining
cols="50%,50%". Lets see what happens if we defined the rows first,
instead of the other way round:

//master page page1 page2

<html>
<frameset rows="50%,50%">
<frameset cols="50%,50%"> page3
<frame src="page1.htm">
<frame src="page2.htm">
</frameset>
<frame src="page3.htm">
</frameset>
</html>
As you may see, totally different outcomes! Confused? Here's a good rule
to remember: Whenever you slice a frame, either into columns or rows,
your slice will keep slicing until it hits a "wall".

 Complex frames step-by-step example:

Lets put the above rule into good use. Remembering this rule will save
you a lot of trouble. Ok, assuming we want to create a frame like this:

 
   
   
This may look overwhelming, but if you keep that sushi rule firmly in your
head, you'll be fine. How shall we go about doing it? Start with rows?
Columns? Well, first take out our knives, and remember, this knife will
keep slicing until it hits a "wall". If we started with rows, we would have
something like this:

This sushi knife keeps cutting until it hits an obstacle, in this case, the
edge of the page. As you can see, starting off using rows would make it
impossible to achieve our desired goal.

Ok, lets begin with columns then:

<html>
<frameset      
cols="33%,17%,17%,17%,17%">
</frameset>
</html>
So far, so good. Now we need to split the first column into two rows.
Remember, this swiss knife isn't really sharp, so it wont cut through the
walls of the first column.

<html> page1      
<frameset
cols="33%,17%,17%,17%,17%">
page2
<frameset rows="50%,50%">
<frame src="page1.htm">
<frame src="page2.htm">
</frameset>
</frameset>
</html>
As you can see, the "rows" part is nested within the "cols" part, since the
rows are a "subpart" of the columns declaration.

Lets continue our sushi chopping, shall we?

<html> page1 3 4    
<frameset
cols="33%,17%,17%,17%,17%">
page2
<frameset rows="50%,50%">
<frame src="page1.htm">
<frame src="page2.htm">
</frameset>
<frame src="page3.htm">
<frame src="page4.htm">
</frameset>
</html>
And finally:

<html> page1 3 4 5 7
<frameset
cols="33%,17%,17%,17%,17%">
page2 6
<frameset rows="50%,50%">
<frame src="page1.htm">
<frame src="page2.htm">
</frameset>
<frame src="page3.htm">
<frame src="page4.htm">
<frameset rows="50%,50%">
<frame src="5.htm">
<frame src="6.htm">
</frameset>
<frame src="7.htm">
</frameset>
</html>
I know this may be VERY confusing, but the best way to learn it by
playing around with it yourself...so open your editor, and try something
out! Ok, we've learned the overall structure of frames-lets move on to
look at some attributes we can add to frames, plus master the art of
linking and loading contents from one frame to another.

b. Write the code to upload a

file on a web page.
Create The HTML Form
Next, create an HTML form that allow users to choose the image file
they want to upload:

<!DOCTYPE html>
<html>
<body>

<form action="upload.php" method="post" enctype="multipart/form-
data">
  Select image to upload:
  <input type="file" name="fileToUpload" id="fileToUpload">
  <input type="submit" value="Upload Image" name="submit">
</form>

</body>
</html>

Some rules to follow for the HTML form above:

 Make sure that the form uses method="post"

 The form also needs the following attribute:
enctype="multipart/form-data". It specifies which content-type
to use when submitting the form

Without the requirements above, the file upload will not work.

Other things to notice:

 The type="file" attribute of the <input> tag shows the input

field as a file-select control, with a "Browse" button next to the
input control

The form above sends data to a file called "upload.php", which we will
create next
If you want to allow a user to upload an external file to your website, you need
to use a file upload box, also known as a file select box. This is also created
using the <input> element but type attribute is set to file.
Example
Live Demo

Example
You can try to run the following code to upload an external file to your
website:

<!DOCTYPE html>

<html>

   <head>

      <title>File Upload</title>

   </head>

   <body>

      <form>

         <input type = "file" name = "upload" accept =

"image/*" />

      </form>

   </body>

</html>

Here are the attributes of the file upload box:

Sr.No Attribute & Description

1 name
 Used to give a name to the control which is sent to the server to be recognized and get the value

2 accept
Specifies the types of files that the server accepts.

What is web server and Its basic

operation also discuss advance
mechanism for dynamic content
delivery.
Operation in a Web Server
In this section, we describe the operation of IO-Lite in a Web server as an
example. We start with an overview of the basic operation of a Web server
on a conventional UNIX system.

A Web server repeatedly accepts TCP connections from clients, reads the
client's HTTP request, and transmits the requested content data with an
HTTP response header. If the requested content is static, the corresponding
document is read from the file system. If the document is not found in the
filesystem's cache, a disk read is necessary.

Copying occurs as part of the reading of data from the filesystem, and when
the data is written to the socket attached to the client's TCP connection.
High-performance Web servers avoid the first copy by using the UNIX
mmap interface to read files, but the second copy remains. Multiple
buffering occurs because a given document may simultaneously be stored in
the file cache and in the TCP retransmission buffers of potentially multiple
client connections.

With IO-Lite, all data copying and multiple buffering is eliminated. Once a
document is in main memory, it can be served repeatedly by passing buffer
aggregates between the file cache, the server application, and the network
subsystem. The server obtains a buffer aggregate using the IOL_read
operation on the appropriate file descriptor, concatenates a response header,
and transmits the resulting aggregate using IOL_write on the TCP socket. If
a document is served repeatedly from the file cache, the TCP checksum
need not be recalculated except for the buffer containing the response
header.

Dynamic content is typically generated by an auxiliary third-party CGI

program that runs as a separate process. The data is sent from the CGI
process to the server process via a UNIX pipe. In conventional systems,
sending data across the pipe involves at least one data copy. In addition,
many CGI programs read primary files that they use to synthesize dynamic
content from the filesystem, causing more data copying when that data is
read. Caching of dynamic content in a CGI program can aggravate the
multiple buffering problem: Primary files used to synthesize dynamic
content may now be stored in the file cache, in the CGI program's cache as
part of a dynamic page, in the server's holding buffers, and in the TCP
retransmission buffers.

With IO-Lite, sending data over a pipe involves no copying. CGI programs
can synthesize dynamic content by manipulating buffer aggregates
containing data from primary files and newly generated data. Again, IO-Lite
eliminates all copying and multiple buffering, even in the presence of
caching CGI programs. TCP checksums need not be recomputed for
portions of dynamically generated content that are repeatedly transmitted.

IO-Lite's ability to eliminate data copying and multiple buffering can

dramatically reduce the cost of serving static and dynamic content. The
impact is particularly strong in the case when a cached copy (static or
dynamic) of the requested content exists, since copying costs can dominate
the service time in this case. Moreover, the elimination of multiple
buffering frees up valuable memory resources, permitting a larger file cache
size and hit rate, thus further increasing server performance.

Finally, a Web server can use the IO-Lite facilities to customize the
replacement policy used in the file cache to derive further performance
benefits. To use IO-Lite, an existing Web server need only be modified to
use the IO-Lite API. CGI programs must likewise use buffer aggregates to
synthesize dynamic content.

A quantitative evaluation of IO-Lite in the context of a Web server follows

in Section 

From book chap 4