PROJECT REPORT

ON
SOFTWARE LAB

MATA GUJRI COLLEGE, FATEHGARH SAHIB

Submitted to: - Submitted by: -

Prof.NAVDEEP Singh RANWINDER SINGH

ROLL NO.:6459

CLASS:MBA2ND

REPORT Page 1
 Introduction:

This session provides a knowledge of the HTML language, its history

and what are the elements which make a webpage meaningful.

After going through this, the students will be able to understand the

difference between a programming language and a Markup Language.

2.0 What is HTML?

H-T-M-L are initials that stand for HyperText Markup Language. Let us

now break it down :

Hyper: is the opposite of linear. Initially the computer programs had to

move in a linear fashion. HTML does not hold to that pattern and

allows the person viewing the World Wide Web page to go anywhere,

any time they want.

Text: is what you will use i.e english letters.

Mark up: is what you will do. You will write in plain English and then

mark up what you wrote.

Language: the language is plain English.

In other words, HTML is not a programming language. Instead, HTML is
used to define and classify different parts of your webpage according
to their function –in other words indicating which part is the title of the
document, which part is a subheading, which part is the name of the
author and so on.

3.0 The Components of HTML

The HTML document is composed of the following components:

 Tags
 Attributes
Tags and attributes work together to identify different document parts
& tell the browser how to display them.

Tags identify document parts by specifying that a chunk of information

be displayed as a paragraph or that another chunk of information be
displayed as a heading.

Attributes are optional parts of tags and modify or more thoroughly

specify information in tags such as color, alignment, height, or width.

4.0 A short History of HTML and the World Wide Web

The evolution of HTML involved more than changes to the tags and
attributes. You’ll see that its variety of uses and resulting popularity
have changed the nature of HTML from functional information resource
to a marketing tool. HTML did not evolve as an entity on its own; it
took the efforts of many people to bring the technology to what it is
today.
Physicists at CERN (Centre European pour la Recherche Nucleaire) , a
European particle physics laboratory, needed an easy way to share
information over their network. In 1980, Tim Berners-Lee developed
the initial program that allowed paes to links to one another. A decade
later, development moved into the realm of text-only hypertext
browsers, and the World wide web was born. In 1992, CERN maade the
system and he software available to the rest of the world through the
Internet.

At that time, the Internet was used primarily for academic research
and so the fledgling Web was extended to other academic research
centers and universities throughout the world, including the National
Center for Supercomputing Applications (NCSA) at the University of
Illinois at Urbana-Champaign. The World Wide Web (with a hyphen) was
named in late 1990 by Berners –Lee.

5.0 Understanding Basic HTML Tools

For your first documents, you need only two basic tools: an HTML
editor and a web browser.

 An HTML editor is the program you use to create and save your
HTML documents.
 A Web Browser is the program you use to view and test your HTML
documents.
6.0 HTML Editors

In general, the HTML editors fall into two categories:

1. Text- or code-based, which allow you to see the HTML code as

you’re creating documents.
2. WYSIWYG (What You See Is What You Get), which show the results
of code, similar to the way it will appear in a browser, as you’re
formatting your document.

6.1 Using the Text Editor to write an HTML document.

You will write the HTML document on the word processor, like
Notepad, WordPad etc. When you are finished creating the HTML
document, you'll then open the document in a browser, like Netscape
Navigator. The browser will interpret the HTML commands for you and
display the Web page.

Let's get into the programs you will use to write your HTML document.
Keep this in mind: HTML documents must be text only. When you save
an HTML document, you must save only the text, nothing else.

When you use NotePad, WordPad etc. the file is saved in text-only
format without your doing any additional work.

The Word Processor

When you write to the word processor you will need to follow a few
steps:

1. Write the page as you would any other document.

2. When you go to save the document , always choose SAVE AS.

3. When the SAVE AS box pops up, you will need to save the page in a
specific format. Look at the SAVE AS dialogue box when it pops up:
Usually at the bottom, you find where you will be able to change the
file format.

