Lab Manual

of

Static Web Page

Development
(3320703)

Semester – 2

Government Polytechnic, Ahmedabad

Programme :Diploma in Computer Engineering

Name of Student :

Shift Division :

1| P age S t a t i c w e b p a g e d e s i g n i ng
 Static Web Page Development (3320703) 1|Pag e

2| P age S t a t i c w e b p a g e d e s i g n i ng
3| P age S t a t i c w e b p a g e d e s i g n i ng
 GOVERNMENT POLYTECHNIC, AHMEDABAD COMPUTER ENGINEERING DEPARTMENT

CERTIFICATE

This is to certify thatMr./Miss

of _ class , Semester , Enrollment No.

has satisfactorily completed his/her term work in Static

Web Page Development (3320703) for the term ending in

Date of Submission: - / /

Mr. Alpesh Thaker Prof. H. J. Baldaniya

(Course in Charge) Head of the Department

4| P age S t a t i c w e b p a g e d e s i g n i ng
 Static Web Page Development (3320703) I|Page

5| P age S t a t i c w e b p a g e d e s i g n i ng
 Government Polytechnic, Ahmedabad

INDEX
Sr. Page
No. Practical Name Marks Date Sign
No
1 Study about basics of website concepts.

2 Study about web site development process.

Analyze five websites on terms of usability and

accessibility terms from below domains.
• Educational
3 • Railway Reservation
• Airline Reservation
• Cinema Ticket Booking
• E Commerce
Develop an HTML document for a web page of your
favorite National Leader. Design the page with an
4
attractive color combination, with suitable headings
and horizontal rules.
Develop basic HTML pages Table format to print your
5 Bio-Data.

6 Develop basic HTML form for registration.

7 Develop basic HTML to display student result.

Develop a complete web page using Frames and
8
Frameset which gives the Information about Hospital.
9 Explain various features of Dreamweaver interface
Setup basic site which provide information of your id
10 card with Dreamweaver.
Develop a webpage using CSS Selectors and
11 embedded Style sheets in Dreamweaver.
Style your admin template with help of CSS in
12 Dreamweaver.
Create proper “Menus” to navigate to the pages of
13 your website on the home page using only html and
Create “Home Page” of WEBSITE OF GTU using
14 html and CSS
Create “About US” Page of WEBSITE OF GTU using
15
html and CSS
Create “Contact US” Page OF GTU using html and
16 CSS.

6| P age S t a t i c w e b p a g e d e s i g n i ng
 Static Web Page Development (3320703) II | P a g e

7| P age S t a t i c w e b p a g e d e s i g n i ng
 Create a page to display “Student Activities” of
17 WEBSITE OF GTU using html, CSS and appropriate
Create a page to display “Feedback” of WEBSITE OF
18 GOVERNMENT POLYTECHNIC COLLEGE using
Create a page to display “FAQ” of WEBSITE OF
19 GOVERNMENT POLYTECHNIC COLLEGE using
Host your website on a free domain. Note down your
20 URL and completely present snapshots of your “live

8| P age S t a t i c w e b p a g e d e s i g n i ng
 Static Web Page Development (3320703) III | P a g e

9| P age S t a t i c w e b p a g e d e s i g n i ng
10 | P age Staticwebpagedesignin g
 1 Study about basics of website concepts.

Exercise: (WRITE DOWN ANSWER FOR ALL

QUESTIONS)

1. Briefly explain web designing concepts.

Ans:- Web designing concepts:-
Web technology empowers both publisher
of content and the reader of that content. Web
designer's responsibility to convey the appropriate
message to reader, thus the concepts of design is
as important as the content itself.
Most Web site designers approach
development from a self-reflective point of view.
They are interested in presenting themselves to a
mass audience with the known descriptions of
mass publicity.
An effective Web site is much more than a
technological creation, where web users get useful
content in a way that is interesting and easy to
digest.
To accomplish these goals, you should begin the
development process by considering how you will present
your content to the users.
 2. What is web development team? Explain
