Additional Knowledge Material

Faculty E-notes

Course : BCA 4th semester

University : M.D.U.
Subject : Web Designing
Subject Code : BCA-206
Unit : 2
Faculty Name: Preeti

1|P ag e
 WEB DESIGNING

INDEX

Sr.no. Topic Page no.

1 Web Publishing 3

2 Hosting your site 3

3 Internet Service Provider 6

4 Phases of Planning and Designing your website 8

5 Steps for developing yours site 11

6 Website Design 13

7 Home page 17

8 Domain Name 18

9 Front page view 19

10 Important Notes 22

2|P ag e
Web Publishing

Web Publishing, as the name suggests, is the process of creating a website and placing it on the
web server, and published content may include text, images, videos, and other types of media. Its
main aim is to facilitate communication simply by adding context through style, emotion, and
space. It is also known as online publishing.

Web Publishing Process

Once we create our website, we need to do the following to publish our website:

1) Determine a Domain Name.

2) Register the domain name.
3) Locate and register with a web host and also verify whether or not your domain name is
already in use.
4) Now uploading your web pages to the host's site. For this you use FTP to transfer the site
from computer to host.
5) Finally, test your site by travelling pages and hyperlinks, making sure that the site performs
to your satisfaction.

Hosting your site

Web hosting is like renting space on the Internet or the web browser. It’s equivalent to allocating
server space on the World Wide Web, providing a dedicated environment for your web domain.
When you purchase a hosting plan, you’re essentially renting space on a physical server to store
all your website’s files and data. Web hosts offer the technology and resources necessary for the
effective and secure operation of your website.

Requirement to host your website

1. Domain name: - Choose a domain name that reflects your business or products. You
need to make sure the domain name you choose is available. If desired domain name is
not available the try different keywords that relate to business. The best domain name is
one that’s short, easy to spell and easy to remember.
2. Web hosting provider:- Select a web hosting company that has been in business for a
number of years. Make sure you have enough storage space and bandwidth to host
your website files.
3. Your Website files:- Place all your website files in one folder on your computer so they
are easy to find and can be quickly uploaded to the web server.
4. FTP software: - This is used to transfer files (i.e. uploading files) from your computer to
the server on your web hosting service. If you don’t have FTP software already installed
on your computer downloading Filezila or SmartFTP. They’re both free and easy- to –
use.

3|P ag e
Types of hosting

There are mainly four types of web hosting

1. Free web hosting service: - A free web hosting service is a web hosting that is free, usually
advertisement-supported and of extremely limited functionality. A few free web hosts have a
basic package for free, and enhanced packages (with more features) for a cost.

Limitation of free hosting service

 Less storage space

 Very small bandwidth
 Don not allow certain file types (for example MP3, MPEG etc.)
 Compulsory placement of the Webhosts Banner or Popup ads into all web pages.

Example

Some free web hosts are:

 Geocities(geocities. Yahoo.com)
 Freeservers (www.freeservers.com)
 Freewebs (www.freewebs.com)

2. Paid web hosting service:- A Paid web hosting service is a web hosting service that is
chargeable based on your storage space requirement, functionalities you own and
database used if any.

Advantages

a. Own domain: you can use your own domain name.

b. Control: You control every aspect of your site, including design and advertising content.
c. Accountable: When you pay for hosting, you hold more leverage over your hosting
company in the event of problems.
d. Portability: By retaining control of your source code and data., you can easily move your
site to a new host.

Disadvantages

a. Expensive as compare to free web hosting service.

b. It requires more technical work.
c. When you create a site yourself, you become responsible for the maintenance of your own
code.

3. Dedicated web hosting service :- The user gets his or her own Web server and gains full
control over it. If you have a computer and a high speed internet connection (DSL/cable),
you can host your own website. You will need to keep your computer on and online 24/7.
4|P ag e
 4. Colocation web hosting service:- Similar to the dedicated web hosting service, but the user
owns the server, the hosting company provides physical space that the server takes up and
takes care of the server. This is the most powerful and expensive type of the web hosting
service.

Here are some popular web hosting providers:

1. Bluehost India: A leading WordPress hosting provider that offers domain, website, online
store, and WordPress services. They provide free SSL, CDN, domain, and 24/7 support.
Whether you need a simple WordPress blog, a professional website, a powerful online
store, or a managed WordPress solution, Bluehost India has a plan for you.
2. GoDaddy: Known for its reliable web hosting with a 99.9% uptime guarantee. They offer
optimized servers for faster performance and 24/7 tech support.
3. BigRock: Offers a range of web hosting plans tailored to specific needs, including Linux,
Windows, reseller, WordPress, and 24/7 support. They provide a 99.99% uptime
guarantee, free domain, SSL, business email, and website builder.

Remember, choosing the right web hosting provider depends on your specific requirements and
budget.

5|P ag e
Internet Service Provider (ISP)

An Internet service provider is an organization that provides users to access the Internet and
related services. In addition to internet access, they may provide a combination of services
including internet transit, domain name registeration and hosting, and web hosting.

ISPs employ a range of technologies to enable consumers to connect to their network for home
users, the most popular options are:

 Dial- up
 Broadband
 Broadband wireless access
 Cable modem
Popular options for business organization are:

 DSL(Digital subscriber line)

 Ethernet technologies