4. If you have a PC, save your document as ASCII TEXT DOS or just
TEXT. Either one will work.

NotePad, WordPad, and SimpleText already save in text-only format so

if you use one of them as your word processor, you'll get the correct
format simply by saving your document.

7.0 How To Name Your Document

What you name your document is very important. You must first give
your document a name and then add a suffix to it. That's the way
everything works in HTML. You give a name and then a suffix.

Follow this format to name your document:

1. Choose a name like abc.

2. Add a suffix. For all HTML documents, you will add either ".htm"
or ".html".

".html" tells the computer that this file is an HTML document. When we
get into graphics, you'll see a different suffix. All files used on the Web
will follow the format of "name.suffix." Always.

8.0 Opening the Document in the Browser

Once you have your HTML document on the floppy disc or your hard
drive, you'll need to open it up in the browser. It's easy enough. Follow
the steps along.
1. Under the FILE menu at the very top left of this screen, you'll find
OPEN…..

2. Click on it. The following dialog box appears in which you must
type in the HTML filename & then click OK.
The browser will now display the file on the screen.

9.0 How to look at the source code of an HTML document

from the browser window ?
Here's how you look at an HTML document (known as the "source

code"):

1. When you find a page you like, click on VIEW at the top of the

screen.

2. Choose DOCUMENT SOURCE from the menu. Sometimes it only

reads SOURCE.

3. The HTML document will appear on the screen with the HTML

source code.
10.0 Elements of a good Web page design

A good web page must include the following four processes:

1. Planning
2. Organizing
3. Creating
4. Testing

10.1 Planning Documents

HTML focused on making information easily available. The resulting

World Wide Web and corporate intranets were primarily used to
provide information to those who needed it. In this manner, HTML was
visitor-centered, that means authors focused on determining what
their audience wanted and then provided that information.
However, as Web Technologies became popular, they evolved into a
marketing tool for millions of companies, organizations and
individuals worldwide. Rather than strictly providing information,
the purpose of many websites is now to tell the visitors what the
company wants them to know, to persuade them to purchase a
product or service, and to keep them coming back to more. As a
result, HTML development has now shifted now to being
simultaneously visitor-centered and author-centered. Now, you not
only need to consider what your visitors want to know, you also
need to consider what information your organization wants to
provide.
Therefore before starting to produce the HTML documents, you
need to do some planning. You need to determine what your visitors
want and what your organization wants to provide.
What Do Your Visitors Want?
 Whenever a visitor visits a website, he normally has a specific
interest in that. So during the planning phase of a website, you must
think about what visitors are expecting to see at your site. To know
about this in detail, you can start with your customers needs. For
Example, they might want a general information about you, your
company, or our products and services. Or they might want
information about the contact names, troubleshooting advice, safety
information, prices, schedules, order forms and so on.
So the developer of a website must list out the vistors needs in the
planning phase.

What Do You Want to Provide?

You must figure out what you want to include. For this you must
take a look at the materials you already have in hand. For Example,
marketing materials often include information about the company,
products, and services suitable for use on a Website.
If you don’t have access to marketing materials, ask yourself a few
questions:
(i) What do I want people to know about my organization? What is
the corporate mission statement? What are my company’s
goals?
(ii) What are my company’s products or services? How do they
help people use them?
(iii) How do customers order our products?
(iv) Is repair history or safety information so positive that I want to
publicize it?
(v) Can I include product specifications?
(vi) Do I want to include information about employees? Do their
skills and experience play a big role in how well our products
are made or sold?
(vii) Can I provide information that is more timely, useful or
effective than other marketing materials such as brochures or
pamphlets, provide?
After you answer these and any other questions that are helpful in your
situation, you should be able to develop a list of what you want to
provide.
NOTE: Getting a consensus before you start to build a website is
always a good rule to follow.

Planning for Maintenance

Although maintaining your documents after you create them and