different roles in web development team.
Ans:- web development team:-
Web development teams can consist of
hundreds of people (web developers). Smaller
organizations may only require a single permanent
or contracting webmaster, or secondary
assignment to related job positions such as a
graphic designer and/or information systems
technician. Web development may be a
collaborative effort between departments rather
than the domain of a designated department.
Most of have at least two teams which are
responsible for the performance of the website :-

Web development team (IT team) – is responsible for the

functional performance of the site.
Marketing team – is responsible for the business
performance of the site. Unfortunately, the
performances of these two objectives are frequently
misaligned.
The ideal website development team should consist of
people with the following roles.

Project Manager – a person in a team who will control the

 projects performed by your website development team.
Business Analyst - a person in a team who will
deal with customers and specify the direction to
the website project. This person should analyze
the requirements, work out the project strategy,
write documentation and lead the project to the
successful completion.
Website Architect – a person in a team who will
develop the design of the website product taking
into account customer’s requirements.
Designer – a creative person who is
responsible for product look-and-feel and
customer’s requirements.
Website Developer – a person in a team who will
develop the product. Website Developer should be
an expert in various spheres of website
development (mobile application development,
web application development) and should study all
the time to improve his knowledge and
competence.
Tester – a person who will test the website during the
course of website development.

3. Briefly explain role of Project manager.

Ans:- Project Manager:-
Project management is the discipline
of planning, organizing, motivating, and
controlling
resources to achieve specific goals.
Project management is accomplished through
the use of the processes such as:
• Initiation

• Planning

• Execution
• Controlling
• Closing
Project managers or the organization can
divide projects into above phases to provide
better management control with appropriate links
to the ongoing operations of the performing
organization. Collectively, these phases are
known as the project life cycle which we would
see in next chapter. Project managers deliver
projects while balancing the following constraints:
• Scope
• Schedule
• Quality
• Resources
• Customer Satisfaction
• Risk
These all are so intertwined that a change
in one will most often cause a change in at least
one of the others
 For example:
• If time is extended, the cost of the project
will increase.
• If time extended with the same cost then
quality of the product will reduce.
• If scope is extended then cost and time will
also extend.
Changes to any of these legs sets off a series
of activities that are needed to integrate the
change across the project.

4. Enlist different web page layout. Explain

Absolute Layout, Relative Layout and Fixed
Layout in detail.
Ans:- web page layout:-
One of the most variable aspects of web
design is the way in which we approach width
and height in terms of measurements and
flexibility.
For many years, we have rotated between
the benefits and pitfalls of using fixed, elastic,
and liquid measurements in a quest to give
optimal viewing experiences in highly varied
situations, while balancing our need to control
things in our web pages.
 Various types of web
layouts:- Absolute
Layouts
One of the least commonly used
methods of measurement employed in web
design is absolute measurement (i.e. inches,
cm, mm and picas). Absolute units and
positioning is traditionally found in print media,
which natively use these units of
measurement.
The conversion of print to web format
can be seen in word processing software such
as Microsoft Word, which still uses these
conventions when formatting text and sizing
the dimensions of a document in order to make
it appear as close as possible to printing on
paper.

Absolute layouts have limited use in web designs.

A use for absolute layouts on the web is for PDF
documents where content remains static. Used where
user wants to utilizes printer-friendly stylesheets. The
absolute measurements of cm, mm, inches, and pt can
help you prepare a page layout for printers more
accurately.

Relative Layout
Relative positioning and layouts adjust
in size depending on the size of the user’s
browser viewport.
 The area inside the red border is the
browser’s viewport. You can change the size of
the viewport by resizing the window. Different
monitor sizes have various maximum sizes for
the view port. Very few sites make use of 100%
widths, but it does work.
Fixed Layout
Commonly regarded as one of the least
flexible methods of laying out a web design, the
use of pixel- based measurements has almost a
digital resonance associated with it that transfers
across from the print industry, in that the medium
relies on fixed/static measurements.

This unit of measurement is accurate and

leaves little guessing as to how a web design will
appear across different web browsers and has
become exceptionally popular among sites that
favors control and predictability over optimizing
the layout for the audiences’ particular viewing
situation. A fixed width layout is used on Six
Revisions.
We all know that problems can arise
from having to scroll in all sorts of directions, and
the fixed measurement of a px-based layout has
this general issue in spades.