With the increasing popularity of downloading music and online video and the general demand for
faster page loads, higher bandwidth connections are becoming more popular.

ISP Features
1. Security:-New viruses circulating the internet every day, you can’t be too careful. That is
why it is critical for ISP’s to offer virus protection. However, they are now offering popup
blockers also. These troublesome ads can become so frustrating that they too can be
considered harmful to your computer.
2. Speed:-ISP’s have started furnishing tools to speed up customer’s computers and create a
more enjoyable internet experience.
3. Block adult material:-They are also protecting children from the net by providing blocks
controlled by parents to block adult material on the net.
4. Multiple e-mail accounts:- Many ISP’s provide between 5 and 10 e-mail accounts to one
subscriber. This allows every member of the family to have their own e-mail account.
5. Free web space:- ISP’s are now offering free web space to store your website or webpage.
This space is limited in size, but does not always have the ads that come with other free
web spaces.
6. Multiple access:- Your ISP may provide the services from multiple computers. This may be
free or may cost you a small fee.
Extra features of a business class ISP

Connecting with customers over the Internet is an integral part of a successful business in today’s
information age. While most internet services providers (ISPs) have packages that are fit for a
household’s needs, the technological needs of a business or company are greater.

1. Increased Bandwidth and Speed

Primary, Business class ISP packages offer increased bandwidth. Companies typically offer
various plans or packages with various connection speeds. ISP package for household

6|P ag e
 customer is symmetric digital subscriber line (SDSL). The second connection offered is a
T1 line, which gives a faster connection than SDSL and allows for larger companies to
functions smoothly and efficiently online. A T1 connection signal is digital instead of the
standard analog.
2. Web Storage Space
Some businesses fully function over the internet and need web space to match their
ambition. Many ISPs include web space and website design applications as part of a
connection packages.
3. Custom Email Accounts
Business class ISPs also offers email accounts for businesses using a custom domain
name. Added storage space for users, security and encryption options, and remote access
are normally provided b ISPs.

Factors considering while selecting an ISP

There are several factors to look for when selecting an ISP.
1. Free plan: - Internet services providers may offer a flat monthly fee for unlimited access.
Hourly fee, or both. Select the plain according to the requirement. If you are online for
more than five hours per month, a flat monthly fee will be the most economical choice.
2. Stat-up fees: - Some providers charge a fee for setting up new accounts that can range
from Rs 500 to Rs 5000.
3. Local access location: - Make sure a provider offers local access numbers for your area,
as well as for any area to which you routinely travel.
4. Contracts: - ISPs offer monthly or yearly contract for service in exchange for a discount
rate. Make sure that your services provider is stable and reliable before committing to a
long-term agreement.
5. Stability: - It’s always best if you can open an account with an ISP that has an
established track record. Stability is particularly important because once you are on the
internet you will be sharing your e-mail address or other internet services with friends
and family.
6. Customer Services: - If you’re new to the Internet, customer service or technical support
is particularly important. For Internet you have to install a modem, install software, and
then configure the software to work with a particular ISP, so it might be comforting to
know that you can call friendly ISP’s tech support people for a helping hand, if
necessary.
7. Dependable access: - The ability to establish a connection during peak hours has
become an important issue as more people go online.
8. Restricted access: - Providers can often determine what internet services they will
provide.

7|P ag e
NOTE: - consider the following things while selecting an ISP

 Local location of ISP

 Good reputations of ISP
 Economical
 Good customer support
 Good performance
 Less startup fee
 Provide restricted access of unwanted sites
 Protect from viruses

Phases of Planning & designing your website

Before designing a website, it is necessary to do proper planning as in the case of building a
house.

Consider the following points while planning a website;

 Purpose of website
 Target audience
 Choosing the contents
 Storyboarding (or blue of a website)
 Directory Structure of the website
 Budgeting
1. Purpose (or objective) of website: - The first step of planning your website is to identity
the purpose of the site. Your objective should focus on what the basic requirement of our
customers and how can your website assist them. Therefore, a clear purpose of the website
can give you’re the fuel to construct a website. Purpose of website could be as follows:
 To educate people
 To entertain people
 To promote/sell a product
 To provide information regarding admission procedure in a College/University
 To promote information on companies, products and sources, sports and games,
travel and tourism, medicines and health.
2. Target Audience: - The next step is to “Identify the target audience”, their knowledge,
background, interests and needs age, gender, geographic location etc. Your audience or
visitors will visit your site for a specific reason and you need to understand the requirements
of your visitors. You need to hold the attendention of your visitors so that they will stay
longer in your site. If the website is likely to have visitors who access from home, then users
will have probably slow modem connections. On the other hand, if visitors expected to be
fans to music, then high-end technology such as Macromedia Flash, Animation with sound
effects may be acceptable.
3. Choosing the contents:-Once the purpose and target audience of the website and defined
properly, organize the website contents, put together any existing documents and pictures
you want to work. For example, if it is a company website, you may want to assemble
company information, and product descriptions. Content management is an integral part of
8|P ag e
 any website. Your visitor judges you through the glasses of content and technology used.
Website content might be :
a. Who you are?
b. What you do?
c. How to contact you?
d. List of services and products.
e. Assemble photographs and logos.
f. Updating of text and other content to keep site fresh and content correct.
g. Building necessary content then organizing it according to the visitors need is a major
step in website planning.
Characteristics of web content:
 Contents should be crisp and brief
 Contents should be will edited
 Contents should accomplish target audience objectives
 Content should be lucid and attractive
 Content should not be ambiguous.