throughout their existence on your site is a separate phase in the
lifecycle of documents, you also need to include maintenance in the
planning phase. This is particularly the case if you answer yes to any
of the following questions:
 Will more than one person be involved in developing the content?
 Will more than one person play an active role in maintaining the
site?
 Will your site include more than about 20 HTML documents?
 Will you frequently add or modify a significant number of pages- say
more than 20-25 percent of the total number of documents.

Planning for Content Maintenance

If you depend on others for the content, you need to make
arrangements at the outset for how you will obtain updates. Will
content providers actually develop and update the Web pages, or
will they simply send you new information via e-mail? You need to
plan accordingly. Planning now how you will handle content
revisions and updates will save out time and grief later.
Planning for Site Maintenance
Regardless of whether you or someone else will maintain the site
you develop, you need to carefully document the development
process and include the following information:
(a)The site’s purpose and goals.
(b)The process where you determined content
(c)Who provides content?

Documenting the development process will help those who maintain

the site to keep everything up-to-date.
10.2 Organizing your Documents
After you decide what information to include in your site, you need
to determine how you will arrange individual HTML documents.
There are three types of Organization at your disposal:
1. Hierarchical
2. Linear
3. Webbed

10.3 Creating Documents

Create a Master document

A master HTML document contains the necessary structure tags as
well as general document format you want to use. When you create
a master HTML document, you establish the look of the site before
you start adding content. Include the elements that you want to
appear on every page such as the following:
 The background
 Repeating images
 The corporate logo
 Icons
 Footer Information

Placing these elements in the master document will help you

develop them only once, and not every time you start a new
document.
Select Images
Determine which images or illustrations are available before you
start developing individual pages. Having an idea of what images
you want to include will help you determine page layout and you
can avoid rearranging pages later.

Create Important Pages First

Websites, by nature, are always “ under Construction”. You’ll find
that you’re constantly updating content, adding new pages, or
removing pages. If you create a few of the important pages first,
test them and publish them, you can eliminate the task of polishing
 many pages later. You can then add and modify pages as needed
after you create an initial few.

10.4 Testing Documents

Testing an HTML document involves viewing your documents in

multiple browsers with a variety of system settings. The purpose is
to see how your documents will appear to your visitors, to check
readability and usability and to root out any layout or formatting
problems.
You’ll want to test for those issues on your local computer before you
publish your pages on the WWW or on the intranet. In doing so, you can
get the general idea of what your visitor is likely to see.

HTML BASIC PAGE STRUCTURE

1. All normal web pages consist of a head and body .

2. The head is used for text and tags that do not show
directly on the page.
3. The body is used for text and tags that are shown
directly on the page.
4. All pages have an <html> tag at the beginning at the
end, telling the browser where the document start and
where it stop.
5. The most basic code :
<html>
<head>
<this section is for the title and technical info of the
page >
 </head>
<body>
< this section is for all that you want to show on the
page >
</body>
</html>

HTML TABLES INTRODUCTION

Tables are used on websites for many purposes:

1.The obvious purpose of arranging information in a table

2.The less obvious but more widely used – purpose of

creating a page layout with the use of hidden tables.

3. dividing the page into separate section.

4.Creating menus

Typical with one color for the header and another for the
links
 HTML BASIC TABLES

1.<table>

</table>

2.To add rows to your table use the <tr> and </tr> tags.

<table>

<tr></tr>

</table>

3.you can divide rows into column with<td> and </td> tags

<tr><td>this is row one ,left side </td> <td> this is row one
right side.

</td></tr>
 PROGRAMS OF HTML

PROGRAME OF MY HOMEPAGE

INPUT
OUTPUT
PROGRAM TO SHOW THE USE OF FORMATING TAGS

PROGRAM

INPUT
output
PROGRAM OF DISPLAY THE USE OF HEADERS

PROGRAM

INPUT

OUTPUT
This show that h1 is the biggest font in html and ongoing is
smaller and use of headers.

PROGRAM TO SHOW USE OF ORDERED LIST

PROGRAM

INPUT
OUTPUT
PROGRAM TO SHOW USE OF UNORDERED LIST