While many people seek out some sort of

ideal width to ensure maximum compatibility, it’s
worth mentioning that if you use a lot of elements
that require fixed layout rules like non- repeating
background images or borders with other non-
relative elements, fixed measurement layouts
can do the job well and act as the best all-around
solution.

And many more namely Elastic layout,

Scaled Layout, Liquid (or Fluid) Layout, Equated
Layout, Fluid-Min/Max Layout, Conditional
Layout, Hybrid Layout, etc.

5. Explain basic web page

elements. Ans:-
A basic web page has four main elements:-
• Hypertext Markup Language
• Text
• Graphics
• Links

Hypertext Mark-up Language

• Hypertext Markup Language is the
code that browsers use to "read" a
web page. A web page is a Hypertext
Markup Language document.
• Hypertext Markup Language documents are
saved with the file extensions .html or .htm
 • When you save your web page in
Composer, the .html extension will
be automatically added.

Link
• Links (also called hypertext) are connectors.
• Both text and graphics can be linked.
• Links are usually used in three ways:
o Links can connect different parts of one long
web page. You can do this in Composer by
creating "Targets."
o Links can connect your web page to someone
else's web page.

6. What is Browser? Enlist name of different

browsers used. Ans:-
Browsers - program that display websites
Is the generic term for a computer
program one uses to surf (browse) the Internet
(example: Internet Explorer, Netscape Navigator).
Browsers are the "interface" through which people
view websites on their own computers.
Examples of popular browsers are Chrome,
Internet Explorer, Firefox, Safari, and Opera.
Each browser has a navigation toolbar, like the
 ones shown below that help also illustrate how the
Internet browser toolbar has changed over the
history of Internet browsers. This navigation bar is
the most essential portion of the browser and will
always at least contain the Back arrows and
address bar.
7. Why web graphics is important in web
design? Ans:-
Visitors are more likely to consider your content
worthy of reading if the overall website gives an
appearance of authority on the subject. Finally, good
graphic design increases the usability of your site. Web
visitors often have little patience for complex or confusing
sites and will move on fairly quickly.

8. What Is Web-Based Multimedia?

Give Advantages and Disadvantages of
Using Web- Based Multimedia.
Ans:-
Web-Based Multimedia applications:-
• Information delivery: Photos of
products, video clips, animation to
convey concepts, etc.
• E-commerce: Photos of products,
samples of movies and music, etc. Can
use virtual reality (VR) to convey three-
dimensional views of products, homes
for sale, etc.
 • Entertainment: Online games, video clips,
online music, interactive activities, etc.
• Web-based training (WBT): Delivering
instruction via the web

Advantages and Disadvantages of Using

Web-Based Multimedia Advantages:
• Contents are more interesting,
easy understandable and
enjoyable
• Can address a variety of learning styles
– Visual learners
– Auditory learners
– Kinesthetic learners
Many ideas are easier to convey
•
Disadvantages:
• Time and cost of development is high
• Compatibility and download time for Web-
based multimedia is high

9. Enlist different multimedia

elements. Ans:-
Multimedia Elements
Text: Used to supply basic content, as well as to
add text-based menus and hyperlinks Images or
graphics:
Digital representations of photographs, drawings,
charts, and other visual images Animation: A
series of graphical images are displayed in
succession to simulate movement
– Java applet: A small program inserted into a
Web page that performs a specific task
– Animated GIF: A group of GIF images
saved as an animated GIF file, inserted
in a Web page, which are displayed
successively to simulate movement
– For more complex animations,
developers can use JavaScript or
another scripting language
Flash is in particularly wide use today
Silverlight is an alternative to Flash

Flash Lite used for mobile application development

– Multimedia authoring software can be

used to create multimedia elements
– Many Wed-based animations require a plug-in
Audio: All types of sound including music, spoken
voice, sound effects
Video: Begins as a continuous stream of
visual information, which is then broken into
separate images (frames)
 2 Study about website development process.

Exercise:-
1. Explain web site development process in
detail. Ans:-
The exact process will vary slightly from
designer to designer, but the basics are
generally the same.

1. Information Gathering
2. Planning
3. Design
4. Development
5. Testing and Delivery
6. Maintenance