4. Storyboarding (or blue print of a website):- In storyboarding, you make a site map of
your website. Storyboarding creates a visual portrayal of the web pages. There are different
ways of making a storyboard for any website. It basically depends on the content and the
pages involved in the website. Storyboard is like a “script writing” in which the text as well
as graphics data is sequenced properly. As the information will be spread in multiple pages
it will be essential to have a proper sequence of webpages and define hyperlinks to those
page.
Steps for storyboarding are:
 First, define the purpose of webpage or site you will be creating and who will be the
audience.
 Divide the document into the main topics and group the relate information under a single
topic.
 Prepare a rough outline of each of the pages including the home page or start page.
 For each page provide the following information :
a. Title of the page
b. The main heading
c. All subheadings
d. Purpose of page
e. Description of contents
f. Image types
g. Description of all Hyperlinks

9|P ag e
Layout Process

You can also use storyboarding for defining the layout of the information. There are three types of
layout.

 Linear Layout

Linear layout has a sequential link between pages as shown in figure 4.1.This type of layout is
essential when the information contains presentation slides. Each page has a link to the next
page, and the end page has a link back to the first page.

 Hierarchical Layout

Hierarchical layout is the most common approach in designing web pages. In this layout, we start
with a home page and then we select other pages as the links are provided to other pages.
Usually each one of these pages have links to the home page.

 Combination Layout

A website with large number of pages generally contains a combination of both, linear and
hierarchical layout.

10 | P a g e
 5. Directory Structure Of the website

For better management of the site, it would be better to create a directory structure for your site,
where the website contains all the files put under one directory. This may hold some sub-
directories containing related items like you can have sub directories of images or picture, sound
clipping. So breakdown your site into different categories and store concerned files inside.

6. Budgeting
It is very important to find the cost involved for the development of a website. Consider the
following things while doing the budgeting.

 Salaries and benefits of development and support staff

 Cost of Hardware and software needed.
 Cost of Server and technical support
 Cost of name and registration
 Cost of Service Provider
 Cost of Search Engine Registration

Steps for developing your site

1. Decide on the type of website you need: - The type of website you need depends on the
nature of your business and the goals you have for the site. For example, if you want to sell
you r company’s products directly to customers, you will need a Website that revolves
around a catalog. www.amazan .com is a good example of such kind of wesite. Each
product review. Once you choose the general type of site you want, you need to decide
what features you will offer. Before deciding the feature of your Website you need, look at
your competitor’s sites and position your site accordingly.
2. Register a domain name: - A domain name is a unique name of your website on the
Internet domain name should be short, descriptive and easy to remember.
3. Hosting your website: - You can either host your own website or hire a Web hosting
company, to host your site. There are advantages and disadvantages to both.
a. Host your own site: - Advantages and disadvantages of hosting your own website.
Advantages
 You are in complete control
 Unlimited flexibility
 You choose your own hardware, operating system, database and other tools.
 No need to learn another company’s Web hosting procedures.
 No extra charges or payment for storage space or bandwidth usage.
Disadvantages

 Purchasing and maintain computers and software can be expensive.

 Obtaining a reliable, fast connection to the internet can be very expensive.
 Need a high degree of technical knowledge.

11 | P a g e
 b. Working with a Web hosting service
Advantages
 Reliable and secure computer hardware
 Fast Internet connection
 Low stat-up costs
 Free technical support
Disadvantages

 Monthly or yearly fees

 Not very flexible
 Need to find a good web hosting company

4. Build the website yourself or hire a web designer and developer?

Someone must design the look of your site, create the images and write the programming
code. You can do it yourself or hire a web designer and developer.

5. Optimize your website for search engines

Many customers will use a web search engine to find you,, so making your website search
engine friendly is extremely important. Some main steps to do this are:
I. First create keywords that describe your business
II. Use as many of the keywords as possible on the main page of your website, in the text
that describes your business. Repeat the most important keywords several times.
III. Insert these keywords in the HTML code of your website using the <META> tags.
6. Thoroughly Test Your Website, and GO Live
Once you’ve built websites, test every aspect of it before opening up for business. Click on
every link. Make sure all the text images colors, and page layouts are correct. Check your
spelling.
7. Promote Your Site
Take the following steps to promote your site.
a. Register your Website with the big search engines like google, yahoo and Alta Vista.
b. Include your Website’s URL in all your printed marketing and advertising materials.
c. There are many specialized Web directories that only businesses in a certain industry.
d. If you belong to any business associations, list your company’s information on the
association’s Website.
8. Analyze Your Website Traffic
On your Website, you can track many statistics critical to improving your business, including
how many unique visitors came to your site, What they looked at, how many just browsed,
how many contacted you, how many purchased your product, how are repeat customers,
and how effective your advertising/marketing are To get these statistics you must have web
analysis software installed on your site.
9. Obtain Customer-Feedback
Websites offer many ways to obtain customer feedback. The Web statistical analysis
software is a form of customer feedback. Two additional methods are customer surveys
and community forums. (also known as message boards).
12 | P a g e
 10. Rethink, Refresh, Revise