PROGRAM

OUTPUT
PROGRAM TO SHOW THE USE OF TABLE.

PROGRAM
OUTPUT
PROGRAM TO SHOW USE OF ROW SPAN

PR0GRAM
OUTPUT
PROGRAM OF INSERT AN IMAGE INTO A DOCUMENT

PROGRAM

INPUT
OUTPUT
PROGRAM OF MARQUEE

PROGRAM

INPUT
OUTPUT

IF we apply marquee command on the document than the

heading or any line on which marquee command attempt is
scroll here and there .
PROGREM OF MY PROFILE

INPUT
OUTPUT
PROGREM OF MY STREGTH

INPUT
OUTPUT
PROGREM OF CAREER ASPIRATION

INPUT
OUTPUT
 PROJECT
ON

JAVASCRIPT
INTRODUCTION ABOUT JAVASCRIPT

What is Java script

JavaScript is a simple, relatively easy to use programming

language for web pages. It gives you way to add
interactivity to your web pages. With JavaScript you can
transform your web pages from static displays to pages
that react to and process information from those who
view your pages . It does not require lot of programming
skill on your part to get started. You can pick up the
basics of JavaScript in a short time.
HISTORY OF HTML

JavaScript was released by Netscape in 1995 under the

name LiveScript. Netscape’s purpose for developing
LiveScript was to extend the capabilities of static HTML
pages and to offload data processing from busy web
servers onto local computers running web browsers. After
JAVA was released by Sun Microsystem and gained
recognition, the name LiveScript was changed to
JavaScript.

Microsoft recognized the importance of JavaScript and

entered the arena with two creations , Jscript and
VBScript . Jscript is roughly compatible with JavaScript .
VBScript is a subject of visual Basic .

These competing language have created problem for web

developers. Microsoft , Netscape and other finally agreed
to support a vendor-netural standard

WHY USE JAVASCRIPT

1. JavaScript offers a programming language for web
pages that most anyone can use.

2. JavaScript is becoming a standard for web page

programming. This mean you are more assured that your
work will not soon disappear. There are thousand of web
sites that use JavaScript today .

3. JavaScript makes your web pages come alive by

responding to things a user done on your page.

4.JavaScript is ideal for form validation. Sometimes may

want your users to enter a specific type of data(e.g. phone
number) into a form field. If it is important that this data
conform to a certain format, you can use JavaScript to
validate the data on the user machine before it is forward
to the server.

5. JavaScript can open and close new browser windows

and you can control the appearance of the new window
you create. You can control their size, their location and
the toolbars they have available.

6. JavaScript can perform mathematical computations.

7. JavaScript can make your web pages look fresh and up

to date.

8. JavaScript can make your page cool. It is easy to get

carried away with this one.
 9. JavaScript is fun. There are lot of neat things you can
do with JavaScript which provide immediate visual
feedback.

PROGRAMS OF JAVASCRIPT

1.PROGRAM DISPLAY T ABLE OF 3

PROGRAM
OUTPUT
2.PROGRAM SHOW TABLE OF ANY NUMBER

PROGRAM

INPUT
OUTPUT
3. PROGRAM TO PRINT PYRAMID SERIES

PROGRAM

OUTPUT
4.PROGRAM TO REVERSE SERIES

PROGRAM
OUTPUT
5.PROGRAM OF Check Answer By Click

PROGRAM

Output
6.PROGRAM OF COLOUR DISPLAY

PROGRAM

OUTPUT
7.PROGRAM SHOW QUIZZ

PROGRAM
OUTPUT

8.PROGRAM OF STAR DISPLAY

PROGRAM
OUTPUT

9.PROGRAM OF DISPLAY NAME BY USER

PROGRAM
OUTPUT

PROGRAM OF BIRTH DATE:

INPUT
OUTPUT
PROGRAME OF MATCH ROUND

INPUT
OUT PUT
PROGRAME OF CALCULATOR

INPUT

OUTPUT