Phase One: Information Gathering

The first step in designing a successful
web site is to gather information. Many things
need to be taken into consideration when the look
and feel of your site is created.
This first step is actually the most
important one, as it involves a solid understanding
of the company it is created for. It involves a good
understanding of you
– what your business goals and dreams are, and how the
web can be utilized to help you achieve those goals.
It is important that your web designer start
off by asking a lot of questions to help them
understand your business and your needs in a
web site.
Certain things to consider are:
• Purpose
What is the purpose of the site? Do
you want to provide information,
promote a service or sell a
product…?
• Goals
What do you hope to accomplish by
building this web site? Two of the
more common goals are either to
make money or share information.
• Target Audience
Is there a specific group of people
that will help you reach your goals? It
is helpful to picture the “ideal” person
you want to visit your web site.
Consider their age, sex or interests –
this will later help determine the best
design style for your site.
• Content
What kind of information will the target
audience be looking for on your site?
Are they looking for specific
information, a
 particular product or service, online
ordering…?

Phase Two: Planning

Using the information gathered from
phase one, it is time to put together a plan for
your web site. This is the point where a site map
is developed.

The site map is a list of all main topic

areas of the site, as well as sub-topics, if
applicable. This serves as a guide as to what
content will be on the site, and is essential to
developing a consistent, easy to understand
navigational system.
The end-user of the web site –your
customer – must be kept in mind when designing
your site. These are, after all, the people who will
be learning about your service or buying your
product. A good user interface creates an easy to
navigate web site, and is the basis for this.
During the planning phase, web designer
will also help in decide what technologies should
be implemented. Elements such as interactive
forms, ecommerce, flash, etc. are discussed
when planning your web site.

Phase Three:
Design
Drawing from the information gathered up to
this point, it’s time to determine the look and feel of
your site.
Target audience is one of the key factors
taken into consideration. A site aimed at
teenagers, for example, will look much different
than one meant for a financial institution. As part of
the design phase, it is also important to
incorporate elements such as the company logo
or colors to help strengthen the identity of your
company on the web site.

Your web designer will create one or more

prototype designs for your web site. This is typically a
.jpg image of what the final design will look like.
Often times you will be sent an email with the
mock-ups for your web site, while other designers
take it a step further by giving you access to a
secure area of their web site meant for customers
to view work in progress.
Either way, your designer should allow
you to view your project throughout the design
and development stages. The most important
reason for this is that it gives you the opportunity
to express your likes and dislikes on the site
design.

In this phase, communication between

both you and your designer is crucial to ensure
that the final web site will match your needs and
taste. It is important that you work closely with
your designer, exchanging ideas, until you arrive
at the final design for
 your web site.

Phase Four: Development

The developmental stage is the point where
the web site itself is created. At this time, your web
designer will take all of the individual graphic
elements from the prototype and use them to create
the actual, functional site.

During this designer should continue to

make your in-progress web site available to you
for viewing, so that you can suggest any additional
changes or corrections you would like to have
done.

On the technical front, a successful web

site requires an understanding of front-end web
development. This involves writing valid XHTML /
CSS code that complies with current web
standards, maximizing functionality, as well as
accessibility for as large an audience as possible.

Phase Five: Testing and Delivery

At this point, your web designer will
attend to the final details and test your web site.
They will test things such as the complete
functionality of forms or other scripts, as well last
testing for last minute compatibility issues
(viewing differences between
different web browsers), ensuring that your web
site is optimized to be viewed properly in the
most recent browser versions.
Once you give your web designer final
approval, it is time to deliver the site. An FTP
(File Transfer Protocol) program is used to
upload the web site files to your server. Most web
designers offer domain name registration and
web hosting services as well. Once these
accounts have been setup, and your web site
uploaded to the server, the site should be put
through one last run-through. This is just
precautionary, to confirm that all files have been
uploaded correctly, and that the site continues to
be fully functional.
This marks the official launch of your site, as it is
now viewable to the public.
Phase Six: Maintenance
The development of your web site is not
necessarily over, though. One way to bring
repeat visitors to your site is to offer new content
or products on a regular basis. Most web
designers will be more than happy to continue
working together with you, to update the
information on your web site. Many designers
offer maintenance packages at reduced rates,
based on how often you anticipate making
changes or additions to your web site.
 3 Analyze five website on terms of usability and accessibility for domains like Education,