Runing a successful site means updating it regulary. Keep no top of your sales data, your
Web analysis statistics, your customer feedback, and what your competitors are doing. Use
this information to substantively improve the structure of your website, as well as the
products and services you offer.

Website Design

A good design should take should into account all the web elements-audience information,
purpose and objective statements ,domain information, and web specifications and combine them
to produce a plan for implanting the web.

A successful web requires that all processes and all elements work together. Although the ‘look
and feel’ of many well- conceived websites may vary greatly, good websites tend to share a
number of characteristics. These characteristics provide the basic of the ‘Research –Based Web
Design.

The best Website design for your website is the one you like best. However, just because your
Website is pretty does not mean your readers will read it, or come back another day to read it
again.

1. Good Design Feature

While designing a good website, keep these concepts in mind

(a) Text

 Text is big enough to read, but not too big.

 The hierarchy of information is perfectly clear.

13 | P a g e
  Columns of text are narrower than in book to make reading easier on the screen.
 Use Black Text on Plain.
 Use High-Contrast Background.
(b) Navigation

 Navigation button and bars are easy to understand and use

 Navigation is consistent throughout website
 Navigation buttons and bars provide the visitor with a clue as to where they are, what page
of the site they are currently on
 A large site has an index or site map
(c) Links

 Link colors coordinate with page colors

 Links are underlined so they are clear to the visitor
(d) Graphics

 Every graphic has an alt label

 Every graphic link has a matching text link
 Graphic and back round use browser-safe colours
 Animated graphics turn off by themselves
(e) General design

 Quick download
 Home page should fit 800X600 pixel space
 All of the other pages have the immediate visual impact within 800X600 pixel
 Good use of graphic elements
 Every web page in the website looks like it belongs to the same site.

2. Principles of Web Design

Following are some basic principles about website design which will help you to design an
effective website:

Easy to read

The most important rule in web design is that you website should be easy to read. Consider
following points to make your website easy to read:

 Choose your text and background colours very carefully. Use dark coloured text on a light
coloured background.
 Do not set your text size too small (hard to read) or too large.
 Title and Main headings should be centre aligned
 Keep the alignment of your main text to the left.
Easy to navigate

14 | P a g e
Your website should be easy to navigate. Navigation is the heart of any good web design. The
ability of visitors to get around site quickly and easily is extremely important. These are several
basic styles of navigation that are identified by position and orientation on a page.

They include:

 Top
 Bottom
 Left Side
 Right Side
 Horizontal
 Vertical
Left side navigation are the most commonly used. Right side navigation is extremely rare. Bottom
navigation is used when pages are long.

Consider following points to make your website easy to navigate:

 All of your Hyperlinks should be clear to visitors.

 Graphic images, such as button or tabs, should be clearly labeled and easy to read.
 Make your text links blue and underlined.
 Include a way to get back to the home page, on every page
 Include Navigation tools on every page.
Easy to Find

Effective websites can easily be found and accessed over the internet. After building your website,
to make the sites availability over internet, on searching through search engine, it is necessary to
promote your site online. To promote the website, the site should be registered with several major
search engines, banner advertising, electronic magazines and links from other websites.

Layout and design consistency

Your webpage layout and design should be consistent throughout the site, including colors,
graphics, typefaces and all other design elements. For example: link colors throughout your
website, font type, color and background color, heading and text alignment should remain same
throughout your site.

Quick download

It is best to keep your download time as short as possible by:

 Minimizing the use of images

 Cut down the animated gifs
 Using compressed images
Updated information and features that support all browsers

15 | P a g e
Always keep your website content fresh and alive. Delete any outdated information and new
information as needed by visitors.Make sure that features website contains are supported by all
browser.

Web Design Methodologies

1. Top Down: - In the top-down methodology, designers start with Home page and then
branch off from there. They even might create prototype holder page that contain only
minimal information but hold a place for late development in the web. The benefit of the top-
down but hold a place for later development in the web. The benefit of the top-down
approach is that designers can develop page according to one central theme or idea. This
provides a good opportunity to affect the look and feel of the whole web very powerfully
because all pages are designed according to the top page look and feel.
2. Bottom up: - If web designers have no pages from which to start, they can begin by
designing leaves or pages that accomplish specific objectives and then link them through
intermediate page to the Home page. The benefit of this design is that the designers aren’t
constrained by the style of a top page in the leaf pages. Instead they design the design the
leaf pages in exactly the right style based on their functions. Later, they adjust the pages to
create a common look and feel for the whole website.
3. Incremental –in-Time: - The incremental-in-time approach develops page “just in time”
when they are needed. An initial home page might be needed as well as specific leaf pages
that implement particular objectives. These are created and linked with the understanding
that later intermediate pages might be added. This works well if web developers want to
very quickly have a working website that grows incrementally rather than deploying all at
once.

16 | P a g e
Home Page

The homepage, often known as the home page, is the initial page that visitors see when they visit a
website. It is the name of a website's main page, which acts as the site's beginning point and where
visitors can find links to other pages on the site. For example, when you visit https://javatpoint.com,
you will visit the Javatpoint home page directly. On all web servers, the homepage is index.html by
default; however, the developer can also decide it in index.php, index.htm, index.html, index.php,
default.html, and home.html. The home page can be controlled by web managers on the basis of a
way of directing the user experience. The root directory of the website contains the home page,
which may also be referred to as a "landing page," "the front page," or "welcome page." Many home
pages offer top-level menus that allow the users to go on the different sections within the website,
such as about," "contact," "products," "services." You may also find some other elements on the
home page of a website include recent news or updates, a search bar, etc.

An information is also included within the website that changes every day. The website's home
page's default filename can be customized on IIS and Apache servers. Also, the filename does not
include the home page URL as the root directory of the website loads the home page automatically.
The average business website is one of the best examples, which frequently has a logo and
prominently displays the company name; it also includes photographs with information about the
company. For example, what it does in a community, what the business produces, or who works
there.

17 | P a g e
Domain Name System (DNS)

A domain name helps in locating a computer or web server on the Internet. A typical domain name
indicates the country in which the computer is located and which organization owns it. The domain
naming scheme by which servers are identified knowns as the domain name system.

Sr. No. Domain ID Remarks

1 com
2 org
3 gov
4 co
5 net
6 edu
For Commercial firms
For non-government organizations and other no- profit
organization
For government organization
For listed companies
For networks
For educational firms

In a domain name, a two letter abbreviation indicating the country name may be used

For Example

in India

au Australia

uk United Kingdom

nz New Zealand

pk Pakistan

ca Canada

Example: - 1 consider the domain name

www.khoj.com

Here www indicates the World Wide Web

Khoj is the name of company or organization

com indicates commercial organization

Example: - 2 consider the domain name

www.microsoft.co.in

Here www indicates the World Wide Web

microsoft is the name of company

co means listed company

in suggests that it is based in india

18 | P a g e
Front pages views

One of FrontPage's most powerful features has always been its capability to give you multiple
ways to look at your Web site during the many stages of the design process. Many of these
options also provide a means for editing site content that might be more advantageous than
another. This is done through the different views provided by FrontPage.

Specifically new to FrontPage is the Split view, but many of the others have been updated to
provide more power to the end user.

The views are either page or site related and are grouped accordingly. In this chapter, we'll look at
the different FrontPage views and show how to maximize the unique development angle they
provide in the Web design process.

FrontPage provides the following views:

 Design. The WYSIWYG (what you see is what you get) interface to the development process
similar to the look and feel of most Microsoft Office System products. Most users will find that
a considerable amount of their work is done in Design view.

 Code. The means for direct coding of HTML or other scripting languages. FrontPage provides
a number of tools that assist in entering code through this view.

 Split. A new option that splits the screen between Design and Code view. This allows the
developer a means to instantly see how her HTML will be rendered.

 Preview. Let’s you see a quick preview of your site as you are designing it. Because it is
integrated in to the FrontPage interface, there is often no need to open an additional browser
window.

 Folders. A look at your entire site through an interface similar to Windows Explorer. Folder
view supports drag and drop and most other Windows Explorer related features. Folders view
should not be confused with the Folder list described later in this chapter.

 Remote Web Site. Similar to Folder view but shows your site as compared to the remote
Web site. Enables you to examine the two sites side by side.

 Navigation. If you want to have FrontPage maintain the site navigation structure, this view
both presents the structure as well as provides simple manipulation options.

 Reports. FrontPage provides a number of reports about site status and traffic that can be
accessed directly through FrontPage. These reports give the developer both a high-level view
of the site and the means to quickly fix whatever problems the reports identify.
19 | P a g e
  Hyperlinks. This unique tool gives you a bird's eye view of how your Web site links to files
that are internal and external. How every file relates to every other one can be examined, and
broken links are clearly identified.

 Tasks. If you use the task management system built in to FrontPage, you can access it
directly through the FrontPage interface using the Tasks view.

HTML and DHTML.

HTML (HyperText Markup Language) is the standard markup language for creating websites. It
defines the structure of a web page with various defined basic elements or tags. Here’s a basic
example of an HTML page:

<!DOCTYPE html>
<html lang="en">
<head>
<title>Page Title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
Body
{
font-family: Arial;
Helvetica, sans-serif;
}
</style>
</head>
<body>
<h1>My Website</h1>
<p>A website created by me. </p>
</body>
</html>

DHTML (Dynamic HTML) is not a markup or programming language but a term that combines the
features of various web development technologies for creating dynamic and interactive web
pages. DHTML consists of the following four components or languages:

 HTML 4.0: Defines the structure of a web page with various defined basic elements or tags.
 CSS (Cascading Style Sheet): Allows the web users or developers to control the style and
layout of the HTML elements on the web pages.
 JavaScript: A scripting language done on the client-side. DHTML uses JavaScript
technology for accessing, controlling, and manipulating the HTML elements.

20 | P a g e
  DOM (Document Object Model): A W3C standard, which is a standard interface of
programming for HTML. It is mainly used for defining the objects and properties of all
elements in HTML.

DHTML is used for designing animated and interactive web pages that are developed in real-time.
It allows the authors to add effects on their pages, create browser-based action games, and add
tickers on various websites, which need to refresh their content automatically.

Remember, if you’re new to HTML and DHTML, it’s recommended to start with HTML and CSS
before moving on to more advanced topics like JavaScript and DOM.

21 | P a g e
Important Questions

Q.1.Difference between HTML and DHTML

Ans. Following table describes the differences between HTML and DHTML:

HTML (Hypertext Markup DHTML (Dynamic Hypertext Markup

language) language)

1. HTML is simply a markup language. 1. DHTML is not a language, but it is a set of

technologies of web development.

2. It is used for developing and creating 2. It is used for creating and designing the
web pages. animated and interactive web sites or pages.

3. This markup language creates static 3. This concept creates dynamic web pages.
web pages.

4. It does not contain any server-side 4. It may contain the code of server-side
scripting code. scripting.

5. The files of HTML are stored with the 5. The files of DHTML are stored with the
.html or .htm extension in a system. .dhtm extension in a system.

6. A simple page which is created by a 6. A page which is created by a user using

user without using the scripts or styles the HTML, CSS, DOM, and JavaScript
called as an HTML page. technologies called a DHTML page.

7. This markup language does not 7. This concept needs database connectivity
need database connectivity. because it interacts with users.

22 | P a g e
Q.2. Describe various Phases of Planning and Designing Web site.

Ans.
1. Purpose (or objective) of website: - The first step of planning your website is to
identity the purpose of the site. Your objective should focus on what the basic
requirement of our customers and how can your website assist them. Therefore, a clear
purpose of the website can give you’re the fuel to construct a website. Purpose of
website could be as follows:
 To educate people
 To entertain people
 To promote/sell a product
 To provide information regarding admission procedure in a College/University
 To promote information on companies, products and sources, sports and games,
travel and tourism, medicines and health.
2. Target Audience: - The next step is to “Identify the target audience”, their knowledge,
background, interests and needs age, gender, geographic location etc. Your audience
or visitors will visit your site for a specific reason and you need to understand the
requirements of your visitors. You need to hold the attendention of your visitors so that
they will stay longer in your site. If the website is likely to have visitors who access from
home, then users will have probably slow modem connections. On the other hand, if
visitors expected to be fans to music, then high-end technology such as Macromedia
Flash, Animation with sound effects may be acceptable.
3. Choosing the contents:-Once the purpose and target audience of the website and
defined properly, organize the website contents, put together any existing documents
and pictures you want to work. For example, if it is a company website, you may want to
assemble company information, and product descriptions. Content management is an
integral part of any website. Your visitor judges you through the glasses of content and
technology used. Website content might be :
h. Who you are?
i. What you do?
j. How to contact you?
k. List of services and products.
l. Assemble photographs and logos.
m. Updating of text and other content to keep site fresh and content correct.
n. Building necessary content then organizing it according to the visitors need is a major
step in website planning.
Characteristics of web content:
 Contents should be crisp and brief
 Contents should be will edited
 Contents should accomplish target audience objectives
 Content should be lucid and attractive
 Content should not be ambiguous.

4. Storyboarding (or blue print of a website):- In storyboarding, you make a site map of
your website. Storyboarding creates a visual portrayal of the web pages. There are
different ways of making a storyboard for any website. It basically depends on the
content and the pages involved in the website. Storyboard is like a “script writing” in
23 | P a g e
 which the text as well as graphics data is sequenced properly. As the information will be
spread in multiple pages it will be essential to have a proper sequence of webpages and
define hyperlinks to those page.
Steps for storyboarding are:
 First, define the purpose of webpage or site you will be creating and who will be the
audience.
 Divide the document into the main topics and group the relate information under a single
topic.
 Prepare a rough outline of each of the pages including the home page or start page.
 For each page provide the following information :
h. Title of the page
i. The main heading
j. All subheadings
k. Purpose of page
l. Description of contents
m. Image types
n. Description of all Hyperlinks
5. Directory Structure Of the website

For better management of the site, it would be better to create a directory structure for your site,
where the website contains all the files put under one directory. This may hold some sub-
directories containing related items like you can have sub directories of images or picture, sound
clipping. So breakdown your site into different categories and store concerned files inside.

6. Budgeting
It is very important to find the cost involved for the development of a website. Consider the
following things while doing the budgeting.

 Salaries and benefits of development and support staff

 Cost of Hardware and software needed.
 Cost of Server and technical support
 Cost of name and registration
 Cost of Service Provider
 Cost of Search Engine Registration
Q.3. Write a short note on ISP.

Ans. An Internet Service Provider (ISP) is an organization that provides services for accessing,
using, managing, or participating in the Internet. ISPs can take various forms, including
commercial, community-owned, non-profit, or privately owned entities1. Here are some key points
about ISPs:
1. Services Provided by ISPs:
o Internet Access: ISPs offer connectivity to the Internet, allowing users to browse websites, send
emails, and access online content.
o Internet Transit: ISPs facilitate data exchange between different networks, ensuring global
connectivity.

24 | P a g e
o Domain Name Registration: ISPs help register and manage domain names (e.g.,
www.example.com).
o Web Hosting: Some ISPs provide hosting services for websites and web applications.
o Colocation: ISPs offer physical space for servers and networking equipment in data centers.
2. Historical Context:
o The Internet initially developed as a network connecting government research labs and university
departments.
o In the late 1980s, online service providers like CompuServe and Prodigy offered limited Internet
access.
o The first commercial ISPs emerged in Australia and the United States in 1989, providing direct
Internet access via dial-up connections.
o Cable TV companies and telephone carriers later offered broadband connections (cable modems,
DSL), dominating the market.
3. ISP Hierarchy:
o Tier-1 ISPs: These global providers do not pay for internet traffic. Examples include Level 3
Communications and Tata Communications.
o Tier-2 ISPs: Regional or country-level providers connect between Tier-1 and Tier-3 ISPs. They
charge for internet access.
o Tier-3 ISPs: Local providers serve specific areas and offer internet access to end-users.
4. Net Neutrality:
o Net neutrality concerns the equal treatment of internet traffic by ISPs.
o Municipal broadband is one solution to address net neutrality issues.