Online Ticket Reservation, Banking or Finance, Engineering and Society, Online Shopping.

Ans:-

Web Site Usability and Accessibility

Usability and accessibility are two of the most

important components in successful website design.

Brief definitions:
Usability: making a website as simple and fast to
navigate as possible and presenting information /
products in an easily readable format

Accessibility: making the content of a website

available to everyone, including those with less- than-
perfect eyesight.

Analyze website on terms of usability and accessibility terms:-

Analyze website on the basis of given terms bellow and rate

every terms in form of
 1. Good
2. Needs work
3. Low

Accessibility terms:
1. Site Load-time is Reasonable. Better if it loads
page in a second. If a site takes forever to
load, most people will just leave.
2. Adequate Text-to-Background Contrast.
Right combination of dark & light color
makes content easily understandable
3. Font Size/Spacing Is Easy to Read
4. Flash & Add-ons Are Used Sparingly. How
much time it takes to load plug-in. Users
won't wait 5 minutes for a plug-in to load,
5. Images Have Appropriate ALT Tags
6. Site Has Custom Not-found/404 Page (if a page on site
doesn't exist)

Usability terms:
1. Is there any page about site for first-time user
2. Logo Is Prominently Placed
3. Any Tagline Makes Purpose of site Clear
4. Home-page is Digestible easily (In 5 Seconds).
5. Clear Path to Contact or Company Information
6. Main Navigation Is Easily Identifiable
7. Navigation Labels Are Clear & Concise
8. Company Logo Is Linked to Home-page
9. Links Are Consistent & Easy to recognize
10. Site Search Is Easy to Access
11. Major Headings Are Clear & Descriptive
12. Critical Content is Above the Fold (line where the
bottom of your screen cuts off a page)

Educational website : www.studyadda.com

Accessibilit
y
Goo
d
Goo
d
Need
work
Goo
d
Lo
w
Need
work
Usability
Goo
d
Goo
d
Need
work
Goo
d
Goo
d
Goo
d
Goo
d
Lo
w
Goo
d
Goo
d
 Need work
Lo
w

Online ticket reservation website : www.roadrail.com

Accessibilit
y
Goo
d
Goo
d
Lo
w
Goo
d
Lo
w
Goo
d
Usability
Goo
d
Goo
d
Need
work
Goo
 d
Goo
d
Need
work
Goo
d
Lo
w
Goo
d
Goo
d
 Need work
Goo
d

Banking or finances website : www.onlinebank.com

Accessibilit
y
Goo
d
Goo
d
Need
work
Goo
d
Goo
d
Goo
d
Usability
Goo
d
Goo
d
Need
work
Goo
d
Goo
d
Goo
d
Goo
d
 Lo
w
Goo
d
Goo
d
Goo
d
Need
work
Engineering and Society website :
www.futengineer.com

Accessibilit
y
Goo
d
Goo
d
Goo
d
Lo
w
Need
work
Need
work
Usability
Goo
d
Goo
d
Need
work
Goo
d
Goo
d
Goo
d
Need
work
Goo
d
Goo
d
Lo
w
Goo
d
Goo
d
Online shopping website : www.shoptwist.com

Accessibilit
y
Goo
d
Lo
w
Goo
d
Goo
d
Goo
d
Need
work
Usability
Goo
d
Goo
d
Lo
w
Need
work
Goo
d
Lo
w
Goo
d
Goo
d
Lo
 w
Need
work
Goo
d
Goo
d
4 Develop an HTML document for a web page of your favourite National Leader. Design the
page with an attractive colour combination, with suitable headings and horizontal rules.

Code:
<html>
<head>

<title>National Leader</title>
</head>

<body>
<table border="1" align="center" width=60%
bgcolor="#fffdd0">
<tr>
<th>
<h3 align="center"> Dr.B.R.Ambedkar</h3>

<center><imgsrc="C:\Users\student\Downloads\ambedkar.jpg"
width="200px" height="200px" /></center>
<br>

<table border="1" width=100%>

<h4 align="center">
Bhimrao Ramji
Ambedkar<br> Born: 14
April 1891 <br>
Died: 6 December 1956

<table border="1" width=100%>

<h2 align="left"><u>About Dr.B.R.Ambedkar</u></h2>
<h4 align="left"> Bhimrao Ramji Ambedkar, also known
as Babasaheb Ambedkar, was an Indian polymath -
philosopher, jurist, economist, politician, social reformer,
journalist, writer, sociologist, and anthropologist. He
inspired the Dalit Buddhist movement and campaigned
against social discrimination towards the untouchables.
</h4>

<table border="1" width=100%>

<h2 align="left"><u>Family Background</u></h2>
<h4 align="left">
Father Name:Ramji Maloji Sakpal<br>
Mother Name:Bhimabai Sakpal<br>
Wife Name:Savita Ambedkar(1948–1956) ,
Ramabai Ambedkar(1906–1935)<br>
Child Name:Yashwant Ambedkar<br>

</h4>

<table border="1" width=100%>

<h2 align="left"><u>Educational Qualification:</u></h2>
<h4 align="left">
University of Mumbai (B.A., M.A.)<br>
Columbia University (M.A., PhD)<br>
London School of Economics (M.Sc.,
D.Sc.)<br> Gray's Inn (Barrister-at-Law)<br>
</h4>

<table border="1" width=100%>

<h2 align="left"><u>Profession</u></h2>
<h4
align="left">
Jurist<br>
economist academic
<br> politician <br>
social reformer <br>
anthropologis
twriter<br>
</h4>

<table border="1" width=100%>

<h2 align="left"><u>Award</u></h2>
<h4 align="left">
Bharat Ratna<br>
(posthumously in
1990)
<h4>

<table border="1" width=100%>

<h2 align="left"><u>Known for</u></h2>
<h4 align="left">
Dalit rights movement<br>
Drafting Constitution of
India<br> Dalit Buddhist
movement<br>
</h4>

<table border="1" width=100%>

<h4 align="left">
Upon India's independence on 15 August 1947, the
new Congress-led government invited Ambedkar to
serve as the nation's first Law Minister, which he
accepted.
<h4>
</table>
</th>
</tr>
</h4>
</table>

</body>
</html>
Output:
 5 Develop basic HTML pages Table format to print your Bio-Data.

Code:
<!DOCTYPE html>
<html>
<head>
<title>BIO-DATA</title>
</head>
<body>
<table border="1" align="center" bgcolor="#3944BC"
width=60%>
<tr>
<th><h1>My BioData </h1></th></tr>
</table>
<table border="1" align="center" bgcolor="lightblue"
width=60%>
<tr>
<th align="left" bgcolor="lightgreen">Name</th>
<th align="left"> Dhruvik Tank</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Father Name</th>
<th align="left"> Rajeshbhai Tank</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Mother Name</th>
<th align="left"> Manjulaben Tank</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Date Of Birth</th>
<th align="left"> 22nd Oct 2001</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Gender</th>
<th align="left">Male</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Nationality</th>
<th align="left">Indian</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Address</th>
<th align="left">B-13, Sapna appartment, Thakkarnagar</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">City</th>
<th align="left">Ahmedabad</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Contect Number</th>
<th align="left">8000006273</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">State</th>
<th align="left">Gujarat</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Roll</th>
<th align="left">Student</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Study</th>
<th align="left">1st year Diploma</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Current Semester</th>
<th align="left">2nd sem </th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Branch</th>
<th align="left">Computer Engineering</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">College Name</th>
<th align="left">Government Polytechnic, Ahmedabad</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">10th pass year</th>
<th align="left">2017</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">10th Percentage</th>
<th align="left">58.5%</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Board</th>
<th align="left">GSEB</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Language Known</th>
<th align="left">English,Hindi,Gujarati</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Computer Skill</th>
<th align="left">Ms word, Power Point, Ms Excel</th>
</tr>
<tr>
<th align="left" bgcolor="lightgreen">Technical Skill</th>
<th align="left">c,HTML</th>
</tr>
</table>
</body>
</html>

OUTPUT :