Q.4. Write a short note on Home Page.

Ans. The Home Page is the initial or main web page of a website. It serves as the entry point for
visitors and provides an overview of the site’s content and navigation options. Here are some key
points about home pages:
1. Purpose:
o The primary purpose of a home page is to welcome users and guide them to relevant sections of
the website.
o It sets the tone for the site, reflecting its brand, purpose, and design.
2. Content:
o Introduction: The home page typically includes a brief introduction to the website’s purpose,
mission, or services.
o Navigation: It provides links to other important pages within the site (e.g., About Us, Services, and
Contact).
o Featured Content: Home pages often showcase featured articles, products, or promotions.
o Search Bar: A search bar allows users to find specific content quickly.
o Visual Elements: Images, videos, and graphics enhance the visual appeal.
3. Design Considerations:
o Simplicity: A clutter-free design ensures easy navigation.
o Responsive: Home pages should adapt to different devices (desktop, tablet, mobile).
o Call to Action: Encourage users to take specific actions (e.g., sign up, explore, shop).
o Load Time: Optimize for fast loading to retain user interest.
4. Best Practices:
o Clear Branding: Display the company logo prominently.
o Hierarchy: Organize content logically, with important information above the fold.

25 | P a g e
o Contact Information: Include relevant contact details.
o Updates: Keep the home page fresh by updating content regularly.

Q.5. Explain link in website.

Ans. A hyperlink, also known as a link, is an essential element in web development. It allows users
to navigate from one web page to another or access external resources like documents, images,
videos, and more. Here are some key points about hyperlinks:
1. HTML Links:
o In HTML, a link is created using the <a> (anchor) tag.
o The most important attribute of the <a> element is the href attribute, which specifies the link’s
destination (URL).
o The visible part of the link is called the link text.
o Example of creating a link to W3Schools.com:

HTML

<a href="https://www.w3schools.com/">Visit W3Schools.com!</a>

2. Target Attribute:
o By default, linked pages open in the current browser window/tab.
o You can specify a different target for the link using the target attribute:
 _self: Opens in the same window/tab (default).
 _blank: Opens in a new window or tab.
 _parent: Opens in the parent frame.
 _top: Opens in the full body of the window.
o Example with a new browser window:

HTML

<a href="https://www.w3schools.com/" target="_blank">Visit W3Schools!</a>

3. Absolute URLs vs. Relative URLs:

o Absolute URLs use the full web address (e.g., https://www.example.com).
o Relative URLs refer to pages within the same website (e.g., /about.html).
o Example:

HTML

<!-- Absolute URLs -->

<a href="https://www.w3.org/">W3C</a>
<a href="https://www.google.com/">Google</a>

<!-- Relative URLs -->

<a href="html_images.asp">HTML Images</a>
26 | P a g e
 <a href="/css/default.asp">CSS Tutorial</a>

4. Using Images as Links:

o You can use an image as a link by placing the <img> tag inside the <a> tag:

HTML

<a href="default.asp">
<img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;">
</a>

5. Link to an Email Address:

o To create a link that opens the user’s email program, use mailto::

HTML

<a href="mailto:someone@example.com">Send email</a>

6. Button as a Link:
o You can use an HTML button as a link with JavaScript:

HTML

<button onclick="window.location.href='https://www.example.com'">Click me!</button>

Q.6. what is DHTML?

Ans. Dynamic HTML (DHTML) is a technology that combines various web development
components to create dynamic and interactive web pages. Unlike traditional static HTML, DHTML
leverages the following key elements:
1. HTML (Hypertext Markup Language):
o HTML serves as the core component of DHTML.
o It defines the structure of web pages using tags and elements.
2. CSS (Cascading Style Sheets):
o CSS allows developers to control the style, layout, and appearance of HTML elements.
o With CSS, you can alter fonts, colors, spacing, and more.
3. JavaScript:
o JavaScript is a client-side scripting language.
o DHTML uses JavaScript to access, manipulate, and control HTML elements dynamically.
o It enables interactivity, animations, and responsiveness.
4. DOM (Document Object Model):
o The DOM represents the structure of an HTML document as a tree of objects.
o It provides a standard interface for programming interactions with HTML elements.
o Developers can use DOM methods and properties to modify settings, content, and behavior.

Q.7. What are the uses of DHTML?

27 | P a g e
 Ans:- Dynamic HTML (DHTML) has several practical uses that enhance web development and
user experience. Let’s explore them:
1. Creating Animated and Interactive Web Pages:
o DHTML allows developers to design web pages that come alive with animations, transitions, and
dynamic effects.
o Users can interact with elements like buttons, menus, and images in real-time.
2. Animating Text and Images:
o DHTML helps users animate text and images within their documents.
o Whether it’s a subtle fade-in effect or a lively slideshow, DHTML brings visual dynamism to web
content.
3. Adding Effects:
o Developers can add visual effects to web pages using DHTML.
o Examples include hover effects (changing colors when the mouse hovers over an element),
smooth transitions, and fading elements in or out.
4. Dropdown Menus and Rollover Buttons:
o DHTML enables the creation of interactive dropdown menus and rollover buttons.
o Dropdown menus allow users to access subcategories or options, while rollover buttons change
appearance when hovered over.
5. Browser-Based Action Games:
o Yes, you read that right! DHTML has been used to build simple browser-based games.
o These games run directly in the web browser without requiring additional installations.
6. Auto-Refreshing Tickers:
o Websites that need to display live updates (such as stock prices, news headlines, or sports
scores) use DHTML to create auto-refreshing tickers.
o The content updates automatically without requiring manual page reloads.

Q.8. What are the feature of DHTML?

Ans. Dynamic HTML (DHTML) combines various web development technologies to create dynamic and
interactive web pages. Let’s explore its features:

1. Dynamic Page Creation:

o DHTML allows web pages to be generated dynamically based on user interactions or data.
o Web content can change without requiring full page reloads.
2. Dynamic Styling:
o Users can alter the font, size, color, and content of a web page dynamically using DHTML.
o Cascading Style Sheets (CSS) play a crucial role in achieving dynamic styling.
3. Event Handling:
o DHTML provides methods for handling user events (e.g., clicks, mouse movements).
o JavaScript, a client-side scripting language, enables interactivity.
4. Code Reusability:
o Developers can reuse DHTML components across different pages.
o This promotes efficient development and maintenance.
5. Data Binding:
o DHTML facilitates binding data to web elements.
o It ensures seamless synchronization between data and the user interface.
6. Dynamic Fonts:
o With DHTML, users can easily create dynamic fonts for their websites or web pages.
o Font properties can change dynamically based on user preferences.
7. Low-Bandwidth Effects:
o DHTML enhances web page functionality while using minimal bandwidth.

28 | P a g e
o It allows for smooth animations and transitions without excessive data transfer.

Q.9. What is DNS? Why is it use? How DNS is working?

Ans. DNS stands for Domain Name System. It allows us to interact with devices on the
Internet without having to remember long strings of numbers. Each computer on the
Internet has its own unique address, known as an IP address, just like every home has a
unique address for sending direct mail. 104.26.10.228 is an IP address consisting of four
sets of numbers extending from 0 to 255 separated by a period. It’s not easy having to
remember this complicated collection of numbers every time you want to access a
website, which is where DNS comes in handy.

DNS (Domain Name System) plays a crucial role in the functioning of the Internet. Let’s explore its
various uses:
1. Mapping Domain Names to IP Addresses: DNS translates human-readable domain names
(like nytimes.com or espn.com) into computer-friendly IP addresses (such as 192.168.1.1). This
translation allows web browsers to load internet resources efficiently 1.
2. Web Browsing: When you type a domain name into your web browser, DNS resolves it to the
corresponding IP address, enabling you to access websites.
3. Email Services: DNS helps direct messages to mail servers. It ensures that emails are delivered to
the correct recipient’s server.
4. Authentication and Validation: DNS validates emails and other services. It plays a role in ensuring
the authenticity of communication.
5. Content Delivery Networks (CDNs): CDNs use DNS to route users to the nearest server,
improving website performance by reducing latency.
6. Load Balancing: DNS can distribute incoming traffic across multiple servers, balancing the load
and preventing overload on a single server.
7. Creating Virtual Private Networks (VPNs): DNS is used to resolve domain names within VPNs,
allowing secure communication.

How DNS Works:

 Imagine you want to load a webpage, say example.com.

 The process involves converting the hostname (like www.example.com) into a computer-
friendly IP address (such as 192.168.1.1).
 Just like a street address helps find a particular home, an IP address locates a specific Internet
device.
 The DNS resolution happens “behind the scenes” in your web browser without any direct
interaction from your computer.

Q.10. How to Relate Front Page to DHTML?

29 | P a g e
 Ans. Dynamic HTML (DHTML) is a powerful combination of technologies that enhances web
pages by making them dynamic, interactive, and visually appealing.
1. Understanding DHTML:
o DHTML combines several web development technologies:
 HTML: The core markup language that defines the structure of web pages.
 CSS (Cascading Style Sheets): Used for controlling the style and layout of HTML elements.
 JavaScript: A client-side scripting language that allows interaction and manipulation of HTML
elements.
 DOM (Document Object Model): A standard interface for programming HTML elements.
2. FrontPage and DHTML:
o Microsoft FrontPage, a popular web authoring tool, allows you to create and manage web content.
o To incorporate DHTML effects in your FrontPage-created pages:
 Open the DHTML Effects toolbar by selecting View » Toolbars » DHTML Effects.
 Choose an element on your page (e.g., a paragraph, hyperlink, or image) that will trigger the
action.
 The DHTML toolbar options become active once you select an item on the page.
 You can then apply dynamic effects like animations, rollovers, and other interactive behaviors.
3. DHTML Features:
o Dynamic Style: Modify font, size, color, and content dynamically.
o Event Handling: Use events, methods, and properties to create interactivity.
o Code Reusability: Leverage JavaScript for efficient development.
o Data Binding: Enhance web page functionality with low-bandwidth effects.

30 | P a g e