You are on page 1of 130

Information

and Computer
Technology
Class IX

AUTHORISED
AUTHORISED
Mr. Siva Nagaraju
Mr.
SIVA NAGARAJU

Ongole Oxford Olympiad Schools


Near SSN Degree College, Mangamuru road, Ongole, Andhra Pradesh 523001

Foreword
Acknowledgement
Chapter 1: Basics of Internet

123

Introduction

World Wide Web

Web Servers

Web Site
Webpage

6
11

1 Tool Bar

12

Blogs

14

URL

17

Chapter 2: Web Services

2438

Introduction

24

Electronic mail or E Mail

24

Chat

27

Video Conferencing

28

E-Learning

30

E-Reservation

31

E-Shopping

32

Social Networking

33

E groups

34

Chapter 3: Introduction to GIMP

3957

Image Editing Tools-Introduction

39

List of commonly used Image Editing Tools


GIMP

39
41

Starting GIMP

43

Understanding GIMP window

47

Menus of Gimp window

50

Editing the Images

51

1 Layers

54

Chapter 4: Introduction to HTML

5869

Introduction

58

Overview of HTML

58

Structure of HTML document

60

Saving the HTML document

60

Container and Empty Tags

61

Chapter 5: HTML II

7095

Introduction

70

Image

75

LINKING

81

Chapter 6: Security Threats and Safety Measures

96108

Introduction

96

Viruses

96

Worms

97

Trojan horses

98

Spyware

98

Malware

99

Spams

99

Hackers and crackers

100

Anti Virus Tools

100

Data Backup and security

101

Chapter 7: Project
Sample Case Studies

109-130
110

Chapter 1

Basics of Internet
Learning Objectives
By the end of this chapter, learner will be able to:
Define the Internet.
List the features of WWW.
Differentiate between the Internet and WWW.
Understand the working of Search Engines.
List different types of servers with their purpose.
Understand the different components of a Website.
Appreciate the use of different protocols.
State the advantages & disadvantages of creating Blogging.

Introduction
Today we live in a world of technology, where internet spins a web of interconnectivity
around the globe. Through internet more than fifty million people in countries around the
world have been connected. Internet was evolved in 1969, under the project named
ARPANET(Advanced Research Projects Agency Network) to connect computers at
different universities and U.S. defence. Soon after the people from different backgrounds
such as engineers, scientists, students and researchers started using the network for
exchanging information and messages.
In 1990s the internetworking of ARPANET,
NSFnet and other private networks resulted into
Internet. Therefore, Internet is a global network
of computer networks. It comprises of millions of
computing devices that carry and transfer volumes
of information from one device to the other.
Desktop computers, mainframes, GPS units, cell
phones, car alarms, video game consoles, are
connected to the Net.

1. World Wide Web


1.1 History of World Wide Web
The World Wide Web was invented by Tim Berners-Lee in 1989, in 1995 the first
connection was established over what is today known as the Internet.
By the end of 1990, the first Web page was served. In April 1993, the World Wide Web
technology was available for anyone to use on a royalty-free basis.
Since that time, the Web has changed the world. It has perhaps become the most
powerful communication medium the world has ever known.
A global Web of computers known as the Internet, allows individuals to communicate
with each other often called the World Wide Web. The Internet provides a quick and easy
exchange of information and is recognized as the central tool in this Information Age.

1.2 Definition
The World Wide Web (WWW) is an internet based service, which uses common set of
rules known as Protocols, to distribute documents across the Internet in a standard way.
The World Wide Web, or Web is a part of the Internet. The Web is viewed through
web browser softwares such as Google Chrome, Internet Explorer, Mozilla Firefox etc.
Using browsers one can access the digital libraries containing innumerable articles,
journals, e-books, news, tutorials stored in the form of web pages on computers around
the world called Web Servers. Today thousands of web pages/websites are added to the
WWW every hour.

1.2 Difference between Internet and WWW


The Internet is known as interconnection of computer networks. The Internet is a
massive network of networks. It connects millions of computers together globally,
forming a network in which any computer can communicate with any other computer as
long as they are both connected to the Internet. Information that travels over the Internet
does so via a variety of languages known as protocols.
The World Wide Web, or Web for short, or simply Web, is a massive collection of
digital pages to access information over the Internet.
The Web uses the HTTP protocol, to transmit data and allows applications to communicate
in order to exchange business logic. The Web also uses browsers, such as Internet Explorer
2

Information and Computer Technology

or Firefox, to access Web documents called Web pages that are linked to each other via
hyperlinks. Web documents also contain graphics, sounds, text and video.

1.3 Search Engines


Search engines are the programs which are needed to extract the information from the
internet. They play a very important role in our daily routine, as today for each and every
information we are dependent on internet.
Web search engines work with the help of two programs, Spider which fetches as many
documents as possible. Another program, called an indexer, reads the documents and
creates an index based on the words contained in each document. Each search engine
uses an algorithm to create its indices such that, only related results for specified
keywords is stored and returns a list of the documents where the keywords were found.
A search engine works in the following order:
1. Web crawling: Web search engines work by storing information about many web
pages. These pages are retrieved by the program known as Web crawler - which
follows every link on the site. Web crawler may also be called a Web spider.
2. Indexing: Indexing also known as web indexing, it stores data to facilitate fast and
accurate information retrieval.
3. Searching: A web search query fetches the result from the web search engine
entered by the user to meet his information needs.
Few search engines available are as follows:

2. Web Servers
2.1 What is a Server?
A server is a computer that provides data to other computers. The entire structure of the
Internet is based upon a client-server model.
Web server helps to deliver web content that can be accessed through the Internet. The
most common use of web servers is to host websites, as the internet is not only used to
Basics of Internet

fetch the information but there are other uses such as gaming, data storage or running
business applications.

The primary job of a web server is to deliver web pages to clients. The communication
between the client node and server node takes place using the Hypertext Transfer
Protocol (HTTP). The delivered web pages include images, style sheets and scripts in
addition to text content.

2.2 Server Software


A web server commonly known as HTTP server or application server is a program
that serves content using the HTTP protocol. This content is generally in the form of
HTML documents, images, and other web resources, but can include any type of file. The
content served by the web server can be pre-existing (static content) or generated on the
fly (dynamic content).
1. Apache web server - the HTTP web server: Apache Software
Foundation developed the free and open source web server and can
be installed and made to work on almost all operating systems
including Linux, Unix, Windows, FreeBSD, Mac OS X and more.
Almost, 60% of the web server machines run the Apache web server
2. Apache Tomcat: Apache Tomcat is free and open source web server
that can run on different operating systems like Linux, Unix,
Windows, Mac OS X, Free BSD. It was developed to support
servlets and JSP scripts. It can serve as a standalone server.
4

Information and Computer Technology

3. Lighttpd: Lighttpd is a free web server distributed with the FreeBSD


operating system. This open source web server is fast, secure and
consumes much less CPU power. Lighttpd can also run on Windows,
Mac OS X, Linux and Solaris operating systems.
4. Jigsaw: Jigsaw (W3Cs Server) is introduced by the World Wide
Web Consortium. It is open source and free and can run on various
platforms like Linux, Unix, Windows, Mac OS X Free BSD etc.
Jigsaw is written in Java thus can run CGI scripts and PHP programs.

2.3 Services Provided by the Servers


Today many services are being provided by the Web Server. Many of the servers are based on
Cloud computing which is popular amongst the researchers, scientists & entrepreneurs.

Cloud Computing is distributed computing over a network, and has the ability to run
a program or application on many connected computers at the same time.
It is used, where various computing concepts that involve a large number of computers
are connected via real-time communication network such as the Internet.
Various services provided by the Web server are:
1. Cost Efficient: Web server is the most cost efficient method to use, maintain and
upgrade. Traditional desktop software costs companies a lot in terms of finance. On
the other hand, it is available at much cheaper rates. Besides, there are many onetime-payment, pay-as-you-go and other scalable options available, which makes it
very reasonable for the company.
2. Resource Sharing: Web Server has the capability to store unlimited information
such as Google Drives, Cloud computing etc. The space where the data can be
stored is shared by the other users at the same time like hard disk can be shared on
physical network as LAN.
3. Data Sharing: With the help of web servers one can easily access the information
from anywhere, where there is an Internet connection using Google docs such as
Documents, Excel sheets, Drawings, Powerpoint presentations etc.
4. Backup and Recovery: As all the data now a days is stored on web servers,
backing it up and restoring the same is relatively much easier than storing the same
on a physical device. Hence, the entire process of backup and recovery much
simpler than other traditional methods of data storage.
Basics of Internet

2.4 Types of Servers


1. Mail Server: Mail Servers provides a centrally-located pool of disk space for network
users to store and share various documents in the form of emails. Since, all the data is
stored in one location, administrators need only backup files from one computer.
2. Application Server: An application server acts as a set of components accessible to the
software developer through an API defined by the platform itself. For Web
applications, these components are usually performed in the same running environment
as its web server(s), and their main job is to support the construction of dynamic pages.

3. File Transfer Protocol (FTP) Server: FTP uses separate control and data
connections between the client and the server. FTP users may authenticate
themselves in the form of a username and password, but can connect anonymously
if the server is configured to allow it. For secure transmission username and
password must be encrypted using FTP and SSL.
4. Database Server: A database server is a computer program that provides database
services to other computer programs or computers using client-server model.
Database management systems frequently provide database server functionality, and
some DBMSs (e.g., MySQL) depend on the client-server model for database access.
Such a server is accessed either through a front end running on the users
computer where the request is made or the back end where the request is served
such as data analysis and storage.
5. Domain Name System (DNS) Server: A name server is a computer server that
hosts a network service for providing responses to queries. It maps a numeric
identification or addressing component. This service is performed by the server in
response to a network service protocol request.
The primary function of these DNS servers is the translation (resolution) of humanmemorable domain names and hostnames into the corresponding numeric Internet Protocol
(IP) addresses. The secondary function of DNS is to recognize a name space of the Internet,
used to identify and locate computer systems and resources on the Internet.

3. Web Site
3.1 Definition
The collection of web pages on the World Wide Web that is accessed by its own Internet
address is called a Web site. Thus, a Web site is a collection of related Web pages. Each Web
site contains a home page and contains other additional pages. Each Web site is owned and
updated by an individual, company, or an organization. Web is a dynamically moving and
changing entity, today web sites generally change on a daily or even hourly basis.
6

Information and Computer Technology

3.2 How Website is different from Portal?


Web portal is a medium by which users access the resources, while a website is a destination
in itself. Portals and websites are distinct entities which are linked together, but they should
not replace each other. A website is also a portal, if it broadcast information from different
independent resources where as Web Portal refers to a website or services that provide varied
resources and services such as email, forums, search engines and online shopping malls.

Some of the web portals are AOL, iGoogle, Yahoo and even more.
A website refers to a location or a domain name hosted on a server which is accessible
via internet. It is a collection of web pages, images, videos which are addressed relative
to a Uniform Resource Locator (URL). Websites provide content from independent
resources to specific audience. The content of the website is generally focused & contains
the material needed to be accessed.

3.3 Components of Website


1. Contents of a Web Page: A webpage of a website must contain the basic elements
such as Page title, URL, file name, header, footer, navigation, web page content are
all parts to the composition of a web page.
2. Website Graphics: Always use web graphics which have been optimized for optimum
download speed, as the web hosting space affects the performance of the website.

3. Heading of the site: Headings in a website play a crucial role as they not only
present a clear structure of the web page to the audience and help the search engines
to retrieve the required information.
4. Effective Colour Contrast: As the websites are used to retrieve the information
related to specific purpose or topic. It is very important to take care of the
presentation of the contents of the sites. So that, website visitors must not have any
difficulty in reading a web page. As some times when we pick a colour scheme for
our website we forget that there are people with poor vision and colour deficiencies.

3.4 Elements of Website, are as follows:


Good Visual Design: A site must be appealing and if required, must be

professional. Your site reflects your company, your products and your services.
Screen Resolution: As we know that websites are displayed on the screen of electronic

devices and every device has different resolution. Today, the average web surfer uses a
resolution of 1024 x 768 pixels. However, you need to make sure that your website
looks good at this setting and must work nicely for other resolutions too.
Basics of Internet

Colour Scheme & Text Formatting: To make the website presentable appropriate

colour scheme must be used. Always use 2 or 3 primary colours that reflect the purpose
of your site. Add contrast colours in your site, which helps the user to easily read the
text. Use fonts that are easy to read and available on most of todays computer systems.
Keep the standard font size for paragraph text i.e. between 10 and 12 pts.
Insert Meaningful Graphics: Graphics are important, as they provide the site a

legible and interactive appearance. However, dont use too many images and that
too with a high resolution. First, whenever user will try to download the website it
will take too long to download and secondly, too many images with less text, lose
the interest of the customer.
Simplicity: Keep your site simple and allow for adequate white space. Dont overload

your site with complex design, animation, or other effects to impress your viewers.
Relevant Content: Include relevant information along with style, to help the

visitors to make a decision.


Navigation: Keep your site simple and well organized. Dont use fancy Navigation

Bar in your website. Place all the menu items at the top of your site, or above the
fold on either side. Include Site Maps in your site to reduce the number of top level
navigation items. Every component of your site should work quickly and correctly.
Broken or poorly constructed components will frustrate the visitors. All the
hyperlinks, contact forms, should be placed appropriately.
Minimal Scroll: While surfing the sites for information users do not like scrolling

the page instead they need to see all the information on one screen. Even the Search
Engines will reward you for this behaviour.
Consistent Layout: Always use a consistent layout in the whole website which will

help you to retain the theme of the site.


Cross-platform/browser Compatibility: Today many open source browsers are

being used by the users. Create a website which should be platform independent.

3.5 Construction of Website


Steps to build a Website
Step 1: Hosting
The first step in constructing a website is to decide about the web hosting provider
for your site.
There are several types of Web hosting options you can choose from such as:
8

Information and Computer Technology

Free Web hosts: Most people want to go for free Web hosting. On one hand it is free but
on the other hand, you dont always get much space, due to low bandwidth.
Search a Web Hosting Provider: These are the links to other sites for finding a good
host for your site.
Step 2: Domain Name
You can plan your website in two ways: using a domain name and without using a
domain name. You can put up a site on free hosting or even paid hosting plans. A domain
name provides extra branding for your site and makes it easier for people to remember
the URL.
Step 3: Plan Your Website
After deciding the domain and your URL, you can start planning your site. You need to
decide the audience aimed at.
Select the type of site: Most websites are either news/information, product, or reference
sites. Each has a different focus. A site must have formal language, where as a personal
site can use slang and an informal tone.
Step 4: Build Your Website Page by Page
For building a website you need to work on one page at a time. To build your site you
should be familiar with the key elements of the site as discussed above.
Step 5: Publish Your Website
After the completion of the design now it is the time to publish your website on web. You
can do this either with the tools using your hosting service or with FTP clients. Knowing
which you can use depends upon your hosting provider.
Step 6: Promote Your Website
There are many ways to promote a website such as web search engine, word of mouth,
email, and advertising. You build your Web content so that it ranks well in commonly
used search engines. This can be difficult, but it is inexpensive and can result in good
results if you work at it.
Step 7: Maintain Your Website
Maintenance is the last step of constructing a site which helps in keeping your site updated
with the latest trends of market. In order to keep your site going well and looking good,
Basics of Internet

you need to test your site frequently. And you should also work on content development
on a regular basis.

3.6 Software used to Create Website:

CoffeeCup Free HTML Editor

Notepad++

PageBreeze

Firebug

Bluefish Editor

10

Information and Computer Technology

Brackets

KompoZer

OpenBEXI

GIMP

BlueGriffon

4. Webpage
4.1 Definition
A Web page also known as Electronic Page, is a part of the World Wide Web. It is just
like a page in a book. The basic unit of every Web site or document on the Web is a Web
page containing the information.
Basics of Internet

11

A Web page can contain an article, or a single paragraph, photographs, and it is usually a
combination of text and graphics.

4.2 Static and Dynamic areas


A static web page often called a flat page or stationary page, is a web page that is
delivered to the user exactly as stored. A static web page displays the same information
for all users, such versions are available and the server is configured to do so. Such web
pages are suitable for the contents that never or rarely need to be updated.
A dynamic web page is a web page which needs to be refreshed every time whenever it
opens in any of the web browsers to display the updated content of the site.

4.3 What makes a web page works?


The server receives the request for a page sent by your browser.
The browser connects to the server through an IP Address; the IP address is

obtained by translating the domain name.


In return, the server sends back the requested page.

4.4 Difference between Webpage and Website


A web page is one single page of information, while a website is made up of a number of
different web pages connected by links known as Hyperlinks.

5. Web Browser
A browser is a software that lets you view web pages, graphics and the online content.
Browser software is specifically designed to convert HTML and XML into readable
documents.
The most popular web browsers are: Google Chrome, Firefox, Internet Explorer, Safari,
Opera and UC Browser.

5.1 Tool Bar

Back

Forward

Stop Refresh Home

Search Favorites History

The Tool Bar is much like the Menu Bar stretching from left to right across the top
of your screen just under the Address Bar
12

Information and Computer Technology

Back button

: Helps to open the previously opened website.

Back history

: Helps to bring up a list of the sites visited.

Forward button :

This button will only be available once you have used the Back
button at least once. It helps to take you to the page you just left
when you clicked on the Back button.

Forward history :

That brings up a list of the sites you have visited and then used
the Back button to return.

Stop

: Helps to stop the current download.

Refresh

: Gives the most recent version of the page that we are on.

Home

: Helps you to instantly get back home page (first page).

Search

: Helps to retrieve the specified files using web search engine.

Favourites

: Helps to open up the most frequently visited sites.

History

: Helps you to see where you have been on the Internet.

5.2 SSL
The Secure Sockets Layer (SSL) is a protocol, uses Hypertext Transfer Protocol (HTTP)
and Transport Control Protocol (TCP) for managing the security of a message
transmission on the Internet. The sockets term refers to the sockets method of passing
data back and forth between a client and a server program in a network or between
program layers in the same computer. SSL uses the public-and-private key encryption
system, which also includes the use of a digital certificate.

5.3 Various Web browsers available in the market:


Google
a. b. Mozilla Firefox Chrome

c.

Safari

e. Maxthon

Basics of Internet

d.

Opera

f.

Internet Explorer

13

g.

Netscape
Navigator

h.

Avant Browser

i.

YouTube
Browser

j.

UC Browser

6. Blogs
6.1 Definition
A blog, short for web log is a modern online writers column. A blog is a web site like
any other, but it is intended to offer personal opinions of people on their hobbies,
interests, commentaries, photo blogs, etc.
Initially, blogs started out as online personal diaries, but in a technology-driven world,
now they have also been taken up by businesses as an informal method of communicating
with customers and clients.
Blogs can also be used for commercial purposes, too. Absolutely anyone can start a blog,
but some people make reasonable incomes by selling advertising on their blog pages.
Social network companies also realise how popular blogs are and many offer free blog
space (e.g. MySpace).
Another feature of popularising a blog is the ability of visitors to add comments to the
stories.
There are two ways of starting your own blog:
1. Free blog hosting: You do not need a server to start your own blog. There are
plenty of free, open source blogging software you can install. For example
WordPress and Moveable Type.
2. Paid blogging: Another way is when a company provides you a limited amount of
space or a column on their website and the blogger has to pay for the same till the
time he is using the available space.

6.2 Types of blogs


There are millions of blogs on the Web. But they are categorised into these
types: Personal blogs
14

Information and Computer Technology

News and views


Company blogs
Micro blogs

Personal blog
By far the most popular among all types of blogs is the personal blog, after all, blogging
started off as a way of giving words to your thoughts. A typical blogger may be keen on
posting stories about his interests.
News and views
These days, we find a number of news and television companies having professional
journalists who post stories and views about the latest events. Visitors can comment their
opinions as well. BBC is a popular example of the same.
Company blogs
Many companies run blogs to let their customers and clients know about the new
products coming up or progress being made on some project.
Micro-blogs
This is a new type of blog where you post very short comments that others can follow
and a powerful way for professionals to keep in touch with each other. Twitter is the best
example.

6.3 Bloggers
Those days are now a thing of the past when journalists had only pens and papers or
specific websites to write on because now they have websites and blogs on which they
can express their views. A person who writes a blog is simply known as a blogger.
Associating this to social networking websites allows you to get viewers and readers who
would then promote these amongst other people.
A good blogger should keep a few things in mind:
Write unique but meaningful content. Try keeping the language simple and concise

and incorporate some surprise elements. Find a topic that would intrigue your
readers or an issue that people are looking out for more information. Remember to
BE ORIGINAL. This will increase the credibility.

Basics of Internet

15

Dont make it boring. Avoid clichs. Keep your writing informal, if possible funny

or quirky and create a perfect balance between keeping the mood light and
professional enough to suggest you are serious about your matter.
Knowing your topic is good but not enough. You need to express it in a right way

and communicate properly to your readers. Write crisp, short, active sentences with
powerful verbs. Ensure that your content is error-free, proofread and edit your work
meticulously and only when you are satisfied with it, hit the publish button.
The title is the crux of any content. Your best quality content will hold no meaning

if the title itself is not catchy. The first thing readers notice is the headline. You have
to tempt them to open the link and leave satisfied but still wanting to know more
about other blogs. This eventually increases traffic to your site!
Advantages of Blogging:
1. We can work on blog anytime and anywhere in the world, all you need is your
laptop or a desktop computer and wireless internet services.
2. You are your own employee. When blogging, you can blog any time you want to
whenever you think of something that is relevant to your blog.
3. As a blogger, you are flexible and can choose to write about anything in the world
as long as it benefits you and befits your opinions and thought process.
4. Very quick and easy to set up, do not need much technical knowledge.
5. Easy and quick to update or add new posts. People can leave comments on your
blog and you can comment on other persons blogs, too.
Disadvantages of Blogging:
1. You need to be patient because you dont start earning in a single day. Readership
takes time to develop within people.
2. Blogging is time-consuming. You need to be disciplined. Finding time to write
regular updates can become a chore.
3. You need to be very active as a blogger so that people can read your blog posts. If,
for example, you fall ill, you wont be able to blog and this would result in losing
followers.
4. As you know the public to everyone, you need to put a check on your language.
5. There are many very dull blogs around. You may have to look at many before you
find some worth reading.
16

Information and Computer Technology

7. URL
7.1 Definition
URLs, or uniform resource locators, are the web browser addresses of internet pages
and files. It is the way to locate a file or document on the Internet. The URL specifies the
address of a file and every file on the Internet has a unique address. It works with IP
addresses to give a name, location to web pages. Web software, such as your browser,
use the URL to retrieve a file from the computer on which it resides.
Format of a URL:
Protocol://site address/path/filename
Every URL has three parts to address a page or file:
1. Protocol which ends with a //:
2. Host computer which ends with web extensions such as .com,.org etc.
3. Filename or page name which displays the related information.
Example:
http://www.banks.com/login/password.htm
The above URL consist of:
Protocol

: http

Host computer name

: www

Domain name

: banks

Domain type

: com

Path

: /login

File name

: password.html

7.2 Elements of Absolute and relative URL:


An Absolute URL is independent or free from any relationship. It specifies the exact
location of a file or directory on the internet. When you use an absolute URL, you target
a particular file. Thus, each absolute URL is unique, which means that if two URLs are
identical, they point to the same file. These URLs are always preferred as they help in
web site maintenance. Moreover, it is easy to transfer a web site from one domain name
to another, you need not to update each link on each page.
For example:
http://www.developers.com/images/hardware.gif

Basics of Internet

17

In above URL specifies an image file hardware.gif located in the images directory, under
domain name www.developers.com.
If we want to include the image file hardware.gif stored in the images directory of www.
developers.com domain on this page.
Using an Absolute URL in an <img> tag is as follows:
<img src= http://www.developers.com/images/hardware.gif width=... height=... />
A Relative URL is targeted to a file or directory in relation to the present file or
directory. If the web site has several sections and the files and web pages for each section
have been segregated into different directories. This helps in keeping things organized
and uncluttered on the web site. The relative URLs are shorter than absolute URLs and
hence the file size of the web page would reduce, if you use the former.
For example:
If we want to include the image file hardware.gif stored in the images directory of
www.developers.com domain on this page using an absolute URL.
The <img> tag for this image display will be as follows:
Using a Relative URL in an <IMG> tag
<img src=../images/hardware.gif width=... height=... />

7.3 Protocols
Definition
When we have to communicate with anyone, then we need to follow the same language,
so that communication can be done in an effective manner. In the same way ,whenever
there is need to exchange data or information among different or same type of networks
on internet, they need to follow same set of rules.
The Internet is based on many layers of information, where each layer is dedicated to a
different kind of documentation. These different layers are called Protocols. A protocol
is a set of rules that governs the communication between computers on a network. They
exist at several levels in a telecommunication connection.
The most popular protocols used on internet are the World Wide Web, FTP, Telnet,
Gopherspace, instant messaging, and email.
18

Information and Computer Technology

7.4 Types of Protocols


TCP/IP
1. TCP/IP: TCP/IP (Transmission Control Protocol/Internet Protocol) is the basic
point-to-point meaning each communication is from one point (or host computer) in
the network to another point or host computer communication protocol on the
Internet. It is used as a communication protocol in all types of networks. When you
are connected to the Internet, your computer provides you a copy of the TCP/ IP
program when you need to send messages to or get information from the other
computer.
TCP/IP is a two layer protocol. The top layer, TCP(Transmission Control Protocol)
manages the assembling of a message or file divided into smaller packets that are
transmitted over the Internet and received by a TCP that reassembles the packets
into the original message on the destination computer. The lower layer, Internet
Protocol, handles the address part of each packet so that it gets to the right
destination. Each gateway computer on the network checks for the address to
forward the message. Some packets from the same message are routed differently
than others, but they are reassembled at the destination.
2. HTTP stands for HyperText Transfer Protocol, is a set of standards that allows
users of the World Wide Web to exchange information found on web pages on
internet. HTTP defines how messages are formatted and transmitted, and what
actions Web servers and browsers should take in response to various commands.
Todays modern browsers no longer require HTTP in front of the URL since it is the
default method of communication. But, it is still used in browsers because of the
need to access other protocols such as FTP through the browser. The HTTP
provides a standard for Web browsers and servers to communicate.
3. File Transfer Protocol (FTP) is a standard protocol used on network to transfer the
files from one host computer to another host computer using a TCP based network,
such as the Internet.
FTP uses separate control and data connections between the client and the server.
To use FTP server, users need to authenticate themselves using a sign-in protocol,
using a username and password, but can connect anonymously if the server is
configured to allow it. For secured transmission the data encrypts (hides) the
username and password, and even encrypts the content, using SSL.
To transfer files with FTP, use a program often called the client. An FTP client program
initiates a connection to a remote computer running FTP server software. After the

Basics of Internet

19

connection is established, the client can choose to send and/or receive files. To connect
to an FTP server, a client requires a username and password as set on the server. Many
FTP servers use a username as anonymous. Using FTP, you can also update (delete,
rename, move, and copy) files at a server. You need to logon to an FTP server.
However, publicly available files are easily accessed using anonymous FTP.

FTP using TCP/IP, works in the same way as HTTP used for transferring Web
pages from a server to a users browser. FTP sites are heavily used and require
several attempts before connecting.
To use your web browser to connect to an FTP site, where you normally enter a
URL as follows:
ftp://username@ftp.site name/

Summary
The World Wide Web (WWW) is an internet based service, which uses common set of rules
known as Protocols, to distribute documents across the Internet in a standard way.
The Internet is a massive network of networks. It connects millions of computers together
globally, forming a network in which any computer can communicate with any other
computer as long as they are both connected to the Internet.
Search engines are the programs which are needed to extract the information from the
internet.
A search engine works in the following order: Web crawling, Indexing, Searching
A web server commonly known as HTTP server or application server is a program that
serves content using the HTTP protocol.
A Web page can contain an article, or a single paragraph, photographs, and it is usually a
combination of text and graphics.
A browser is a software that lets you view web pages, graphics and the online content.
The Secure Sockets Layer (SSL) is a protocol, uses Hypertext Transfer Protocol (HTTP)
and Transport Control Protocol (TCP) for managing the security of a message transmission
on the Internet.
A blog is a web site like any other, but it is intended to offer personal opinions of people on
their hobbies, interests, commentaries, photo blogs, etc.
URLs, or uniform resource locators, are the web browser addresses of internet pages and
files. It is the way to locate a file or document on the Internet.
There are two types of URL: Absolute and Relative.
A protocol is a set of rules that governs the communication between computers on a network.
20

Information and Computer Technology

A. Multiple Choice Questions:


1. ARPANET stands for(a) Advanced Real Projects Air Network
(b) Advanced Research Preparation Agency Network
(c) Advanced Recruitment Process Agency Network
(d) Advanced Research Projects Agency Network
2. In 1990s, the internetworking of which three networks resulted into Internet?
(a) WWW, GPS and other private networks
(b) ARPANET, NSFnet and other private networks
(c) ARPANET, NSFnet and other public networks
(d) ARPANET, GPS and NSFnet
3. Web search engines works with the help of two programs. Which are they?
(a) Web crawler and Cascading Style Sheet
(b) Spider and Indexer
(c) Web server and web crawler
(d) None of the above
4. Web Site is a collection of ______________.
(a) Audio and video files
(b) Pictures
(c) Web pages
(d) All of the above
5. AOL, iGoogle, Yahoo are examples of ______________.
(a) Web Site
(b) Web Page
(c) Web Portal
(d) None of the above
6. ______________is distributed computing over a network, and involve a large number of
computers connected via real-time communication network such as the Internet.
(a) Cloud Computing
(b) Thin Client Computing
(c) Fat Client Computing
(d) Dumb terminal Computing
7. A ______________ is a web site like any other, but it is intended to offer personal
opinions of people on their hobbies, interests, commentaries, photo, etc.
(a) Protocol
(b) Blog
(c) Webpage
(d) Journals
Basics of Internet

21

8. ______________ protocol defines how messages are formatted and transmitted, and
what actions Web servers and browsers should take in response to various commands.
(a) FTP
(b) TCP/IP
(c) HTTP
(d) SMTP
9. URLs are of two types:
(a) Absolute & Relative
(c) Absolute & Dynamic
10. DNS is an acronym for ______________.
(a) Domain Name Security
(c) Document Name System

(b) Static & Dynamic


(d) None of the above
(b) Domain Number System
(d) Domain Name System

B. Answer the following questions:


1. Define the following terms:
(a) URL
(b) FTP
(c) Blogger
(d) ARPANET

(e) Protocol
(f) Blog
(g) TCP/IP
(h) HTTP

2. Define WWW. How is it different from the Internet?


3. Briefly explain the various types of servers.
4. Differentiate between static webpage and a dynamic webpage.
5. Simran has a hobby of writing articles and short write-ups. She wants to share her views
with the world. Suggest what she can do to make her views public and share her
thoughts with everyone.
6. What is a Search Engine? How does it work?
7. What is a Web Server? What are the various services provided by web servers, these
days?
8. What is a Web Page? How does it work and how is it different from a website?
9. What is meant by Cloud Computing?
10. What is a Web Site? How does it differ from a Web Portal?
11. What are the various steps involved while creating a Web Site? Explain.
Discuss the various types of blogs.
12. Name some softwares used to create a Website.
13. What do you mean by a Web Browser?
14. What is meant by SSL?
15. Discuss the various types of blogs.

22

Information and Computer Technology

16. People nowadays are pursuing blogging as their career. But, still there are many who
refuse to go for the same. Discuss your views on the topic.
17. Briefly explain the elements of a website.

C. Lab Session
Q.1. List the URLs of all the commercial and non-commercial websites and find out their
domain names, servers and protocols.
Q.2. Name all the websites related to e-commerce.
Q.3. Create your e-group on a social networking site and share your opinions and views
on environment.
Q.4. Name all the personal types of blogging sites.
Q.5. List all the popular search engines in the market.
Q.6. Write the names of all the newsgroups that you can join on internet.
Q.7. Make a list of IP addresses of a few of your favourite sites using any search engine of your
choice.
Q.8. Make a collage depicting all the logos of web browsers and list their comparative
features.
Q.9. Identify the category of these sites and complete the table.
Website

Category

www.olx.in
www.facebook.com
www.icicibank.com
www.irctc.co.in
www.merriam-webster.com

Basics of Internet

23

Chapter 2

Web Services
Learning Objectives
By the end of this chapter, learner will be able to:
List various web services.
Define email.
Understanding of protocol used in email services
Define chatting, video conferencing.
Understanding of E learning, E shopping
Define social networking.

Introduction
Everyone is using internet irrespective of their background & interest. The types of
services available on net are as diverse as the interest of the people .Web Services mean
the services provided by World Wide Web. The World Wide Web provides services like
chatting, emailing, video conferencing, e-learning, e-shopping, e-reservation, e-groups
and social networking. These services may mean different things to different people but
in simple words, they are the ways to communicate and here the communication takes
place between two electronic devices.
When two persons are talking to each other, we say they are chatting. Likewise when two
computers (or two electronic devices) exchange data and information, we say two
computers are e-chatting. They communicate with each other with the help of technology
and programming standards used on Internet.
Let us discuss the services provided by World Wide Web in detail in the following
sections.

1. Electronic mail or E Mail


E-mail or Email is simply the short form of electronic mail. It is a system
of receiving, sending, and storing electronic messages. An electronic message
is text or a file prepared using software in computer and that travels through
telephone lines from one computer to another. E-mail has
24

Information and Computer Technology

become a popular method of communication. Now, an e-mail is preferred for personal or


business communication as compared to letter sent by traditional post. Electronic mail
has gained universal popularity because a person from any age group and from any
background can use it and the delivery of the message is instant. The speed is much
higher than the speed of the traditional postal or the courier service.

1.1 How is E-mail service used?


Messages sent by electronic mail normally reach a recipients account within seconds.
The message can include text, images and numerous types of formatted documents.
These days, it is no longer necessary to be sitting in front of a PC to send or receive an
email. A variety of mobile devices, such as tablet computers and smart phones make it
possible to send the message via E-mail. The following diagram displays how an e-mail
moves from the sender to the receiver.

Schematic diagram How E mail is transferred

1.2 Protocols used in E-mail Service


Users receive and send messages using standardized protocols that make it possible for
emails to travel between computers. A protocol is a set of rules that are needed for
communication. Let us say, one computer is using a software, the other computer is
using b software. Both of them want to communicate and exchange data. Computer a
will not be able to understand the message of computer b and computer b will not be
able to understand the message of computer a. here it becomes necessary that both the
computers will agree upon standard set of rules to send or receive the message. Thus,
standard or uniform protocols are needed so that different computers using different types
of software can send or receive the information.
There are three types of protocols used by e-mail service. One is Simple message transfer
protocol (SMTP), second is Post Office Protocol and third is IMAP (Internet Message

Web Services

25

Access Protocol). The Simple message transfer protocol (SMTP) enables the actual
sending of messages. The Post Office Protocol and IAMP allows the users to retrieve
information instantly.
When we want to send a message using e-mail service, there are three important things
that are to be kept in mind. The first is the body of the message. The second is the address
of the person(s) to whom you want to send the message. The third is the fields associated
to e-mail message. Let us discuss them in detail.
Search Mail

INBOX CONTACTS

Search Web

CALENDAR New Message

Cancel

Compose

Inbox(16)
Drafts
Sent
Spam (1)
Trash

To
CC

Hide CC

BCC

Hide BCC

Subject

FOLDERS
MESSENGER
APPLICATIONS

Message Body
The body of the message may consist of words, number, attachments, special
characters or anything you want to insert in the letter.
E-mail Address
Let us look at the following example(s) to understand the e-mail address and
its components.
Example:
editor@cbse.co.in
editor@cbse.com
An e-mail address consists of four parts:
1. The username
2. The symbol
3. The hostname
4. The top level domain
26

Information and Computer Technology

1 The username, here editor which refers to the mailbox. The username is the name
given by the user (the recipient) as per his/her choice, while preparing an e-mail
address for him / her. While deciding a username, the recipient has to follow the
naming conventions like use of underscore ( _ ) or a dot ( . ) as a separator between
two words, minimum or maximum number of character to be maintained etc.
2. The symbol, here @. This symbol is pronounced as at the rate and this remains
same in every email address.
3. The hostname, here cbse. The hostname is also called the domain name. The
domain name is the name of mail server whose representation appears in the client
computer when he/she opens his/her inbox. This domain name is important to lead
the message to the address of the mail server. The address is a unique IP address for
easy identification on the Internet.
4. The top-level domain (TLD). The top-level domain may again get divided into two
portions. Here com or co refers to commercial sites (the first portion) and
in refers to India (the second portion). Thus, co.in together refers to
commercial sites registered and residing in India.

1.3 Field Associated with an E mail Message:


An email client can be Outlook Express, Hotmail or Ymail. The email client may
typically consist of four important fields. They are To:; Cc:; Bcc: and Subject:.
To: field is used to write the email address of the person to whom the message is to be
sent.
Cc: field is optional and is used to send a message to multiple additional addresses.
Bcc: field is also optional and is used to send a message to multiple additional addresses.
The difference between Cc and Bcc: field is decided in terms of visibility. The address in
Bcc: field is termed as blind carbon copy, the addresses mentioned in this field are not
visible to the recipients of the To: and the Cc: fields.
Subject: field is used to mention short title for what is included in the body of the
message.

2. Chat
The word chat as it literally means in English is communication between
two or more people. The electronic chat is the communication between two
or more individuals using their computers. Chat is only feasible when

Web Services

27

both the users are on Internet at the same time. The communication occurs through typed
text messages. Usually, this talking is the exchange of typed-in messages requiring
one site as the repository for the messages (or chat site) and a group of users who take
part from anywhere on the Internet.
The group chats can be ongoing or scheduled for a particular time and duration. Most
chats are focused on a particular topic of interest and some involve guest experts or
famous people who talk to anyone joining the chat. Alternatively two users can chat
when they are using the Internet and the platform at the same time.
Several browser interfaces provide the chat facility these days such as Instant messaging,
Windows, Skype and ICQ. With the invent of 3G technology not only text data but video
data can also be streamlined at the same time

3. Video Conferencing
The video conferencing is a conference between two or more people sitting at various
remote locations around the world. They can talk to each other when they are connected
to each other using Internet. Thus, they are able to transmit both the video and audio data.

In video conferencing, several computer networks relay the information through the
Internet. Each of the end user has a camera known as Webcam as well microphone to
capture the video data and the voice data in real time and this is transmitted over Internet.
The participants can view each other over their monitors as well as hear the voice data
over speakers of their laptop or desktop computers. These days equipment such as smart
phones and tablets has the capability of capturing the video data as well voice data.
Therefore, it is possible to conduct video conferencing from any part of the world not
necessarily connected to Internet through wires.

28

Information and Computer Technology

Multipoint videoconferencing allows three or more participants to sit in virtual


conference room and communicate, as though they are all sitting together. With the
rapidly changing cost of the hardware and accessibility of Internet across the world, video
conferencing is changing the way people conduct meetings. The business class all around
the world consider video conferencing as a rapid tool to reduce the need for personal
meetings and hence the need for all participants to get together at one location. The high
speed of Internet connectivity not only allows the video and audio data but participants
can open, review, share and discuss the documents.
On the television, we see a number of times that the program host is conducting the
interview among several participants sitting in different cities or countries. This is done
with the technology used in video conferencing. The participants are not only able to hear
each other but can see and talk to each other live. The entire proceedings of the interview
such as the data transmission between or among participants across the world can be seen
clearly by the viewers of the television.
Advantages of Video Conferencing
1. Reduced traveling cost: In the global world where businesses are being conducted
across continents, the travelling cost and the time that is wasted during travel is reduced
to a greater extent. The video conferencing lowers the distance by showing the receiver
on the monitor and it takes least amount of time to conduct talks between the two users.

2. Increased productivity: The people meet in the virtual world where the discussions
takes place instantly without meeting each other and the decisions about a problem
are thus made faster. This leads to increased productivity.
3. Going Green: Since conferencing between people is possible even without
travelling from one place to another through video conferencing, a lot of petrol or
fuel is saved. One can therefore say, that it is an eco-friendly initiative.
But there are some disadvantages of video conferencing as well:
1. Technical issues- Since the video conferencing depends heavily on the availability
of a high speed internet connection, the technical issues of such types can delay the
discussions among the participants sitting in different locations.
2. Lack of personal contact- All types of discussions cannot be handled through video
conferencing. Discussion between an employer and prospective employee or the
assessment of a candidate is possible most of the time through the personal
interview i.e. face to face interaction. It is difficult to judge a person through the
video or a virtual interview.
Web Services

29

4. E-Learning
As computer and usage of Internet has made the life of the
business people easy, companies from across the world have
started to consider the fact that information and knowledge can
be imparted to people using technology. E-Learning is one such
method in this direction.
The E-Learning is a method of providing guidance and/or delivering information to
students of university or the employees of companies. Several universities and companies
design the courses that can be reviewed using laptop, desktops or other smart devices.
These programs are developed in such a way that the individuals dont need to come to a
classroom but can review all the data from any place convenient to them. It can be their
home or their office.
Such courses are designed in such a way that people can progress slowly or at a pace,
they can manage. These courses help an individual to assess their knowledge online. This
is done using the built in evaluation tools like quizzes or multiple choice questions.
These courses are sometimes, stored in a directory or a server, from where the students
can access and copy them on the compact disc or other data storage device. In either case,
the program is developed in such a way that the student needs minimal interaction with a
human tutor to understand the information being shared.
The biggest advantage of E-learning is that it helps to provide information to a large group of
individuals who cannot attend an institution. It also reduces the need for one to go to a
specific place to learn or to share information. The E- Learning provides an opportunity to
the student to complete the course at their speed. Several product development companies
develop programs for E-learning the business in schools and universities. Today even a
young child from an elementary school knows how to use a smart device, a device that helps
in interactive learning. The universities from across the globe keep offering the on-line
courses. This is possible through e-learning. The e-learning may even provide the students a
the platform to share their thoughts and have live or online discussions for clarifications.

The following are the advantages of online or computer-based learning:


1. Class work can be scheduled around work and family
2. Reduces travel time and travel costs for off-campus students
3. Students may have the option to select learning materials that meets their level of
knowledge and interest
30

Information and Computer Technology

4. Students can study anywhere; they only need access to a computer and Internet
connection
5. Self-paced learning modules allow students to work at their own speed
6. Flexibility to join discussions in the bulletin board threaded discussion areas at any
hour, or visit with classmates and instructors remotely in chat rooms
7. E-Learning can accommodate different learning styles and facilitate learning
through a variety of activities
8. Develops knowledge of the Internet and computer skills that will help learners in
their career
Disadvantages of online or computer-based learning
1. Learners with low motivation or bad study habits may fall behind
2. Without the routine structures of a traditional class, students may get lost or
confused about course activities and deadlines
3. Students may feel isolated from the instructor and classmates
4. Instructor may not always be available when students are studying or need help
5. Slow Internet connections or old computers may make accessing course materials
frustrating
6. Managing computer files and online learning software can sometimes seem complex
for students with beginner level computer skills
7. Lab work is difficult to simulate in a virtual classroom

5. E-Reservation
E-Reservation System is an online reservation system that enables hotels, resorts,
property owners, operators, theater operators and transport companies to maximize
revenues without having to put human booking agents.
This system works with the Web and the Internet helps provide an access to a user/
customer to book a ticket, room etc. without ever having to go to the booking office.
Since such systems are internally integrated with the database of the companies, the
booking system helps to monitor access to the client as long as there is availability of the
seats/ rooms etc. The diagram below shows the process of e-reservation in case of a hotel
room booking.
Web Services

31

Businesses benefit from E-reservation as:


1. Increases direct sales as immediate confirmation is provided
2. Reduces administrative costs as less human agents are required
3. Helps manage inventory better as more visibility to the customer
4. Provides global access to the customers without the capital expenditure to set up
local offices

6. E-Shopping
On-line shopping is the purchase of products and services over the
Internet using a desktop or laptop of other smart device. With the
access of Internet everywhere On-line shopping is gaining
popularity as it is convenient to fast paced life style of the people
these days. More and more business firms are offering these
opportunities because it also helps them to reduce the infrastructure
costs setting up stores, hiring sales employees and merchandising.

Products such as clothes, shoes, groceries, books and larger products as furniture
and home dcor are offered through online shopping.
Benefits of E-Shopping:
1. Reduces time for customers as they can do a search from the comfort of their home
and compare prices
2. Reduces major infrastructure cost to the businesses
3. Helps move products faster as the products move from manufacturer to the
customer skipping unnecessary storage.
4. Businesses benefit from immediate funds availability and mostly customers pay for
the product through e-payment online.
Disadvantages of E shopping:
1. Customers are not able to touch and feel the products
2. Businesses have to manage the logistics of delivering products just-in-time
3. The access of this shopping depends entirely on availability of Internet. This limits a
large population who does not know to use the technology i.e. the remote areas.
4. Businesses have to continually protect against fraud and returning of the products
sold.
32

Information and Computer Technology

There are several e-shopping portals available worldwide. Some of them are local to a
specific region or country. Some portals provide with a global access. The examples of
such portals are e-bay, amazon etc. In India there are other established e-shopping portals
such as Home Shop 18, Naaptol .com, Yebhi.com etc
The most important interface component of E-Shopping portal are:
1. Customer website interface
2. Order management and inventory control.
3. Shipment Interface with various logistics organizations
4. Payment gateway for financial interface for payment processing
5. Customer service and support with live agents for complaints and help
E-Shopping has not only changed the way consumers are shopping for the products but
has also changed how the product moves from manufacturers to the end user. In the
typical store-shopping model, the product moved from manufacturer to wholesalers to
several intermediaries and finally to stores where customer may buy it. This model had
several layers of transportations built in leading to costs. In the e-shopping model, the EShopping portal manages just-in-time inventory where product is obtained from
manufacturer after the customer orders it from the website. This product is then shipped
directly from the warehouse of the shopping portal provider to customer. This eliminates
the intermediary and hence saves the cost of middleman.

6. Social Networking

Web Services

33

Social Networking is a platform that helps people to connect with others and build a
social relation. The last 15 years has seen a splurge of social networking sites where
people can search / choose to make friends, post pictures and photos, comment on each
others activities. Social networking has opened the doors where people can connect and
share their lives and the activities by them without being close geographically. People can
connect from anywhere in the world with the internet connection. They can become the
member of one or other available social networking site.
Social networking site allows a user to share ideas, activities, events, and interests among
the people. The individuals can also have the control of the content they share and the
person with whom they are or want to communicate with. An individual can share text
information, photos, data files or even videos. Many people now a days use social
networking sites to market their business and thus reach the potential customer. Using an
account of these sites they can showcase their product and services that the people
interested can follow and review.

7. E groups
E groups are a list of emails, users that can share information among each other. A single
administrator can maintain that group and hence provide the entire set of users to
communicate between each other. You can think of the administrator as a person who is
controlling the E Group. For example most of the companies these days have an E Group
structure where all employees can send email to each other, share files and access folders
on their servers or view each others calendar. The important fact is that only the users
within the group have the access and any user who is not in the group will not get the
permission to access.
The administrator of the group has the control on what level of access can the different
users have. Mostly all users can send an email to each other, but some users may have
access to all the files that the organization stores while others only to a specific folder.

Summary
Web Services mean the services provided by World Wide Web. The World Wide Web
provides services like chatting, emailing, video conferencing, e-learning, e-shopping, ereservation, e-groups and social networking.
E-mail or Email is simply the short form of electronic mail. It is a system of receiving,
sending, and storing electronic messages.
34

Information and Computer Technology

There are three types of protocols used by e-mail service. One is Simple message transfer
protocol (SMTP), second is Post Office Protocol and third is IMAP (Internet Message
Access Protocol).
The word chat as it literally means in English is communication between two or more
people. The electronic chat is the communication between two or more individuals using
their computers
In video conferencing, several computer networks relay the information through the
Internet. Each of the end user has a camera known as Webcam as well microphone to
capture the video data and the voice data in real time.
The E-Learning is a method of providing guidance and/or delivering information to students
of university or the employees of companies..
E-Reservation System is an online reservation system that enables hotels, resorts, property
owners, operators, theater operators and transport companies to maximize revenues without
having to put human booking agents.
On-line shopping is the purchase of products and services over the Internet using a desktop
or laptop of other smart device.
Social Networking is a platform that helps people to connect with others and build a social
relation.
Social networking site allows a user to share ideas, activities, events, and interests among
the people.
E groups are a list of emails, users that can share information among each other.

A. Multiple Choice Questions:


1. In web services, the communication takes place between(a) Two electronic devices.
(b) Two human beings
(c) Two spiders
(d) None of the above
2. Now a days, an email can be sent via,
(a) PC
(c) Smart phone

(b) Tablet
(d) All of the above

3. An e-mail address consists of four parts:


(a) The username
(c) The hostname

(b) The symbol


(d) The top level domain

Web Services

35

4. The following is not the name of e-shopping portal:


(a) Amazon
(b) e-bay
(c) twitter
(d) naaptol
5. The benefit of E-leaning is:
(a) Class work can be scheduled around work and family
(b) Reduces travel time and travel costs for off-campus students
(c) Students can study anywhere they have access to a computer and Internet connection
(d) All of the above

B. Fill in the blanks by using the words as under:


video
World Wide Web
protocol

guidance
SMTP
lower

at the rate
e-mail

Higher
E groups

1. Web Services mean the services provided by ______________.


2. ____________________________ is simply the shortened form of electronic mail.
3. The speed of E-mail is much ______________ than the speed of the emergent postal or
the courier service.
4. A ______________ is a set of rules that are needed for communication.
5. ______________ enables the actual sending and receiving of messages.
6. The symbol, @ is pronounced as ______________ and this remains same in every email
address.
7. The participants can view each other over their monitors as well hear the voice data over
speakers of their laptop or desktop computers.
8. ______________ are a list of emails, users that can share information among each other.
9. E-Learning is a method of providing ______________ and/or delivering information to
students of university.
10. ______________ conferencing is a conference between two or more people sitting at
various locations around the world.

C. State True (T) or False (F)


1. Computers communicate with each other with the help of technology and programming
standards used on Internet.
2. An e-mail is preferred for personal or business communication compared to letter sent
by post.
36

Information and Computer Technology

3. Different protocols are needed so that different computers using different types of
software can send or receive the information.
4. The body of the e-mail message may consist of words, number, attachments, special
characters or anything you want to insert in the letter.
5. The domain name is the name of mail server whose representation appears in the client
computer when he/she opens his/her inbox.
6. The address in Cc: field is not visible to the recipients of the To: and the Bcc: fields.
7. In an e-shopping there are a number of middlemen.
8. It is difficult to judge a person through the video or a virtual interview.

D. Multiple Choice Questions


Match the following
A

Video conferencing

1 On-line shopping is the purchase of products and


services over the Internet using a desktop/laptop or
other smart device.

E-Shopping

2 Each of the end user has a camera as well microphone


to capture the video data and the voice data in real
time and this is transmitted over Internet.

E-Mail

3 Without ever having to go to the booking office

E-Reservation

4 Self-paced learning modules allow students to work at


their own speed

E-Learning

5 Messages normally reach a recipients account within


seconds.

E. Answer the following questions:


Q.1. What is the meaning of web services? Discuss the various web-services in brief.
Q.2. What are the benefits of E-mail services over the postal service?
Q.3. How can you use the E-leaning facility for the subjects that you study?
Q.4. Write short notes on:
(a) E-shopping
(b) E-groups
Q.5. Describe the structure of Email box.
Q.6. Name the sites used for E-shopping.

Web Services

37

Q.7. What is the difference between the Chatting and Videoconferencing?


Q.8. How is E-learning beneficial for a learner?
Q.9. Mention few advantages and disadvantages of Social Networking.
Q.10. What are the advantages and disadvantages of Video Conferencing?
Q.11. How is twitter different from the facebook?

F. Lab Session
1. Make a list of different email addresses that you or your friends use and identify
different Host names.
2. Search Internet for different e-learning programs that are available. List down the
benefits derived by you. Which e-learning program is used by your school and find out
the information derived by them.
3. Identify the local TV programs that are using Video conferencing. Can you make a list of
advantages while watching the program? Also list what were the disadvantages of video
conferencing that you notice.
4. Make a reservation of a ticket online and make a list of all the steps needed.
5. List all social media sites you are using. Identify what benefits you feel by their use. Also
identify the restrictions these websites put on you as a user.
6. Create an account in facebook. How can you use the gaming facility on the facebook.

38

Information and Computer Technology

Chapter 3

Introduction to GIMP
Learning Objectives
After learning this chapter, learner will be able to:
State the purpose of Image Editing software.
List the features of Gimp.
Install Gimp Software from the provided link.
Change the size of an image.
Prepare the images for web.
Crop the parts of the images.
Understand the concept of Layers.

As you have worked with so many photo editing software such as Microsoft Paint,
Drawing of Open Office.org etc. Now, in this chapter you will learn how to work with
the images using GIMP software which is free and open source.

1. Image Editing Tools-Introduction


Image editing encompasses the processes of altering images, whether they are digital
photographs, traditional analog photographs, or illustrations. Traditional analog image
editing is known as photo retouching, using tools such as an airbrush to modify
photographs, or editing illustrations with any traditional art medium.
There are two basic ways that images can be adjusted. Pixel editing works at the pixel
level and requires altering the original image. Parametric Image Editing works by saving
instruction sets that change the appearance of images without actually changing the
original image data.

2. List of commonly used Image Editing Tools


(a) The GIMP: GNU Image Manipulation Program is free and powerful open source
image editing tool that provides retouching of photos, authoring of photos and
composition of photos.
(b) FastStone Image Viewer: The FastStone Image Viewer is an interactive application
that provides the image editing, image browsing and image converting. It supports
Introduction to GIMP

39

almost all major formats with some useful features including email facility, 150+
transitional effects, high-quality magnifier, scanning facility and image annotation.

(c) Serif PhotoPlus X4: The Serif PhotoPlus X4 offers a wide variety of features for
image editing in a very user-friendly environment. This tool offers photos organizer,
scrapbooking, greeting cards, and web galleries.
(d) Photo Impression 6.5: This tool provides the image-editing facility in a very simple
way. It automatically organizes all of your photos and lets you to print them effectively.

(e) PhotoStudio 6: The PhotoStudio 6 allows you to add animated text and stamping
facility on high-bit depth images. This tool also lets you to work with layers for
image editing purpose. You can easily transform your raw photos into good ones by
using this tool because of its ease and simple navigation.
(f) Picasa: Picasa is the kind of application that the built in editor is more than robust
enough for most casual users and includes basic color correction, cropping, and a
variety of special effectsthe majority of which manage to avoid being cheesy.
Picasa isnt a tool for deep and detailed editing but it is extremely easy to use for the
kind of quick crop and quick editing, most digital camera owners need.
(g) Paint.net: The interface of Paint.net is easy to pick up and an unlimited undo
function helps in correcting your learning, curve shapes, a snap making etc...
Paint.net is favourite among Windows users looking for a powerful image editor.
(h) Photo! Editor: Photo! Editor is powerful multifunctional software offering a
complete set of image editing tools. It contains everything a digital camera owner
might need to correct or enhance their photos. You will enjoy the ultimate
convenience and professional approach provided by each of the tools.
(i) Inkscape: The Inkscape is the open source image editing tool with standard features
making it the best alternative of the Adobe Photoshop. It allows the vector based
controls just like the Adobe Illustrator with powerful features. Most prominent
features of Inkscape are node-editing, bitmap tracing, direct XML editing, and alpha
blending. These features make the Inkscape a very powerful and free image editing
tool.
(j) Corel PaintShop Photo Pro X3: The Corel Paint Shop Photo Pro allows you to
adjust and clean-up your photos using the integrated photo organizer with advanced
enhancement tools. With the smooth interface and fast speed Corel Paint Shop
Photo Pro X3 makes it very easy for you to edit and organize your photos.
40

Information and Computer Technology

3. GIMP
3.1 Introduction
GNU Image Manipulation Program is free and powerful open source image editing tool
that provides retouching of photos, authoring of photos and composition of photos. It is
free and consists of many similar features provided by the Photoshop. Its available for
free for download distribution software that allows you to create image composition and
image authoring.

GIMP is a multi-platform photo manipulation tool. Most GNU/Linux distributions


include GIMP as a standard application. The GIMP is also available for other operating
systems such as Microsoft Windows or Apples Mac OS X (Darwin).
The GIMP is a Free Software application covered by the General Public License [GPL].
The GPL provides users with the freedom to access and alter the source code.

3.2 Features of GIMP are:


It can be used as a simple paint program
An expert quality photo retouching program.
An online batch processing system.
A mass production image renderer.
The advanced scripting interface allows everything from the simplest task to the

most complex image manipulation procedures to be easily scripted.


It can convert and save files to many file formats such as gif, jpef,tiff.etc

Introduction to GIMP

41

It can load and save animations in a convenient frame

as layer format.
Virtually unlimited images can be opened at one time.
GIMP works with

numerous operating systems


including Linux, Mac OS and Microsoft Windows.

Note
It is also available as a
part of Ubuntu no root
package from the Google
Play store on Android.

3.3 How to download GIMP from net


Steps to download GIMP:
Go to www.gimp.org
Then click on Download button

Click Download Gimp

42

Information and Computer Technology

The Download will start


john.doe@example.org

VERSION
DATE

Subscribes to Updates

STATUS
DOWNLOADS

We will only send you GTK+


and GIMP installers for
Windows related
information.

RATING

SourceForge

Find and Develop Software

About

Create a Project

Site Status

Software Directory

gimp-2.8.4-setup.exe
7.4/73.3 MB, 2 mins left

3.4 File Formats Supported in GIMP


Formats
TIFF
XWD
JPEG
XPM
GIF
PNG
PSD
PPM
BMP
PCS

Expansions
Tagged Image File format
X Window System
Joint Photographic Experts Group
X Pixmap
Graphics Interchange Format
Portable Network Graphics
Photoshop Document
Portable PixMap
Bitmap
Personal Computer Exchange

3.5 GIMP Compatible Platforms:


GNU/Linux (i386, PPC)
Microsoft Windows (XP, Vista, Windows 7)
Mac OS X
Sun OpenSolaris
FreeBSD

4. Starting GIMP
4.1. Open Gimp Software
Tip: GIMP was originally releasedas the general Image Manipulation Program,

Spencer Kimball and Peter Mattis. Development of GIMP began in 1995 as project
at the University Of California, Berkeley.
Introduction to GIMP

43

Step 1: Select Start All Programs GIMP 2

Adobe Bridge CS5 Adobe


Device Central CS5
Adobe ExtendScript Toolkit CS5
Adobe Extension Manager CS5

Lenovo ThinkVantage Tools


Getting Started
Microsoft PowerPoint 2010

Lenovo
Documents
Pictures

Notepad
Music

Control Panel

Change skin
Nero Burning ROM12

Music

Pictures

Computer
Control Panel

Free Skype voice and video


calls GIMP 2
Internet Explorer

Devices and Printers


Default Programs

Devices and Printers

Default Programs

Lenovo Device Experience

Lenovo ThinkVantage Tools

Help and Support

Microsoft FrontPage
Mozilla Firefox

Help and Support

7-Zip File Manager

Back

All Programs
|Search programs and files

Adobe Photoshop CS5


Adobe Reader 9
Business-in-a-Box
Installer Default Programs
Desktop Gadget Gallery

Computer
GIMP 2
Calculator

Documents

AVG PC TuneUP

Adobe Photoshop CS5

Lenovo

Adobe Help
Adobe ImageReady 7.0
Adobe Photoshop 7.0

|Search programs and files

Shut down

Shut down

Step 2: The GIMP 2 window appears.


GNU Image Manipulation Program

File Edit Select View Image Layer Colors Tools Filter s Windows Help
Layers - Brushes

Mode: Normal
Opacity

100.0

Lock:

GIMP Startup

Starting Extensions
extension.script-fu

44

lte r
2. Hardness 050 (51 10)

Information and Computer Technology

4.2 To create a New File

GNU Image Manipulation Program


Edit Select View

1. Click on File Menu

New...

Create

2. Select New option

File
Tools Filters Windows Help

Image Layer Colors

Ctrl+N

Open...

Open as Layers...

3. Type the height


/Choose a template

or

width

Open Location...

Ctrl+O
Ctrl+Alt+O

Open Recent
Save

4. A dialog box appears; using this

Save As...

Ctrl+S

Save a Copy...

Shift+Ctrl+S

you can select the template and


specify the size by setting values for both height and width.
Create a New Image

Select
Template
Type the
height and

width

Create a New Image

Template:

Template:
640480

Image Size

Image Size

800600

Width:

Width:

640

Height:

400

1024768
Height:

16001200

px

A3 (300ppi)

640400 pixels
72 ppi, RGB color

Advanced Options
Help

Reset

A4 (300ppi)

Advanc

A5 (300ppi)
A6 (300ppi)

Help

B4 (300ppi)
B5 (300ppi)

Cancel

B5-Japan (300ppi)
US-Letter (300ppi)
US-Legal (300ppi)
Toilet Paper (US,
300ppi) CD cover
(300ppi) Floppy label
Web banner common 46860
Web banner huge 72890
PAL - 720576
NTSC - 720486

5. Press OK.
A new blank image file is created. Now, you can use the tools and create your own
drawings.
[Untitled]-43.0 (RGB color, 1 layer) 640480 GIMP
File Edit Select View Image Layer Colors Tools Filter s Windows Help
Layers - FG/BG

Mode: Normal

Toolbox

Opacity

100.0

Lock
Background

Brushes

FG/BG Color

You can
drop
dockable

700.0, 85.0

Introduction to GIMP

100% Click to paint (Ctrl to pick a color)

45

4.3 Opening an existing file

GNU Image Manipulation Program


File Edit Select View Image Layer Colors Tools

You can open an existing GIMP file or any


other saved image of GIMP.

New...

Ctrl+N

Create
Open...

To open an existing file, follow the given steps.

Ctrl+O

Open as Layers...

Ctrl+Alt+O

Open Location...
Open Recent

1. Click on file Menu

Save

2. Select Open option

Ctrl+S

Save As...
Save a Copy...

Shift+Ctrl+S

3. Select the file name and click on Open button


Open Image
Recently Used
Places
Search

Preview

Evolution of technology_1_0001.xcf

Recently Used

371.0 KB Friday
37.7 KB 7/30/2012

Evolution of technology_1_0001.jpg

Lenovo
Desktop
Windows7_OS (C:)
DVD RW Drive (D:)
Lenovo_Recovery (Q:)

Evolution of t...y_1_0001.xcf
379.9 kB

Documents

Preview is out of date

Pictures

All Images

Select File Type (Automatically Detected)


Help

Open

Cancel

File Edit Select View Image Layer Colors Tools Filters Windows Help
Layers - FG/BG

Mode Normal
Opacity

Toolbox

10

Lock
Evolution

Brushes

FG/BG Color

You can
drop
dockabl

px

100%

Click to paint (Ctrl to pick a color)

Selected file will be opened.

46

Information and Computer Technology

4.4 Saving a File


To save your file, follow the given steps:

File Edit Select View


New...

1. FILE SAVE/SAVE AS

Create
Open...
Open as Layers...

2. The Save Image dialog box appears


Give a name to the file, select the format of the image and
click on save button.

Image Layer
Ctrl+N
Ctrl+O
Ctrl+Alt+O

Open Location...
Open Recent
Save
Save As...

Ctrl+S
Shift+Ctrl+S

Save a Copy...
Revert
Export to

5. Understanding GIMP window


Title Bar
Toolbox
Ruler

[Untitled]-1.0 (RGB color, 1 layer) 1024768GIMP


File Edit Select View Image Layer Colors Tools Filters Windows Help
Toolbox

Toolbox
Canvas

You can
drag
dockable
dialogs
here

429.0, 619.5 px

66.7%Click to paint (Ctrl to pick a color)

Status Bar

The main components of the GIMP Window are as follows:


Title bar
Menu bar

Toolbox

Ruler

Introduction to GIMP

47

you can change to other units. One of the most important uses of rulers is
to create guides. If you click on a ruler the guidelines will be created,
which helps you to position things accurately.
Status bar The Status Bar is placed at the `bottom of the image. Most of the time, by
default, it shows which part of the image is currently active, and the
amount of system memory that the image is consuming. The status area
displays, what operation is being performed, and its state of progress.
Canvas The most important part of the image window is of course the image display or
canvas. It occupies the central area of the window surrounded by a
yellow dotted line showing the image boundary against a neutral grey
background. You can change the zoom level of the image display in a
variety of ways, including the Zoom setting described below.

5.2 Tool box


The GIMP has a diverse assortment of tools that lets you perform a large variety of tasks.
Various Tool used in gimp are as follows:5.2.1 Rectangle Select Tool
[R]
The Rectangle Selection tool is designed to select rectangular regions of the active layer.
It is the most basic of the selection tools, and very commonly used.
5.2.2 Oval Selection Tool

[E]

The Oval Selection tool is used to select circular and elliptical regions from an image,
with high-quality anti-aliasing if you want it.
5.2.3 Lasso Tool

[F]

The Free Selection tool, or Lasso, lets you select a drawing it free-hand with the pointer,
while holding down the left mouse button. When you release the mouse button, the
selection is closed by connecting the current pointer location to the start location with a
straight line.
5.2.4 Fuzzy Selection (Magic Wand) Tool
[U]
The Fuzzy Select (Magic Wand) tool helps you to select areas of the current layer or
image based on colour similarity. The Wand is a good tool for selecting objects with
sharp edges.

48

Information and Computer Technology

Rectangle Select tool


Lasso too

Select by color

Oval select tool


Fuzzy select tool tool

Scissors tool

Foreground select tool

Paths tool

Color picker tool

Zoom tool

Measure too

Move tool

Alignment too

Crop tool

Rotate tool

Scale tool

Shear tool

Rectangle Select

Flip tool

tool Cage transform

Text tool

Bucket fill tool

Blend tool

Pencil tool

Paintbrush tool

Eraser tool

Airbrush tool
Clone tool

Ink tool
Heal tool

Perspective tool

Blur/sharpen tool

Smudge tool

Dodge/Burn tool

Foreground color

Background color

5.2.5 Select By Colour


[Shift + O]
The Select by Colour tool is used to select areas of an image based on colour similarity. It
works a lot like the Fuzzy Select tool (Magic Wand). The main difference between
them is that the Magic Wand selects contiguous regions with all parts connected to the
starting point by paths containing no large gaps; while the Select by Colour tool selects
all pixels that are sufficiently similar in colour to the pixel you click on, regardless of
where they are located.
Introduction to GIMP

49

5.2.6 Text Tool

[T]

The Text tool places text into an image. You can write your text directly on the canvas.
As you type your text, it appears on the canvas in a rectangular frame.
5.2.7 Eraser Tool

[Shift + E]

The Eraser is used to remove areas of colour from the current layer or from a selection of
this layer. If the Eraser is used on something that does not support transparency, then
erasing will show the background colour as displayed in the Colour Area of the Toolbox
5.2.8 Bucket Fill Tool

[Shift + B]

This tool fills a selection with the current foreground colour. If you Ctrl + click and use
the Bucket tool, it will use the background colour instead.
5.2.9 Colour Area
This area shows GIMPs basic palette consisting of two colours; the foreground and the
background which are used for painting, filling, and many other operations. Clicking on
either of the colour displays brings up a Colour Editor dialog, which permits you to
change it.

6. Menus of Gimp window


6.1 File Menu
File
New...
Create
Open...
Open as Layers...
Open Location...
Open Recent

File Menu

50

Ctrl+O
Ctrl+Alt+O

Save
Save As...
Save a Copy...
Revert

Ctrl+S
Shift+Ctrl+S

Export to
Export...
Create Template...

Ctrl+E
Shift+Ctrl+E

Page Setup
Print...

Contains the most commonly


used commands related to
GIMP file.

Ctrl+N

Ctrl+P

Properties
Close
Close all
Quit

Ctrl+W
Shift+Ctrl+W
Ctrl+Q

Information and Computer Technology

6.2 Edit Menu


Edit
Undo
Redo
Fade...
Undo History
Cut
Copy
Copy Visible
Paste
Paste Into
Paste as
Buffer
Clear
Fill with FG Color
Fill with BG Color
Fill with Pattern
Stroke Selection...

Edit Menu

Stroke Path...
Preferences

It contains the commands related to the handling


of information i.e. cut, copy and paste and other
selection commands.

Input Devices
Keyboard Shortcuts
Modules
Units

6.3 Image Menu


Image
Duplicate

Ctrl+D

Mode
Transform
Canvas Size...
Fit Canvas to Layers
Fit Canvas to Selection
Print Size...
Scale Image...
Crop to Selection
Autocrop Image
Zealous Crop

File Menu

It contains commands which are used to


edit the entire image or specific part of an
image or active layer.

Merge Visible Layers...

Ctrl+M

Flatten Image
Align Visible Layers...
Guides
Configure Grid...
Image Properties

Alt+Return

7. Editing the Images


7.1 To change the Size of an Image (Scale)
If you have a huge you want to put it nicely for viewing on a web page. GIMP is a quick
solution. The first thing that you might notice is that GIMP opens the image at a logical
Introduction to GIMP

51

size for viewing. So, if your image is really big it will display it zoomed out until it
fits nicely on the canvas
Set the Resolution of image
Set the Interpolation Quality
Click on Scale to confirm.
File
Edit
Select
View
Image
Layer
Colors
Tools
Filter s

Duplicate

Help

Fit Canvas to Layers


Fit Canvas to Selection

Windows

Ctrl+D

Mode
Transform

Scale Image

Canvas Size...

Scale Image
[Untititled]-3

Image Size

Print Size...

Width:

Scale Image...

640

Height:

400

Crop to Selection

px

640400 pixels

Autocrop Image
Zealous Crop
Merge Visible Layers...

Ctrl+M

Flatten Image
Align Visible Layers...

X resolution:

72.000

Y resolution:

72.000

pixels/m

Quality
Interpolation: Cubic

Guides

Help

Configure Grid...
Image Properties

Reset

Scale

Cancel

Alt+Return

7.2 How to prepare images for web


To make your jpeg images smaller without changing the pixel and width of the image,
you can change the size (bytes) of the image a lot.
Step 1:
To prepare this image for the web, you first need to reduce the image to a better width
and height for web according to the scale.
Step 2:
In File select Export...
In the JPEG Save Dialog, you can opt for GIMP defaults which reduce the size quite a
bit, without hurting the visual quality of the image. If you would like to make it smaller
still, change the compression level by moving the Quality slider down. You can see
the quality of the image changing.
52

Information and Computer Technology

File Edit Select View Image Layer


New...
Create
Open...
Open as Layers...

Ctrl+N
Ctrl+O

Export Image as JPEG


Quality:

Ctrl+Alt+O

Show preview in image window

Open Locations...

Advanced Options

Open Recent
Save
Save As...
Save a Copy...
Revert

100

File size: unknown

Optimize

Ctrl+S
Shift+Ctrl+S

Smoothing:

Progressive

0.00

Use restart markers

Interval (MCU rows): 16

Save EXIF data

Subsampling:

4:4:4 (best quality)

Save thumbnail

DCT method:

Integer

Save XMP data

Export As...
Create Template...

Use quality settings from original image

Shift+Ctrl+E

Comment

Page Setup
Print...

Ctrl+P

Properties
Close View
Close all
Quit

Ctrl+W

Load Defaults Save Defaults

Shift+Ctrl+W
Ctrl+Q

Help

Export

Cancel

7.3 How to Crop an Image


It is used to select a specified area which you want to focus and removes the
unwanted parts or everything outside the selected area of a picture.
To get to the crop tool, you can either push the button on the toolbox
the image and follow the instructions:

or right click on

Tools Transform Tools Crop & Resize

This will change the cursor and allow you to click and drag a rectangular shape.
Always click on the approximate upper left corner and drag to the lower right corner.
Tools Filter s Windows

Help

Selection Tools
Paint Tools
Transform Tools
Color Tools
Paths

Color Picker

Zoom

Measure
Text

Original Image

Cropping an Image

Introduction to GIMP

Shift+M
T

Align

Move

Crop

Shift+C

Rotate

Shift+R

Scale

Shift+T

Shear

Shift+S

Perspective

Shift+P

Cropped Image

Cropped Image

53

8.1 Layers
Layers are wonderful tools, especially to create collages or to delete various portions of an
image. In GIMP, the layers are virtually stacked up on top of each other; the lower layers
will show through resulting in a composite image that can be exported as a flat file such as a
JPEG or PNG. The separate elements of the composite image can be kept on separate layers;
return to the layered file and easily edit it before saving a new flattened file.

You will learn about layers in detail in Class X.

Summary
Image editing encompasses the processes of altering images
The GIMP GNU Image Manipulation Program is free and powerful open source image
editing tool that provides retouching of photos, authoring of photos and composition of
photos.
The Rectangle Selection tool is designed to select rectangular regions of the active layer.
Canvas is the part of the image window where the image is displayed.
The Oval Selection tool is used to select circular and elliptical regions from an image.
The Lasso tool allows you to select a drawing with the free-hand.
The Fuzzy Select tool helps you to select areas of the current layer or image based on colour
similarity.
The Text tool places text into an image.
The Eraser tool is used to remove areas of colour from the current layer or from a selection
of this layer.
The Bucket Fill tool fills a selection with the current foreground colour.
The Colour area shows GIMPs basic palette, consisting of two colours, the Foreground and
Background, used for painting, filling, and many other operations.
Cropping is used to select a specified area which you want to focus and removes the
unwanted parts or everything outside the selected area of a picture.
Layers are transparent sheets stacked one on top of the other. You can see through
transparent areas of a layer to the layers below.

54

Information and Computer Technology

A. Multiple Choice Questions:


1. GIMP is image an _________ editing tool.
(a) Open source
(c) Shareware

(b) Proprietary
(d) Both (a) & (b)

2. The ________ tool allows you to select a drawing with the free-hand.
(a) Fuzzy Selection
(b) Lasso
(c) Text
d. Bucket Fill
3. The Fuzzy Select (Magic Wand) tool helps you to select areas of the _______.
(a) Canvas
(b) All the layers
c. Current Layer
(d) Image with different colours
4. Shift+ C is the shortcut to _______ the image.
(a) Duplicate
(b) Delete
(c) Copy
(d) Crop
5. To prepare the images for the web means
(a) Reducing the size of an image
(c) Crop the image

(b) Zipping the image


(d) All of the above

6. GIMPs basic palette, consisting of ________ colours.


(a) Three
(b) Two
(c) One
(d) Many
7. _________ are transparent sheets stacked one on top of the other.
(a) Layers
b. Canvas
(c) Windows
(d) None of the these
8. Scale option is used to change the _________ of an image.
(a) Colour
(b) Size
(c) Area
(d) All of the above
9. It is the most important part of the image window where the image is displayed.
(a) Canvas
(b) Window
(c) Scale
(d) Size
10. The ______ tool places text into an image.
(a) Fuzzy Selection
(c) Eraser

(b) Text
(d) Bucket Fill

B. State True(T) / False(F)


(a) Paint.net is most favourite of windows users. (T/F)
(b) The Corel Paint Shop Photo Pro allows you to adjust and clean-up your photos. (T/F)

Introduction to GIMP

55

(c) GIMP is open source image editing tool. (T/F)


(d) Faststone image viewer has only 120 image transitional effects.

C. Fill in the blanks


(a) The Corel Paint Shop Photo Pro allows you to use the ______________ with advanced
enhancement tools.
(b) The PhotoStudio 6 provides the feature for adding ____________ and stamping facility
on high-bit depth images.
(c) _______________ is the most powerful image editing tool.
(d) _______________ is the tool not for detailed editing.
(e) GIMP is presented in ________ forms.
(f) Layers are wonderful for creating ______________.
(g) Cropping removes ____________ or everything outside _________________.
(h) GIMP 2.8 defaults to ________________ window mode.

D. Answer the following questions:


Q.1. What is image editing ?
Q.2. List few image editing tools available.
Q.3. Explain GNU Image Manipulation Program ?
Q.4. What is Photo retouching ?
Q.5. Download GIMP on your PC/Laptop and paste snap shot of your work according to
your download.
Q.6. Write down the expansions of the following :
(a) .gif
(b) .png
(c) .tff
(d) .jpeg
(e) .jpg
(f) .psd
(g) .bmp
Q.7. Explain functionality of the following :(a)

(b)

(c)

(d)

Q.8. Discuss how to change the size of an Image.


Q.9. How we can prepare images for web?
Q.10. What do you understand by Layers?

56

Information and Computer Technology

E. Lab Session
1. Take your family picture, scan it and change the background colour and clothes colour
using paint tools and layouts.
2. Design your Birthday party invitation using appropriate tools.
3. Import an image file of your choice. Change the foreground and the background color,
use a text tool to give a heading to your file. Select the text tool and type your name in
blue color. Select a portion of the picture and then change the direction. Save the file.
4. Make a collage on heritage of India
5. Design digital poster on Global Warming.

Introduction to GIMP

57

Chapter 4

Introduction to HTML
Learning Objectives
By the end of this chapter, learner will be able to:
Understanding of basic structure of HTML
Learning of various container and empty tags
Learn various html tags and their syntax.
Understanding of formatting elements of HTML

Introduction
HTML refers to Hypertext Markup Language. There is a special kind of text used by web
browsers that represents the data. This data may be in the form of letters, images, audios
or videos. This special text is given emphasis, which some people may say, it is marked
up through a link to the other documents. Thus a page formed using the special text is
called a document or a webpage. A webpage can get opened in a web browser. The web
browser accesses the web page from the web server (a place which holds most of the
webpages). A web server may be placed anywhere in the world. This means that a web
browser can access a webserver only if it connects to internet (network of networks
across globe). The HTML was founded by the group called World Wide Web
Consortium in 1990.

1. Overview of HTML
1.1. Who Invented HTML
HTML was invented in November 1990 by a scientist called Tim Berneses-Lee. The
purpose was to make it easier for scientists at different university to gain access to each
others research documents.

1.2 A Brief history


HTML is not an invention but an improved version of Standard Generalised Markup
Language(SGML).SGML is a Meta Language (general -- purpose language)used for
defining and creating descriptive markup language.
58

Information and Computer Technology

1.3 What tools do you need?


To get started with html documents, only two basic things are required
A text editor/HTML editor

A Web Browser

1.4 Tags and Attributes


The World Wide Web Consortium has given a set of standards while building the HTML
language. The W3C uses some special words to define an action.
A tag is a special word enclosed in angle-brackets < >. A tag tells the browser to perform
an action as asked by the special word. The special word may be written either in lower
case or upper case. The browser will respond to both the cases equally.
The HTML tags are normally comes in pair of start and end tag(an opening tag and closing
tag). While the start tag is written in the beginning of the element as <SpecialWord>, the end
tag is written at the completion of the element as </SpecialWord>.

For example: When you want to begin with writing source code using HTML, you write
the start tag as <HTML> and when you have completely written in the HTML document
and want to end it, you write the end tag as </HTML> i.e. insert a forward slash followed
by HTML in angled brackets.
The characteristics or the features of a tag are defined by an attribute. An attribute is used
inside a tag. An attribute always takes a value to help the browser perform the specific task in
a particular direction. There may be more than one attribute used inside a tag.

An element is a combination of a start tag, the text(we also use text to insert graphics)
and the end tag.
For example:
<body> element begins with start tag, followed by text and ends with end tag.</body>
In simple words, one can equate an element to a block, a tag to an instruction and an
attribute to an extension to a instruction.
Container of Tags: One set of tags may contain another set of tags. This is called nesting
of tags. The second block of tags is always contained in first block as shown below:
<TAG1> <TAG2></TAG2> </TAG1>
<TAG1> and </TAG1> is the first block of tags. <TAG2> and </TAG2> is the second
block of tags.
Introduction to HTML

59

2. Structure of HTML document


The basic structure of HTML document is shown below:
<HTML>
<HEAD>
<TITLE> The Structure of HTML Document </
TITLE>
</HEAD>
<BODY>
The Body of the HTML
Document </BODY>

First section

Second section

</HTML>

The basic structure of the HTML document is divided into two sections namely, the head
and the body. The browser enters the first section after executing the start tag of HTML
(telling the browser to begin interpreting the HTML commands) and start tag of HEAD.
The first section helps in changing the heading on the title bar of the HTML document
(the webpage). The starting of the heading is shown after the start tag of TITLE and the
end is shown by </TITLE>. The end tag of HEAD i.e. </HEAD> tells the browser that
the end of first section has come.
The second section begins with the start tag of BODY. The data on the webpage is
displayed through the tags used in this section. The end tag of BODY i.e. </BODY> tells
the browser that no more data is to be inserted on the webpage and the end of the web
document has come. After the completion of this section, the slash HTML or the end tag
of HTML tells the browser to stop looking for HTML commands. This implies that any
tag used after the end tag of HTML will not be interpreted by the browser and so no
action will be performed.
Please Note: All the sentences containing any number of whitespaces written inside a tag
within the body element will appear as written in the HTML code. Any whitespace
inserted outside the tag within the body element will be interpreted as null, void or
amounting to nothing by the browser. That is, such whitespaces outside the tag will not
appear anywhere on the webpage.

3. Saving the HTML document


When you have finished writing the HTML code in the text editor, click on File menu and
select Save option. This opens a window, which asks you to save the file in a folder and
60

Information and Computer Technology

give a name and an extension to the file. The extension in this file will be .html or .htm.
(e.g. basic.htm or firstHTMLDocument.html). This will turn the file into a webpage.
In order to modify the webpage, either open the web page and click on Viewsource or
open the webpage with notepad.

4. Container and Empty Tags


Before we proceed further to formatting tags, it is necessary for you to understand the
difference between the container and the empty tag. A container tag has both the start
and the end tag. The text or the graphic is inserted inside the beginning and end tag of the
container tag. For example: <body>This is a container tag</body>. The <BODY> tag
here is a container tag which has both the beginning and the ending tag and the text in
between both the tags.
The empty tag is a stand-alone tag. This implies that such a tag has beginning but no ending
tag. For example: The <BR> tag is used for adding one line break. Such a tag does not need
an end so as to tell the browser, that end of line break has come because there is no need.
Such a tag is called empty tag. HR is another empty tag. This tag is used to insert a
horizontal rule on the web page. Comment tag is also an empty tag. This tag is ignored by
the browser. This tag is used to increase the readability of the HTML source code. With this
tag, you can insert a description about a command. This is written as : <!--, followed by
description or remark on a command, followed by -->. For example: <!-- Hello -->

<BODY></BODY>
The second section of the webpage begins with the <BODY> tag. This defines the visible
section of the document. It has a number of attributes which controls the overall appearance
of the document. The attributes that are used with this tag are listed below in the table:
Attribute of the <body> tag Description
BGCOLOR

The background of the webpage is displayed with a color that


has been taken as value by this attribute.

BACKGROUND

The background of the webpage is displayed with an image


whose address is taken as value by this attribute.

TEXT

Specifies the color of the text in the document.

LINK

Defines the color of the link in the document

ALINK

Defines the color of the active link in the document

VLINK

Defines the color of the visited link in the document

Introduction to HTML

61

4.1 Formatting Elements


In a web page, the text is an important component especially when there is no picture or
graphic. It becomes therefore necessary to change the style of text at every paragraph, so
that they become presentable. There are a number of tags that help you to format the text.

4.1.1 <Heading Tags>


Heading tag is used to display the heading or the main topic on the web page. This tag
varies from H1 to H6. This is a container tag. The heading tag <H1> shows the heading
with the largest font size. As you increase the number in the heading tag, the font size
goes down as shown in the example given below:
<H1> This text is in largest font i.e. H1 font </H1>
<H2> This text is in larger font i.e. H2 font </H2>
<H3> This text is in medium large font i.e. H3 font </H3>
<H4> This text is in medium small font i.e. H4 font </H4>
<H5> This text is in smaller font i.e. H5 font </H5>
<H6> This text is in smallest font i.e. H6 font </H6>
The above code produces the following output:
C:\Users\HP\Music\Desktop\audio.html
File Edit View Favorites Tools Help

C:\Users\HP\Music\Desktop...
Close Tab (Ctrl+W)

This text is in largest font i.e. H1 font


This text is in largest font i.e. H1 font
This text is in medium large font i.e. H3 font
This text is in medium large font i.e. H3 font
This text is in smaller font i.e. H5 font
This text is in medium large font i.e. H6 font

02:26
06-03-2013

We can see from the output that the size of the font keeps decreasing as one increases the
number in the heading tag.
62

Information and Computer Technology

4.1.2 The <FONT> tag


The FONT tag is a container tag that has a number of attributes listed below in the table

Attribute of the <font> tag


FACE
SIZE
COLOR

Description
Sets the text to the name of the font used as its value.
Decides the scale of the text. It can range between -7 and
+7.
Changes the color of the text written inside the container
tag.

The following example will help you understand the use of FONT tag.
<font face=Book Antiqua>This is in Antiqua typeface</font>
<font color=#ff0000>Red</font>
<font color=#00ff00>Green</font>
<font color=#0000ff>Blue</font>

<font size=+5> this text is 5 points big</font>


<font size=-3> this text is 3 points smaller than regular text </font>

The above code produces the following output:


le:///C:/Users/RES_4/Desktop/test.html

This in in Antiqua typeface Red Green Blue

this text is 5 points big

this text is 3 points smaller than regular text

Please Note: The face name is case insensitive.


Font tag can be nested. We can understand this by an example.
<font size=+3>N<font color=red>e</font><font color=blue>s</font><font
color=green>t</font></font>

Introduction to HTML

63

The above produce the following output:


C:\Users\HP\Music\Desktop\tables.html

C:\Users\HP\Music\Desktop...

File Edit View Favorites Tools Help

Nest

4.1.3. Entering Paragraph Text on your Web page


A paragraph can be written on the web document using the <p> tag. This is a container
tag, though the </p> tag is optional. It uses one attribute called align that takes the value
left, right or center.
<FONT SIZE=+4><P ALIGN=CENTER>
This paragraph is centered.
</P>
</FONT>

In the above code, the align attribute takes the value center. The output of the above code
is:
C:\Users\HP\Music\Desktop\tables.html

C:\Users\HP\Music\Desktop...

File Edit View Favorites Tools Help

This paragraph is centered

4.1.4.The CENTER tag


Is needed to place the text in the center. Sometimes it may not be possible to use align
attribute again and again along with a tag. Then it is better to use nested form of center
tag once and use other tags inside the opening and closing center tags.
For example:
<center>
<font size=+2> the text will be center aligned because center tag is
used. <br>
The size of the text will be 2 points greater than the normal font size.
<br>
<hr>
<br>
<p>

64

Information and Computer Technology

With the P tag, we can begin a paragraph. The end of paragraph arises when the
browser sees the forward slash followed by P.
</p>
</font>
</center>

The above code produces the following output:


C:\Users\HP\Music\Desktop\audio.html

C:\Users\HP\Music\Desktop...

File Edit View Favorites Tools Help

the text will be center aligned because center tag is used.


The size of the text will be 2 points greater than the normal font size.
With the P tag, we can begin a paragraph. The end of paragraph arises when the browser sees the forward slash followed by P.

02:45
06-03-2013

Please note: In the above output, the line that separates the font tag with the paragraph
tag has been placed on the webpage using <hr> tag. The <hr> tag is an empty tag, similar
to <br>.
4.1.5. Bold, italics and underline
There are other tag that help in changing the style of the font. They make the text
boldface, italics and underlined. They are shown in the table below:
Tags
<B>, </B>
<I>, </I>
<U>, </U>

Meaning
Bold text
Italic text
Underlined text

For Example
The following code uses tag <I> in combination with header tag <H1>.
<H1><I>Heading Tag H1 is used with the Italics Tag</I></H1> <B><I>Both
the boldface and italics tags are used as nested tags</I></B>

Introduction to HTML

65

The above code produces the following output:


C:\Users\HP\Music\Desktop\audio.html

C:\Users\HP\Music\Desktop...

File Edit View Favorites Tools Help

Heading Tag H1 is used with Italics Tag


Both the boldface and italics tags are used as nested tages

02:32
06-03-2013

4.1.6 The following table gives a list of tag used in the chapter, with
their example and the output:
S. No. Start tag
1
<h3>

End Tag Example


</h3>
<H3>Use H1 or H2 or H3 etc. for
headings</H3>It automatically adds
a paragraph break after the heading.

<font
</font>
face=Arial>

You can <font face=Verdana, Arial,


Helvetica, sans-serif>change the
actual font used to some extent
within your text.</font> In this
instance, the browser will attempt to
use Arial; if not, it will ignore the
instruction.

66

Output
Use H1 or H2 or H3
etc. for headings It
automatically adds a
paragraph break after
the heading.
You can change the
actual font used to
some extent within
your text. In this
instance, the browser
will attempt to use
Verdana if the
computer has it;
if not, Arial; if
not, Helvetica; if
not, a generic sansserif font; if not,
it will ignore the
instruction.

Information and Computer Technology

S. No. Start tag


3
<font
size=+2>

End Tag Example


</font>
Increases <font size=+2>font size</
font> by the amount of the number.
You can also use <font size=2>negative</font> numbers.
<font color = </font>
You can <font
#0000FF>
color=#0000FF>change the font
color</font> within your text.
<p
</p>
Right aligned paragraph. <p
align=right>
align=right>You can use the p tag
as a container to align text to the
right</p>

6
7
8

<center>
<b>
<i>

</center> <center>Centers the text</center>


</b>
This is for <b>bold</b> text
</i>
This is for <i>italic</i> text

Output
Increases font size
by the amount of the
number. You can also
use negative numbers.
You can change the
font color within
your text.
Right aligned
paragraph.
You can use the p
tag as a container to
align text to the right
Centers the text
This is for bold text
This is for italic text

Summary
1. The World Wide Web Consortium has given a set of standards while building the HTML
language.
2. The basic structure of the HTML document is divided into two sections namely, the head
and the body.
3. A container tag has both the start and the end tag.
4. HR is another empty tag. This tag is used to insert a horizontal rule on the web page.
5. Heading tag is used to display the heading or the main topic on the web page. This tag
varies from H1 to H6.
6. A paragraph can be written on the web document using the <p> tag. There
7. Bold, Italic and Underline are those tags that help in changing the style of the font.

Introduction to HTML

67

A. Name the tag used for:1. Inserting a section break


2. Marking up text to appear bold
3. Marking up text to appear italic
4. To change the font size of the entire html document.
5. To write a paragraph aligned to the right side of the page.

B. Correct the errors in the following HTML code:


<HTML>
<TITLE> My first program
<BODY>
<P Align=centre> This is my first web program </P>
<HEAD>
<HTML>

C. Multiple choice Questions


1. Html uses
(a) Pre specified tags
(c) Fixed tags

(b) User defined tags


(d) Tags used for linking

2. What is the correct html tag for inserting a line break?


(a) <break>
(b) <br>
(c) <lb>
(d) <line break>
3. Choose the correct HTML tag to make the text bold
(a) <bold>
(b) <b>
(c) <large>
(d) <Big>
4. Choose the correct html tag for the largest heading
(a) <h1>
(b) <heading>
(c) <head>
(d) <h6>
5. How many blank line breaks will a browser create if you enter four <br> tag
(a) 5
(b) None
(c) 3
(d) 4

D. State True or False:1. Html is a case sensitive language.

68

Information and Computer Technology

2. SGML is an improved version of HTML.


3. A tag is a special word enclosed in angle-brackets < >.
4. HTML is divided into 3 sections head, title and body.
5. VLINK defines the link of active link.

E. Answer the following questions:Q.1. What is font tag? Name the various attributes of font tag.
Q.2. Difference between <br> and <hr> tag.
Q.3. Differentiate between LINK, ALINK and VLINK.
Q.4. Explain heading tag with the help of a suitable example.
Q.5. Difference between container tag and empty tag.
Q.6. Write down the basic structure of HTML document.
Q.7. How do you create a comment tag?
Q.8. Name and explain any 2 attributes of body tag.
Q.9. Name the tools required to create a html document.
Q.10. Write a short note on HTML.

F. Lab Session
Create a HTML document to print your name 5 times in 5 different fonts.
Write a HTML document to display the name of school in bold and italic both.
Create a HTML document containing three paragraphs with different alignments.
Create HTML document containing different heading tags.

Introduction to HTML

69

Chapter 5

HTML II
Learning Objectives
By the end of this chapter, learner will be able to:
Differentiate the different types of lists created in HMTL.
Display the data using Lists tag available in HTML.
Link web pages using <A> tag.
Insert audio & Video in a web page to make it more interactive.
Insert images in a web page.
State the purpose of Inline & external images.
Use images and Email addresses as hyperlinks.

Introduction
As we have already discussed in previous chapter about HTML. Hypertext Markup
Language is used by web browsers that represents the data. In this chapter, we will cover
advance formatting tags of HTML such as Lists, inserting images, videos, music and
creating links between two or more webpages.

1. HTML Lists
Lists provide the information in a structured and easy to read format. The data
item on the webpage can catalogued or indexed. The index that is formed using
numbers like 1,2,3,or symbols like , b, is called a List in HTML. These lists
help in formatting the data and put them in a particular order. There are three
types of lists that you can use in HTML. They are:
UL - creates an unordered or bulleted list
OL - creates an ordered or numbered list
DL - creates a definition or glossary list

The first two are very similar in structure, while definition lists have a unique setup. To
create either kind, first specify the start of a list and then identify each line item in the list
1.1 Unordered List <ul> .</ul>
It classifies the data items that have equal importance i.e. none of the data items are ranked.
They are identified by a symbol. It may be a square, a circle or a disc. The
70

Information and Computer Technology

attribute TYPE helps in using the symbols to create a list. This attribute takes the value as
the name of the symbol.
<ul type=square>
<ul type=disc>
<ul type=circle>

This is a container tag. It has both the opening and the closing tag. However the closing
tag is optional. The listing is created under it using the <li> tag. Again <li> tag is a
container tag. The data item to be listed is input between the opening <li> and the closing
</li> tag as shown in the following example:
For Example1:
<body>
<ul>
<li>apples </li>
<li>oranges</li>
<li>guava </li>

</ul>
</body>

In the above code the data item comprises of the fruits that have equal importance to the
user. They are listed using unordered list. When you do not use the attribute named type,
the default symbol is used i.e. disc. The output of the above code is:
C:\Users\HP\Music\Desktop\tables.html

C:Users\HP\Music\Desktop...

File Edit View Favorites Tools Help

apples
oranges

guava

17:53
06-03-2013

HTML II

71

If you want to change the symbol to circle, use the following code:
For Example2:
<body>
<ul type =circle>
<li>apples </li>
<li>oranges</li>
<li>guava </li>

</ul>
</body>

The output of the above code is:


C:\Users\HP\Music\Desktop\tables.html
File Edit View Favorites Tools Help

apples
oranges
guava

1.2 Ordered Lists <ol> </ol>


It classifies the data items that do not have equal importance. All the data items are
ranked. The ranking can be done using the numbers, the roman letter or alphabets. The
default symbol is number. In case you want to change to other symbols of ordered list,
you can use the attribute. The attributes used with this tag are given in the table below:
Attributes of <ol> tag
TYPE
START

Description
Changes the symbol used with the list. It takes the value as the
symbol itself i.e. it can be a or A or I or i or 1.
Begins the list with value specified. It takes the value of the
symbol from where to begin the list

For example 3:
<body>
<ol>
<li>Get up in the morning</li>
<li>Brush your teeth</li>
<li>Take the bath</li>
<li>Eat the breakfast</li> <li>Get
ready to go to school</li> </ol>

</body>

72

Information and Computer Technology

The above code produces the following output. Notice that the symbol used to create
the list is number. Thus number becomes the default symbol.
C:\Users\HP\Music\Desktop\tables.html

File Edit View Favorites Tools Help

1.
2.
3.
4.
5.

Get up in the morning


Brhsh your teeth
Take the bath
Eat the breakfast
Get ready to go to school

The start attribute allows you to further customize an ordered list by setting a new
starting digit for the ordered list element as can be seen in the following example:

For example 4:
<body>
<ol start=4 >
<li>Get up in the morning</li>
<li>Brush your teeth</li>
<li>Take the bath</li>
<li>Eat the breakfast</li> <li>Get
ready to go to school</li> </ol>

</body>

The above code produces the following output. Notice that the list begins from number
4 and the sequence is maintained after it.
C:\Users\HP\Music\Desktop\tables.html

File Edit View Favorites Tools Help

4.
5.
6.
7.
8.

Get up in the morning


Brhsh your teeth
Take the bath
Eat the breakfast
Get ready to go to school

The type attribute changes the symbol as shown in the following example.

HTML II

73

For example 5:
<body>
<ol type = a>
<li>Get up in the morning</li>
<li>Brush your teeth</li>
<li>Take the bath</li>
<li>Eat the breakfast</li> <li>Get
ready to go to school</li> </ol>
</body>

The output of the above code is given below. Notice that the symbol has changed
from default number to the alphabet.

C:\Users\HP\Music\Desktop\tables.html

File Edit View Favorites Tools Help

a.
b.
c.
d.
e.

Get up in the morning


Brhsh your teeth
Take the bath
Eat the breakfast
Get ready to go to school

1.3 Definition Term Lists <dl> . </dl>


Definition lists (<dl>) are the list elements that have an array of tags. The list prepared by
<dl> tag is similar to a dictionary. The other tags used with this are <dt> to define the
definition term and the <dd> for the definition of the list item.
C:\Users\HP\Music\Desktop\tables.html

File Edit View Favorites Tools Help

Clairvoyance
French work for ability to see events in the future.
Esprit de corps
French work for feeling fo pride and loyalty.

74

Information and Computer Technology

For example 6:
<dl>
<dt>clairvoyance</dt>
<dd>French word for ability to see events in the
future.</dd> <dt><b>Esprit de corps</b></dt>
<dd>French word for feeling of pride and
loyalty.</dd> </dt>
</dl>

The above code produces the following output. The opening <dl> tag starts the definition
list. The container <dt> tag opens the definition terms like Clairvoyance and Esprit de
corps. While the first word is in regular font, the second word is in boldface because
another container tag <b> is nested inside <dt> tag. The meaning of the definition term is
provided by <dd> definition description. Notice that the container tag <dd> presents the
definition description below definition term slightly right tabbed as shown in the output
window.

2. Image
2.1 Meaning of Image
An image add a flair to a webpage. The image in a web page is a drawing painted through
paintbrush or a photograph taken through a digital camera or a clipart. There are 2 types
of types of images. They are i) inline image ii) external image. The inline image is shown
when the webpage is opened in the browser. On the other hand, the external image is
shown only when demanded by the user by clicking on a link.

2.2 Inserting an inline image to the webpage


You can insert an image using the <IMG> tag. This tag does not have an end tag. The
basic syntax of <IMG> tag is given below:
<img src = address or the path to the image
file width=
height=
alt=
longdesc= htmlfilename>
Let us discuss the attributes one by one:

HTML II

75

2.2.1 SRC
The address or the path to the image is taken as value by SRC attribute. Let us discuss the
cases of different addresses that can be accepted by SRC attribute.
Case1
If you have saved Flower.jpg in Documents folder, then the address would be:
C:\My documents\My Pictures\Flower.jpg
Case2
If you have saved Flower.jpg in the same folder as the HTML document, then the
address would be: Flower.jpg
Case3
If Flower.jpg is not in your computer but is saved in folder images of the Web
server of yahoo, then the address would be:
http://www.yahoo.com/images/flower.jpg
2.2.2 Width and Height
The width and the height attribute defines the boundaries of image. The value can be an
absolute number (recognized as pixels) or in percentage (in proportion to the size of web
window).
For example7:
An image of height 150 pixels and width 200 pixels is inserted on webpage as:
<img src=flower.jpg width=200 height=150>

The output of the above code is as under. It displays an image of two white flowers on
the web page.

Note
The image is made of pixels. When you
increase the size of the image, the resolution of
the image gets decreased. This makes the image
less clearer to view. The width and height arent
strictly necessary but help to speed the display
of your Web page.

76

Information and Computer Technology

2.2.3 ALT
When the image does not get download (due to heavy traffic or unsupportive browser),
the user may expect a description of the image. The alt attribute is used for such
purposes as shown here:
For example 8:
<img src=flower.jpg width=200 height=150 alt=Two White Roses>

2.2.4. Longdesc
If the description is too long, you can even attach an html file, in another attribute called
longdesc. This attribute is complementary to alt attribute as shown:
For example 9:
<img src=flower.jpg width=200 height=150 alt=White Roses longdesc=abc.html>

2.2.5 Align
You can use the align attribute to place the image on left or right side of the webpage.
If the align attribute is set to left, the image floats to the left margin. If it is set to right,
the image floats to the right margin.
For example 10:
<p>
<img src=flower.jpg alt=White Roses width=32 height=21 align=left> The image
will be flowed to the left side of the webpage and this text will therefore be placed on right
side. </p>

In the above code the paragraph tag <p> helps in forming the paragraph to be displayed
along with the image on the webpage. Alt attributes describes the image when the
image cannot be displayed by the browser. Height and width attribute decides the
area of the image on the web page and the align attribute defines the position of the
image on the web page. Since the image is set to the left side, the text flows towards the
right side as seen in the output below:
The Image will be flowed to the ldft side of the webpage and this text will
therefore be places on right side.

HTML II

77

2.3 Inserting external image

Note
The external image can be
inserted on the webpage using
an anchor tag which may be
learnt from the later section of
the chapter.

An external image may be required in any of the


following situation:
1. When the image formats like BMP or PICT are
not supported by the browsers. Most browsers
support either GIF format or JPG format.
2. When an image is to be viewed in text-only browser

3. When you want to see the larger size of the inline image.

2.4 Inserting audio or video


When you prepare a webpage, an audio or moving picture makes the page impressive and
pleasing. When you want to show the operations of your business, you can do so by
inserting a movie. Both the audio and video can be inserted using a plug-in. A plug-in is a
small computer program that extends the standard functionality of the browser. You can
insert such plug-in using the <embed> tag. The embed tag acts as container to nonHTML resource.
2.4.1. The <embed> Element to insert audio
The <embed> tag defines a container for external (non-HTML) content. The non-HTML
contents are the objects other than the text and the graphics used in HTML. They are
sound effects, the video clips and moving pictures. If you want to insert a song at the
background of the webpage, use the following code to embed a MP3 file in the webpage.
For example 11:
<embed height=50 width=100 src=titanic.mp3>

The above code displays an audio player (of the dimensions as specified in the code) on
one corner of the web page as shown in the output. The songs begin to play, the moment
the webpage gets opened. However, the user can stop or pause the song whenever he so
desires. If you want to place the audio player in the center, you can use the center element
since it does not have another attribute to place it in center of the window.
C:\Users\HP\Music\Desktop\audio.html
File

78

Edit View Favorites Tools Help

Information and Computer Technology

2.4.2. The control and autoplay Attribute of <audio> tag.


The autoplay attribute of <audio> specifies that the audio will start playing as soon as
it is ready. The song inserted at the background of the webpage, use the following code to
embed and auto play a MP3 file in the webpage.
For example 12:
<audio controls autoplay>
<embed height=50 width=100
src=titanic.mp3> </audio>

The above code displays an audio player on


one corner of the web page as shown in the
output. The songs begin to play automatically,

C:\Users\HP\Music\Desktop\audio.html
File

Edit View Favorites Tools Help

the moment the webpage gets opened.


2.4.3. Inserting video
To make the webpage more interactive, you can insert a video in addition to sound in the
webpage. The video may be in the form of a video clip, or a video movie. A video file is
recognized by the extension .mp4 or .avi. use the following code to insert the video
movie at one corner. If you want to place the player in the center of the webpage, you can
use the center tag as shown below:
For example 12:
<body>
<center>
<embed height=250 width=320
src=movie.mp4> <br> <hr>
</center>
</body>

The above code produces the following output:


C:\Users\HP\Music\Desktop\audio.html

C:\Users\HP\Music\Desktop...

File Edit View Favorites Tools Help

Play

HTML II

79

2.4.4 Inserting video using control attribute


The control attribute specifies that video controls should be displayed (such as a play/
pause button etc). Use the following code to insert the video movie in the webpage, you
can use the control: attribute with embed tag as shown below:
For example 12:
body>
<center>
<video controls>
<embed height=250 width=320
src=movie.mp4> </video>
</center>
</body>

<The above code produces the following output:


C:\Users\HP\Music\Desktop\audio.html

C:\Users\HP\Music\Desktop...

File Edit View Favorites Tools Help

Play

2.4.5. Inserting video using preload attribute


This attribute was formerly known as autobuffer and it was an boolean attribute
as controls.
none - do not buffer video file automatically.
metadata - only buffer the metadata of video
auto - buffer video file before it gets played.

Use the following code to insert the video movie in the webpage, you can use the
preload attribute with embed tag as shown below:
80

Information and Computer Technology

For example 12:


<body>
<center>
<video controls preload=none>
<embed height=250 width=320
src=movie.mp4> </video>
</center>
</body>

The above code produces the following output:


C:\Users\HP\Music\Desktop\audio.html

C:\Users\HP\Music\Desktop...

File Edit View Favorites Tools Help

Play

3. LINKING
You can add more than one page in your website. These additional pages are linked to the
home page via a text or a picture. This linking is done using an anchor element in HTML.

3.1 Anchor Element: <a> .. </a>


An anchor element is used to create a hyperlink in a webpage. The word anchor has come
from the function performed by anchor in a ship. As an anchor supports the ship when it
reaches the shore, similarly, the document linked supports the text or the picture on the
homepage.
An anchor element consists of three parts.
1. The start tag <a> containing the attribute like href (mandatory), target (optional),
name (optional)
2. The text or the image to be hyperlinked
3. The end tag </a>.

HTML II

81

The basic syntax of anchor tag is:


<a href = Address of the supporting web
page target = _blank or _top
name = text>
text acting as hyperlink
</a>

The attributes of anchor tag are href, name and target. Let us discuss them:
1. HREF: The meaning of href is hypertext reference. This attribute is mandatory in anchor
tag. The href attribute takes the value as the address of the supporting document. Both the
relative and the absolute links can act as values to the href attribute.

For Example 13:


<a href =http://www.w3.org/>website of W3C</a>

To link to a page on another Web site you need to give the full web address. Such type of
link is absolute as it specifies both the protocol name i.e. http and the hostname i.e.
www.w3.org.
The relative link can only link to a page from the same site. If you were linking to a page
in the same folder, the href would be just page1.html as shown below:.
<a href=page1.html>

2. TARGET: The target attribute helps in opening a web page. The value _blank
opens the webpage in a new browser window. The value _top opens the linked
webpage in the currently active browser window.
For example 14
If you want to open the webpage in a new window, following code is to be used.
<a href=http://www.google.com target=_blank>Search Engine</a>

If you want to open the linked webpage in the same browser window as the current
one, following code is to be used:
<html>
<body>
<p>Open the webpage in a the current window</p>
<a href=http:// www.google.com / target=_top> Want to Google! </a>
</body>
</html>
82

Information and Computer Technology

The above code will open the webpage of google on clicking the link Want to Google
in the same browser window as the existing window. It will not open a new window to
load the webpage of google.com
3. NAME: NAME attribute gives a name to the anchor tag. This attribute takes the value as
text string. This helps in linking to a specific section within the webpage that has been
named.

For example 15:


If you have a long webpage with a section about sales, this section can be given a name
using name attribute as shown below. The purpose of the name is that

can

another anchor

link to the named anchor.


<A name=salessection>Sales Order Set Up</A>

Linking to the named anchor:


To link to a named anchor, add a hash mark (#) to the end of the Uniform Resource
Locator of the webpage followed by the name of the section, it will open.
For example 16:
To link to a section named salessection within the page called namedexample.html,
the following code is used:
<A href=namedexample.html#salessection>Sales</A>

If the link is to a named anchor in the same webpage then you dont need the file name of
the webpage, just the hash mark and the name of the anchor.
For example 17:
To link to the salessection in our existing webpage, the following code is to be used:
<A href=#salessection>Sales</A>

Please Note:
The named anchor itself doesnt have a hash mark
A link to the named anchor always has a hash mark.

<A name=salessection>
<A href=#salessection>

3.2 E-mail link


You can create an e-mail link on your page. The browser will read an e-mail link, using
the value starting with mailto: rather than http://, with your e-mail address rather than
a web address. The syntax is given below:
<A HREF=mailto:yourusername@emailaccountname.com>E-mail the username</A>

HTML II

83

For Example 18:


You want to create an email link to yourself, then the code would be:
<A href=mailto:myself@gmail.com>E-mail to myself!</A>

When the user would click on the link E-mail to myself!, the mailbox of gmail will get
opened with the address myself@gmail.com after the field To .

3.3 Image as a Link


The basic syntax to create an image link is:
<a href=address of the file to be opened when you click on the image>
<img src=address of the image file alt=text to be displayed when image is not loaded>
</a>

The attribute src in <img> tag takes the value of the address to the image whereas, href
attribute takes the value of the address of the HTML document that will be loaded when
you click on the image.
For example 19:
You want to open the website of Facebook when somebody click on the image that is
called Facebook.jpg, then the code would be:
<a href= https://www.facebook.com/>
<img src= facebook.jpg>
</a>

3.4. Colors of the link


You can set the color of text that acts as a link using <body> tag. The general syntax is:
<body link =#hexadecimal code of the color or the nameofcolour
vlink=#hexadecimal code of the color or the nameofcolour
alink=#hexadecimal code of the color or the nameofcolour >

In the above code, the link attribute in the <body> tag is a standard link. It is a text link
that has not been clicked by the user, yet. It appears in its standard color i.e. blue whose
hexadecimal code is 0000FF.
The vlink attribute in the <body> tag is a visited link. It is a text link that has been
clicked by user at least once. The standard colour of this link is purple whose
hexadecimal code is 800080.
84

Information and Computer Technology

The alink attribute in the <body> tag is an active link. It is a text link that may change its
colour when the user brings the mouse over it. The standard colour of this link is red
whose hexadecimal code is FF0000.
For example 20:
If you want to set the colour of the link to red, alink to green and vlink to pink as against
their standard colours, use the following code:
<BODY link=red alink=green vlink=pink>

For example 21:


If you want to use a hexadecimal number for the
above colours, following will be the code:
<body link=#FF0000 alink =#04B45F vlink =#FF00FF >

Note
The hexadecimal code of
the colour can be seen
from the website: http://
html-color-codes.info/

Summary
Lists provide the information in a structured and easy to read format. There are three types
of lists : OL,UL & DL.
UL tag classifies the data items that have equal importance i.e. none of the data items are
ranked. They are identified by a symbol. It may be a square, a circle or a disc.
OL tag classifies the data items that do not have equal importance. The data items in a list
are represented using numbers, the roman letter or alphabets. The default symbol is number.
Definition lists (<dl>) are the list elements that have an array of tags. The other tags used
with this are <dt> to define the definition term and the <dd> for the definition of the list
item.
The image in a web page is a drawing painted through paintbrush or a photograph taken
through a digital camera or a clipart. There are 2 types of types of images: i) inline image
ii) external image.
The <embed> tag defines a container for external (non-HTML) content. They are sound
effects, the video clips and moving pictures.
An <a> (anchor) tag is used to create a hyperlink in a webpage. An anchor element consists
of three parts : (1) href (mandatory), target (optional), name (optional), (2) the text or the
image to be hyperlinked and (3) the end tag </a>.
An e-mail link can be created in a web page using mailto: attribute.

HTML II

85

A. Multiple Choice Questions:


1. What is the correct html command for inserting an image?
(a) <image src=image.gif>
(b) <img> image.gif</img>
(c) <img src=image.gif>
(d) <img href=image.gif>
2. Which one of the following is the list type that will create a bulleted list?
(a) Unordered
(b) Option
(c) Decorated
(d) Ordered
3. Which html tag is use to render text as italics?
(a) <b></b>
(b) <i></i>
(c) <ital></ital>
(d) Text style=italics
4. We can view the source code of html in
(a) Notepad
(c) Excel

(b) Power point


(d) Paint

5. To wrap the text to the next line, the tag used for
(a) <BR>
(b) <P>
(c) <I>
(d) <LI>

B. Give one line code for the following


(a) To make My School Web Page as the title of a web page.
(b) To change the background color of a web page to blue.
(c) To insert a horizontal line of yellow color
(d) To insert an image pic1.jpg onto web page .
(e) To insert the list as given below:
(i) SHIVANK
(ii) SARTHAK
(iii) SANYAM

C. From the list given below pick the correct answer:


BGCOLOR, HEAD, HTML, VLINK, P, FONT, SIZE, I
(a) This attribute defines the size of the text in the font element.
(b) This attribute changes the background color of a web page.
(c) This tag displays text in italic.
86

Information and Computer Technology

(d) This element identifies the document as an HTML document.


(e) This element defines the HTML header and does not affect the appearance of the
document.
(f) This element is used to insert a line break with extra spaces in the starting.
(g) This element changes the color of the visited link.
(h) This element displays text or characters in a specific style and size.

D. Answer the following questions


Q.1. What is the difference between ordered list and unordered list?
Q.2. Distinguish between href and name attributes of <A> tag with the help of each.
Q.3. Define Definition term with the help of a suitable example
Q.4. Which three tags are used to create definition lists?
Q.5. Differentiate <BODY BACKGROUND> and <IMG> Tag.
Q.6. Your schools web address is www.littlebuds.com. You want to create a link to this web
site from your web page. Write the HTML code you will use to do this.
Q.7. Difference between <A> as an anchor and <A> as a link
Q.8. Create an ordered list of the name of the subjects you study in
school. Q.9. Name and explain the various attributes of <UL> tag.
Q.10. How can we set the color of text that acts as a link in a web page? Explain with the help
of an example.

E. Lab Session
1. Shivank wants to make a list of vegetables in a web page. He has typed all vegetables
name without any formatting. Suggest the type of list for his web page?
2. Write an HTML document to print name of your friends in an unordered format.
3. Create an unordered list of your hobbies.
4. Nehas parents wants to create a web page as an invitation for his Graduation Party and
send this to all his friends. Can you help them in designing this invitation using the details
given below:
(a) Title as Party.
(b) Web page color as Yellow
(c) Pic1.jpg as an image in the center of the page.
(d) lets Rock as the heading below the image in red color
(e) With 2 lines break place the text of size 12 and color BLUE

HTML II

87

5. Create a website for Travel & Tourism company, which should include 3-4 webpages.
6. Create a homepage for your school website that includes the following:
(a) Title
(b) Image of school building
(c) List of school activities
(d) Video of School infrastructure
(e) Photo gallery

Suppose we want to create the following website showing the various features of city Delhi,
then we need a homepage (first page that gets loaded) and the additional pages that are linked
to the homepage. The following figure shows the homepage prepared by the basic tags studies
in the syllabus. This homepage is called webpage.html.
C:\Users\HP\Music\Desktop\HTML Project-1\webpage.html

My City Delhi
This is my homepage. This page describes about the Delhi City.
Delhi is the capital of India, the country with many traditions and diversifications in cloth
habits and culture, yet it is united and still rising higher in terms of name and technol

Delhi is the heart of India.

While Connaught place and India Gate are place in center of Delhi,
Lotus Temple, shows the way to Southern part of Delhi also called New Delhi,
The Red Fort shows the way to the Northern part of Delhi. called the Old Delhi.

All the images except the first image (map of Delhi) are hyperlinks. That is, when the user places
the cursor above the image, the image will display its name. On clicking the first image of
Connaught place the file, Connaught.html gets loaded in a different window.Similarly, Lotus.
html gets opened when the user clicks on image of lotus temple, redfort.html is loaded when
the image redfort.jpg is clicked and Indiagate.html gets loaded in a different window when user
clicks of Indiagate.jpg.
In order to prepare individual HTML files, insert the image using IMG tag and then type the text
for each in paragraph tag. The individual HTML files are given below. While Connaught. html is:

88

Information and Computer Technology

C:\Users\HP\Music\Desktop\HTML Project-1\CONNAUGHT.HTML

CONNAUGHT PLACE
Connaught Place, also
called as CP, is located
at the heart of New Delhi.
It was built in the same
year as India gate i.e.
1931. It depicts the style
of British architecture
which was very planned
and well structured.
In the memory of late
Prime Minister, Mr.
Rajiv Gandhi, the Delhi
government renamed it

Rajiv Chowk.
Connaught place happens
to be the commercial hub
of Delhi. People living in
Delhi and outside Delhi
love to come to CP for
shopping and
entertainment. Be it

Redfort.html looks like:


C:\Users\HP\Music\Desktop\HTML Project-1\redfort.html

RED FORT
The Red fort also know as Lal Qila is a 17th century fort constructed by the Mughal
emperor, Shah Jahan city of Delhi, India that served as the residence of the Mughal
emperor, Shah Jahan city of Delhi, India that served as the residence ofthe Mughal
Emperors. The fort was the place for Mughal emperor Shah Jahans new capital,
Shahajahanabad, the seventh city in the Delhi site. He moved his capital here from Agra in
a move designed to bring prestige to his reign.
It served as the capital of the Mughals until 1857, when Mughal emperor Bahadur Shah Zafar was exiled by the British
Indian government.
The Red Fort derives its name from the extensive use of red sandstone on the massive walls that surround the fort.
Every year on 15 August, the Independence day of India from the British Prime Minister hoists the national flag at the Red
Fort, followed by a nationally broadcast speech.
The Red Fort is one of the most popular tourist destinations in Old Delhi, attracting thousands of visitors every year. Today a
sound and light show describing Mughal history is a tourist attraction in the evenings.
It also happens to be the largest monument in Old Delhi.

22:38 1303-2013

The lotus.html is:


C:\Users\HP\Music\Desktop\HTML Project-1\lotus.HTML

LOTUS TEMPLE
Lotus Temple, is located in New Delhi, India. It is a Bahai House of Worship completed in
1986. It is noted for its flowerlike shape.
It is one of the attractions in the city. The Lotus Temple has won numerous architectural awards. Inspired by the lotus
flower, the design for the House of Worship in New Delhi is composed of 27 free-

standing marble clad petals arranged in clusters of three to form nine sides. The nine doors of the
Lotus Temple open onto a cental hall.
It is capable of holding up to 2.500 people.

22:39 1303-2013

HTML II

89

The indiagate.html is:


C:\Users\HP\Music\Desktop\HTML Project-1\indiagate.html

INDIA GATE
The India Gate is the national monument of India. Situated in the heart of New Delhi, it
was designed by Sir Edwin Lutyens.
It was built in 1931. It was originally known as the All India War Memorial, it is a prominent
landmark in Delhi and commemorates of 90.000 soldiers of the Britihs Indian Army who lost
their lives in World War I and the Third Anglo-Afghan War.
It is composed of red and pale sandstone and granite. Today, India Gate is the site of the
Indian Armys Tomb of the Unknown Soldier, known as Amar Jawan Jyoti. the meaning of
Amar Jawan Jyoti is the flame of the immortal soldier
The India Gate is the famous picnic spot for families living in Delhi.
Children enjoy playing and swimming in the Childrens park which is
just a few footsteps from the India Gate. you can see many families
enjoying in the grounds around the India Gate.

This project consists of a homepage and 4 linked pages, for sake of simplicity. The homepage
has most of the images, the hyperlinks and the bulletted list, the use of empty tags like <br>
and <hr>.
The additional pages may not contain the mixture of many tags if the project is small (as in the
present case). For your convenience the the code of individual HTML documents are also
provided:

Connaught.html
<html>
<head>

<title>About

Connaught

Place</title>

</head>
<body Text=darkblue>
<h1
align=center> CONNAUGHT PLACE </h1>
<font face=arial>
<img src=connaughtnight.jpg
align=left>
<p><b>Connaught Place</b>, also called as <b>CP</b>, is located at
heart of New Delhi.
It was built in the same year as India gate i.e. <b>1931</b>.
It depicts the style of British architecture which was very
planned and
well structured.
<p>In the
memory of late Prime
Minister, Mr. Rajiv Gandhi,
the Delhi Government renamed it <b>Rajiv Chowk</b>. </p>
<p>

90

the

Information and Computer Technology

Connaught place happens to be the commercial hub of Delhi. People


living in Delhi and outside Delhi love to come to CP for
<i>shopping</i> and <i>entertainment</i>.
Be it anything from the restaurant, to the road side handicraft shop, to
a national or international bank,
you
would find everything here, right from a grocery store to a car
showroom.
you can also find the offices of tours operators and airlines in
India.
<p>
Markets and shops in Connaught place are structured in the <b>inner</b>
and <b>outer circle</b>.
Connaught place provides the best resource to shop with a number of options
available.
Connaught place is surrounded by Panchkula Marg, Kasturba Gandhi Marg, Baba
Khadak Singh Marg and Barakhamba Marg.
</body>
</html>

Lotus.html
<html>
<head>
<title>Lotus Temple</title>
</head>
<body bgcolor=lightblue>
<h1 align=center> LOTUS TEMPLE </h1>
<font face=arial>
<img src=lotus.jpg align=left>
<p><b>Lotus Temple</b>,
is located in New Delhi, India.
It is a Bahi House of Worship completed in 1986. It is noted for its
flowerlike shape.
<p>It is one of the
attractions in the city.
The Lotus Temple has won numerous architectural awards.
<p>
Inspired by the lotus flower, the design for the House of Worship in New
Delhi is composed of 27 free-standing marble clad petals arranged in
clusters of three to form nine sides.
The nine doors of the
Lotus Temple open onto a central hall.
<img src=ariallotus.jpg align=right alt=Arial view of Lotus Temple>
<p>It is capable of holding up to 2,500 people.
</body>
</html>

HTML II

91

Redfort.html
<html>
<head>
<title>

Red Fort</title>
</head>
<body bgcolor=pink text=Brown>
<img src=redfort.jpg align=left>
<h1 align=center> RED FORT </h1>
<font face=arial size=4>
<p>The Red Fort also known as LalQila is a 17th century
fort constructed by the Mughal emperor, Shah Jahan
city of Delhi, India
that served as the residence of the Mughal Emperors.
The fort was the palace for Mughal Emperor Shah Jahans

new

capital,

Shahjahanabad, the seventh city in the Delhi


site.
He moved his capital here from Agra in a
move designed
to bring
prestige to his reign.
<p>It served as the capital of
the Mughals until
1857,
when Mughal emperor Bahadur Shah Zafar was
exiled
by the British Indian government.
<p> The Red Fort derives its name from
the extensive use of red sandstone
on the massive walls that surround the fort.
<p>Every year on 15 August, the Independence
day of
India from the
British,
Prime Minister hoists the national flag at the Red Fort, followed by a
nationally broadcast speech.
<p>The Red Fort is one of the most popular tourist destinations in Old
Delhi,
attracting thousands of visitors every year. Today, a sound and light show
describing Mughal history is a tourist attraction in the evenings.
<p>
It also happens to be the largest monument in Old Delhi.
</font>
</body>
</html>

92

Information and Computer Technology

Indiagate.html
<html>
<head>
<title>
India Gate
</title>
</head>
<body>
<img src=indiagate.jpg align=right>
<h1 align=center> INDIA GATE</h1>
<font face=Comic Sans MS color=DarkBlue>
<p>The India Gate is the national monument of India.
Situated in the heart of New Delhi,
it was designed by Sir Edwin Lutyens.
<p>It was built in 1931.
It was originally known as the All India War Memorial,
it is a prominent landmark in Delhi and commemorates the 90,000 soldiers
of the British
Indian Army who lost their lives in World War I
and the Third Anglo-Afghan War.
<p>It is composed of red and pale sandstone and granite.
Today, India Gate is the
site of the Indian Armys Tomb
of the Unknown Soldier, known as Amar JawanJyoti.
The meaning of Amar JawanJyoti is the flame of the immortal soldier.
<hr>
<img src=indiagateatnight.jpg width=40%
height=50% align=left>
<p>The India Gate is the famous picnic spot for families living in
Delhi.
Children enjoy playing and swinging in the <a href=chidrenpark.html
target=_blank>Childrens park
</a>which is just a few footsteps from the India Gate.
You can see many families enjoying in the grounds
around the India
Gate.
</body>
</html>

HTML II

93

And the homepage named webpage.html is:


<html>
<head>
<title>Visit
Delhi</title> </head>
<body bgcolor=lightgreen text=darkblue>
<center>
<font face=Bookman Old Style>
<img src=delhimap.jpg align=left>
<h1 align=center> My City Delhi
</h1></font> <font size=4>
<p>This is my homepage.
This page describes about the Delhi City.
<p>Delhi is the capital of
<b><font color=Magenta> India </font></b>,
the country with many traditions
and diverisifications in clothing,
food habits and culture, yet
it is united and still rising higher in
terms of name and technology.</p>
<p>
Delhi is the <font color=red>heart </font> of India.
</p>
<hr>
<p><font color=Black>
While <b>Connaught place </b> and <b> India Gate </b>are place
in <i>center</ i> of Delhi,</p>
<p><b>Lotus Temple</b>, shows the way to Southern part of Delhi also
called <i>New Delhi</i>,
<p><b>The Red Fort</b> shows the way to the Northern part of Delhi,
called the <i>Old Delhi</i>.
</font></p>
</center>

<a href=indiagate.html target=_blank><img


src=indiagate.jpg align=right alt=The Indian Gate></a>
<a href=connaught.html target=_blank><img
src=connaught.jpg align=left alt=CP></a>
<a href=redfort.html target=_blank><img src=redfort3.jpgalign=right
alt=LalQuila></a>
<a href=lotus.html target=_blank><img src=lotust.jpg
align=left alt=Lotus Temple></a>
<br><br><br><br><br><br><br><br><br><br>
<hr>
<b> Monuments in Delhi</b>

94

Information and Computer Technology

<ul>
<li>Akshardham Temple</li>
<li>Lotus Temple</li>
<li>Iskon Temple </li>
<li>Birla Mandir</li>
<li>Rajghat</li>
<li>India Gate</li>
<li>RastrapatiBhawan</li>

</ul><b> Infrastructure in Delhi</b>


<ul>
<li>Delhi Metro Rail</li>
<li>Airport</li>
<li>Hotels</li>
</ul><b>Museums in Delhi</b>
<ul><li> International Dolls Museum</li>
<li>National Museum</li>
<li>National Railway Museum</li>
<li>National Science Center</li>
</ul>
</font>
</body>
</html>

Notice in the homepage, there is use of unordered list. This is to show the various features
of Delhi.
C:\Users\HP\Music\Desktop\HTML Project-1\wepage.html
File Edit View Favorites Tools Help

Monuments in Delhi
Akshardham Temple
Lotus Temple
Iskon Tempe
Birla Mandir
Rajghat
India Gate
Rastrapati Bhawan

Infrastructure in Delhi
Delhi Metro Rail
Airport
Hotels
Museums in Delhi
International Dolls Museum
National Museum
National Railway Museum

The bottom portion of homepage is as under:


You can see that in the above homepage, everything is vertically aligned. This is due to the fact
that important tags like table and frameset has not been used. These will be used in the
syllabus next year. Hence, using the basic tags, a simple project can only be undertaken.
Therefore, prepare the above project and implement your ideas to expand it further.

HTML II

95

Chapter 6

Security Threats and Safety


Measures
Learning Objectives
By the end of this chapter, learner will be able to:
Name the different kinds of software licensing available
Differentiate between freeware and open source software
State how the use of shareware software is different from that of freeware software
Differentiate between copyright and licensing
Define cyberethics, cybersafety and cybersecurity
State the purpose of cookies
Tabulate the different phases of cyber ethics evolution
List precautions that can be taken to ensure cyber safety
Identify the different kinds of threats to cyber security
State ethical behaviour to be followed as a cyber citizen
Identify the different categories of cyber crime

Introduction
With the wide spread use of internet, networks and computers have
become increasingly susceptible to threats. These threats destroy data
as well the programs that computers use. The objective of these threats
is to destroy the data and to steal the vital information stored in
computers. This information is used by the attackers for their benefit.
We occasionally hear about the data theft from credit card

companies or banks, which lead to major financial losses. Also sometimes individual
users are fooled in to giving their personal and sensitive information such as passwords or
bank data leading to financial loss. This chapter shows various threats that computers and
networks face.

1. Viruses
A computer virus is a program usually hidden within another simple program. It produces
copies of itself and inserts them into other programs or files, in turn destroying the data
and performing other malicious actions. Computer viruses are never naturally occurring;
they are always man-made. Once created and released, however, their spread does not
96

Information and Computer Technology

remain directly under our control. While developing the viruses, programmers have
specific target in mind such as data theft or destruction of software, which runs the
computers. The virus can be transferred hidden in files, programs or even in disks. The
viruses can be of different kind but a common virus is macro virus, which is discussed in
detail here.

1.1 Macro Viruses


A simple macro is series of programming steps that are stored in a single location. Macro
allows automation of many actions with only a single keystroke. These can be embedded
in the program files. Many programs, such as Word and excel allow you to record a series
of keystrokes and menu selections and then save them to a file. This helps eliminate
doing the same action several times increasing efficiency. Macro viruses created with the
intention of fooling the user can deceive them in sharing confidential information. This
information can be used by the Macro to damage the computer data or software. The
virus using macro files are most popular as they are:
Easy to write.
Can infect more people faster as they exchange documents and data frequently
Can easily infect any computer capable of running Office and Internet

Macro viruses can corrupt data, create new files, move text, flash colors, insert pictures,
send files across the Internet, and format hard drives. Macro viruses are increasingly used
as transport mechanisms to drop off even nastier bugs. Macro viruses modify registries,
forward copies of it through emails, look for passwords, copy documents, and infect other
programs. Macro viruses can do a lot of different damage in a lot of different ways.
Example of macro Virus is Wazzo, W97M etc.

2. Worms
Worms are very similar to viruses in the manner that they are computer programs that
replicate copies of themselves (usually to other computer systems via network
connections). Viruses often, but not always, contain some functionality that will interfere
with the normal use of a computer or a program. Unlike viruses, however, worms exist as
separate entities; they do not attach themselves to other files or programs. Because of
their similarity to viruses, worms are also often referred to as viruses. Some examples of
the worst Worms that impacted the web are as follows:
1. Jerusalem is one of the earliest worms that spread in 1987. It is also one of the most
commonly known viruses. It used to delete files that were executed on each Friday
the 13th. It was first detected in the city of Jerusalem.
Security Threats and Safety Measures

97

2. In 1991, thousands of machines running MS-DOS were hit by a new worm,


Michelangelo. The virus would overwrite the hard disk or change the master boot
record of infected hosts.
3. In 2007 Storm Worm hit the computers. Once hit, your machine becomes part of a
large botnet which performs automated tasks that range from gathering data on the
host machine, to sending infected emails to others. About 1.2 billion emails were
sent from the infected computers propagating infection.
Since Worms spread mostly through the email attachments, the best ways to avoid them
is using caution in opening emails. If the email is from an unidentified source, it is always
best to delete it. Most of the time worms attach themselves to email. Even the sender of
email does not recognize what they have forwarded, as emails are sent automatically
using all contact information in the users profile.

3. Trojan horses
A Trojan horse is a program that claims to rid your computer of viruses but instead
introduces viruses into the system. Since they look like sincere programs they are referred
as Trojan like the Trojan horse of Greek mythology. The Trojan program does not attach
itself to the files like a virus nor replicate itself like a worm but it does provide
unauthorized access to users computer.
They are mostly spread through internet downloads and online gaming programs. They
mostly affect the targeted computers. The trojan program prompts you to do the normal
functions such as inputting your email address or profile name. You do so, not knowing
that, you have provided access to the malicious software. This software is capable of
taking over the functionality of your computer. An infected computer will begin to
operate slowly and will exhibit pop-ups from time to time. Eventually the computer will
cease to operate, or crash.
The best way to avoid the Trojans is to adopt safe download practices. If you are not sure of
the website safety, then it is probably best not to download any program from that source.

An example of the Trojan horse was I love you which infected several computers in
USA and Asia, completely damaging the data of millions of computers

4. Spyware
A Spyware as the name suggest is a program used to spy on the computer system. This
program will try to get all the confidential and sensitive information such as your bank
98

Information and Computer Technology

account numbers, passwords etc. Then this confidential data is misused to access users
accounts. Spyware can also change the configuration of your computer, generally without
obtaining your consent first.
There are a number of ways Spyware or other unwanted software can get on to computer.
A common trick is to covertly install the software during the installation of other software
that is being downloaded such as music or video or a file-sharing program.
Once installed, the Spyware monitors user activity on the Internet and transmits that
information in the background to someone else. Spyware can also gather information
about e-mail addresses and even passwords and credit card numbers.
SpyWare sends information back to the spy wares home base via the users Internet
connection, thus it eats users internet bandwidth. SpyWare applications running in the
background can lead to system crashes or general system instability as they use memory
and system resources of the users computer.
SpyWare have the ability to monitor keystrokes, scan files on the hard drive, snoop other
applications, such as chat programs or word processors. It also installs other SpyWare
programs, read cookies, change the default home page on the Web browser. While doing
so, it consistently relays this information back to the SpyWare author who will either sell
the information to another party or use it for advertising/marketing purposes.
Some of the common Spywares are CoolWebSearch, Internet optimizer and Zango

5. Malware
Malware is short for malicious software. Malware is any kind of unwanted software
that is installed without your adequate consent. The intent of the malware is to damage
the data or functionality of the computer or network. In fact all the threats mentioned
above such as virus, Trojans etc are examples of Malware.

6. Spams
The term spam refers to unsolicited commercial email (UCE) or unsolicited bulk email
(UBE). It is flooding the Internet with many copies of the same message, in an attempt to
force the message on people who would not otherwise choose to receive it. It is also
referred as junk email. Unsolicited email mostly contains advertisements for services or
products. However most of the spams are from marketers or user who are trying to
deceive the users. The most commonly seen spam includes the following:
Security Threats and Safety Measures

99

Phishing scams, a very popular and dangerous form of email fraud


Foreign bank scams or advance fee fraud schemes
Other Get Rich Quick or Make Money Fast (MMF) schemes
Quack health products and remedies

Spam emails is not only unwanted, it clogs your email accounts and uses unnecessary
server space. This creates burden on servers in the businesses. Since Internet is a public
platform, it is never possible to completely stop the Spam email. However precaution can
be taken while looking at an unknown email addresses. Most of the email hosts can
identify such users and help filter them.
Spam costs the sender very little to send -- most of the costs are paid for by the recipient
or the carriers rather than by the sender. It is because of these additional costs that most
of the hosts are very keen that users use spam filters as well as report spams so they can
be stopped.

7. Hackers and crackers


Hackers and crackers are the software programmers who use dubious
ways to get control over your computer and systems. The intent of both
hackers and crackers is to gain control over your computer so that they
can get the sensitive confidential information. They then use this
information against you by stealing money, personal data, pictures, bank
details and government military information, so on and so forth. This
information can either be sold for money or hackers access account

themselves to rob you directly. Originally hackers were the gifted programmers who gain
access to the systems or network to show case the security loopholes to the
administrators. Later the term cracker was coined for such activist who had intentions of
doing malicious activities. Crackers have an end goal of destroying data and network for
personal monetary gains.

8. Anti Virus Tools


Anti Virus tools are the software programs that help us detect the virus in emails or files
and hence protect our computers. These tools can detect virus, worms, Trojans as well as
spyware and adware. They block us from visiting unsafe websites, and also downloading
unsafe programs from such websites. They protect us from identity thefts and threats
from phishing websites. There are several commercial antivirus softwares available such
as Norton, Mcafee, K7, Quickheal etc.
100

Information and Computer Technology

9. Data Backup and security


As we discussed earlier, there are threats to the computers that are
sometimes hard to avoid. Unknowingly we may open an email that
may have virus attachments and can destroy all the program and
data on our computer. That is why to protect ourselves from such
unknown threat; we need to assure backing up the data. The basic
principal on data back up is very simple, just make another copy of
the data and keep it elsewhere than on the same

computer. This guarantees that once the data on your computer gets corrupted due to a
threat, you can reload the data again on your computer once it has been rectified. These
days you have external hard drives which can back up data. Also most of the smart
devices are also used to back up the data.
Before we discuss in detail how to use the security tools, here are some of the guiding
principles to use the computers securely.
1. Using Security software such as Norton antivirus, Symantec etc.
2. Never share passwords
3. Beware of email attachments form unknown sources
4. Do not randomly download material from websites which has not been checked for
security
5. Never propagate hoax or chain emails
6. Always logout your laptop or computer
7. Restrict remote access
8. Frequently back up important data and files
9. Use encryption or sites that use encrypted data
There are several security tools available which help us protect against all sorts of threats
mentioned above. In brief, the tools are available for antispam, antivirus, firewalls,
encryption tools, password managers and cleanup tools.

First Recorded Computer Crime


In 1820, Joseph-Marie Jacquard, a textile manufacturer in France, produced the loom. This
device allowed the repetition of a series of steps in the weaving of special fabrics. This
resulted in a fear amongst Jacquards employees that their traditional employment and

Security Threats and Safety Measures

101

livelihood were being threatened. They committed acts of sabotage to discourage


Jacquard from further use of the new technology. This is the first recorded cyber crime!
Viruses
Case 1: Brain (in its first incarnation written in January 1986) is considered to be the first
computer virus for the PC. The virus is also known as Lahore, Pakistani, Pakistani Brain, BrainA and UIUC. The virus was written by two brothers, Basit and Amjad Farooq AM, who lived in
Lahore, Pakistan. The brothers told TIME magazine they had written it to protect their
medical software from piracy and was supposed to target copyright infringers only.
The virus came complete with the brothers address and three phone numbers, and a
message that told the user that their machine was infected and for inoculation the user
should call them.
When the brothers began to receive a large number of phone calls from people in USA, Britain,
and elsewhere, demanding them to disinfect their machines, the brothers were stunned and tried
to explain to the outraged callers that their motivation had not been malicious.

They ended up having to get their phone lines cut off and regretted that they had revealed
their contact details in the first place. The brothers are still in business in Pakistan as internet
service providers in their company called Brain Limited.
Introduces or causes to be introduced any viruses or contaminant in that case, suit filed under
Chapter IX of IT Act i.e. Section 43 as a Civil Wrongs under IT Act

Worms
Case 1: The 1988 Internet Worm was the first major worldwide computer security incident
where malware (software that is malicious) propagated throughout the internet. This worm
infected Unix servers, taking advantage of different types of vulnerability in installed code
such as Sendmail and finger. The lessons from that incident are still valid and, surprisingly
perhaps, the vulnerabilities identified that allowed the worm to cause such problems are still
present in some modern software.
The perpetrator of the 1988 Internet worm (Robert Morris, a graduate student at Cornell
University) meant no harm but was experimenting with what was possible. He is now a
respected computer science researcher. Security authorities no longer accept such an excuse
so you should not attempt any such security experiments.
Case 2: Probably the worlds most famous worm was the Internet worm let loose on the
Internet by Robert Morris sometime in 1988. The Internet was, then, still in its developing
years and this worm, which affected thousands of computers, almost brought its
development to a complete halt. It took a team of experts almost three days to get rid of the
worm and in the meantime many of the computers had to be disconnected from the network.

102

Information and Computer Technology

Trojan horses
Case 1: Hacker sentenced to 21 months jail in TKBot Trojan horse case, Sophos reports
An American hacker has been sent to jail after using a Trojan horse to break into innocent
internet users computers.
Raymond Paul Steigerwalt, from Indiana, has been sentenced to 21 months in jail for his
involvement in an international hacking gang which broke into computers around the world,
including PCs at the United States Department of Defense, with a Trojan horse.
Steigerwalt, 21, was a member of the international Thr34t-Krew hacking gang which
launched a Trojan horse designed to break into internet-connected computers.
TheTroj/TKBot-A Trojan horse (also known as the TKWorm) exploited a vulnerability that is
found on some Microsoft IIS web servers.
At least two computers belonging to the Department of Defense were infected and damaged
by the malicious code. Between October 2002 and 7 March 2003, Steigerwalt and other
members of the Thr34t-Krew gang were able to remotely control infected computers without
the knowledge of the computers owners.
Steigerwalt, who pleaded guilty to the charges, has been ordered to pay $12,000 to the
Department of Defense for damage caused by the Trojan horse
Case 2: A young lady reporter was working on an article about online relationships. The article
focused on how people can easily find friendship and even love on the Internet. During the
course of her research she made a lot of online friends. One of these friends managed to
infect her computer with a Trojan.
This young lady stayed in a small one bedroom apartment and her computer was located in
one corner of her bedroom. Unknown to her, the Trojan would activate her web camera and
microphone even when the Internet was switched off. An year later she realized that
hundreds of her pictures were posted on pornographic sites around the world!

Spyware
Loverspy Spyware Creator Now Most Wanted Internet Criminal on FBIs List
Carlos Enrique Perez-Melara, an ex-student of certain San Diego-situated college, was lately listed on Federal
Bureau of Investigations (FBI) list of Internet criminals, who were most wanted, because he had created
Loverspy one notorious spyware also called Email PI, published theverge.com dated November 7, 2013.
Perez-Melara, aged 33, had developed the malware valuing $89 such that it would catch a person who acted
deceitfully while pretending to love. It dispatched one e-greeting card to the suspected deceiver which if viewed
would plant one especially harmful Trojan capable of seizing e-mail ids, keystrokes, IM (instant messages) as well
as movie from the victims web-based camera. Following the Trojans planting, the contaminated PC fully came
under the control of the hacker.

Security Threats and Safety Measures

103

Spams
Sanford Wallace, 43, also known as Spamford Wallace and David Frederix, was arrested in
Las Vegas on Thursday. Wallace is accused of hacking into 500,000 accounts to harvest friend
lists between November 2008 and March 2009. He allegedly used the compromised lists to
make more than 27 million unsolicited postings on Facebook walls that appeared to come
from friends.
If targets clicked on links within the messages, they were presented with a website designed
to fool them into handing over their full name, email address and password, prosecutors said.
Finally they would be redirected to affiliate websites that would allegedly pay Wallace
substantial revenue for traffic.
The scheme relied on vulnerabilities that Wallace discovered in Facebooks spam filters,
according to the indictment.
To accomplish his scheme, Wallace first tested his spamming capabilities between two
Facebook accounts, it said.
*He+ used a fake Facebook account of David Frederix and his legitimate Sanford
Masterwb Wallace account to test variations of spam messages in order to evade Facebooks
filtering mechanisms.
Once Wallace evaded Facebooks spam filters he employed an automatic scripting process to
sign into a compromised Facebook users account, retrieve a list of all the users friends, and
then post a spam message to each of the users friends Facebook walls.
Wallace is now indicted on a total of 11 charges of fraud, intentional damage to a protected
computer, and criminal contempt.
The contempt charges relate to an earlier civil case brought against Wallace by Facebook
itself.
A federal judge awarded the dominant social network $711m in damages in October 2009. The
firm did not expect Wallace to pay, but the judge also ordered him not to log in to Facebook.
According to Thursdays indictment he wilfully and knowingly breached that order.

Wallace, who first gained notoriety as a spammer in the 1990s and also lost a civil case
brought against him by MySpace in 2008, was released on $100,000 bail. He faces up to three
years in jail and a $250,000 fine for each of the six fraud charges and up to 10 years in jail for
each of the three charges of intentional damage to a protected computer.
Facebook welcomed the arrest.
We applaud the efforts of the US Attorneys Office and the FBI to bring spammers to justice,
Two years ago, Facebook sued Wallace and a federal court ordered him to pay a $711 million
judgment for sending unwanted messages and wall posts to people on Facebook. Now
Wallace also faces serious jail time for this illegal conduct.

104

Information and Computer Technology

Hackers and Crackers


An engineering dropout and global hacker, is in the CBI net. He is part of a global network of
hackers and was arrested from Pune following a tip-off from the FBI. He was flown to New
Delhi in the evening.
This is for the first time that a global network of cyber hackers has been traced to India.
Investigating agencies of China, Romania and the United States collaborated with the CBI to
pounce upon the 32-year-old professional hacker who, a source said, had compromised
more than 1,000 internet accounts around the world.
The CBI claims that his hacking syndicate has been active in India since 2011, and that he has
confessed to hacking 950 foreign email accounts besides 171 in India. He was arrested from
his house in Pune and taken to New Delhi on a transit-remand for further questioning.
The CBI tracked him down after the FBI passed on information on the global network of
cyber hackers. Simultaneous raids were conducted in Mumbai and Ghaziabad.
This is not the first time he has been arrested. In 2003, he was arrested by the Mumbai
police for defrauding a Mumbai-based credit card processing company of nearly Rs9 lakh
when he was only 21 and pursuing a degree in engineering in Pune. At that time, he was
operating a website designing services start-up www.mafiaz.com. During investigation,
police found several fictitious names of clients and bank account numbers in his computer.
Though he has claimed to have hacked into the email accounts of over 900 people globally,
the kind of clientele whom he was serving is still to be established. From identify theft to
corporate rivalry, he was serving all types of clients, a CBI officer said. But he hacked only
email accounts and not bank accounts.
CBI claimed that he was operating through two websites www.hirehacker.net and www.
anonymity.com and was charging between $250-500 for his service. He was paid via Western
Union money transfer and Paypal. He used to send the money to his father and girlfriend.

As part of an international law enforcement operation, the CBI has registered two cases
against suspected operators of hacking websites. Similar operations are being conducted in
Romania, China and the US. It is suspected that the number of email accounts hacked may be
much larger once the data is collected and the accused are interrogated, a CBI officer said.
The hackers clientele included jilted lovers and corporate entities. After registering the
cases, the CBI carried out searches in two locations in Mumbai and one each in Pune and
Ghaziabad for violations of various sections of the IT Act and section 379 of the IPC.
Sections applicable in hacking
Hacking is punishable under section 66 read with section 43 of the Information Technology
Act, 2000.
Punishment/Fine
The person can be punished with up to three years imprisonment or fine up to Rs5 lakh or
both.
***Name of hacker Hidden purposefully

Security Threats and Safety Measures

105

Summary of Sections Applicable for Cyber Crimes


Cyber Crime ITAA 2008 Act Sections -IPC Sections
Email spoofing 66D- 416,417,463,465,419
Hacking 66,43-378,379,405,406
Web-jacking 65 -383
Virus attacks 43,66
Logic bombs 43,66
Salami attacks 66
Denial of Service attacks 43
Email bombing 66
Pornography & Child Pornography 67, 67B -292,293,294
Bogus websites, cyber frauds 420
Forgery of electronic records 463, 465, 470, 471
Sending defamatory messages by email 66A- 499, 500
Sending threatening messages by email 66A -503, 506
Financial Crime 415,384,506,511
Cyber Terrorism 66F -153A, UAPA 15-22
Identity Theft 66C-417A, 419A
Website Defacement 65 -463,464,468,469

Summary
A computer virus is a program usually hidden within another simple program.
Macro viruses created with the intention of fooling the user can deceive them in sharing
confidential information.
Worms are very similar to viruses in the manner that they are computer programs that
replicate copies of themselves.
A Trojan horse is a program that claims to rid your computer of viruses but instead
introduces viruses into the system.
A Spyware is a program used to spy on the computer system to get all the confidential and
sensitive information such as your bank account numbers, passwords etc.
Malware is any kind of unwanted software that is installed without your adequate consent.
Spam emails is not only unwanted, it clogs your email accounts and uses unnecessary server
space. It is also referred as junk email.
Hackers were the gifted programmers who gain access to the systems or network to show
case the security loop holes to the administrators.
Cracker was coined for such activist who had intentions of doing malicious activities.
106

Information and Computer Technology

A. Multiple Choice Questions


1. Which of the following is an anti-virus program
(a) Norton
(b) Quick heal
(c) K7
(d) All of these
2. All of the following are examples of real security and privacy threats except:
(a) Hackers
(b) Spam
(c) Virus
(d) Worm
3. Trojan horses are very similar to virus in the matter that they are computer programs
that replicate copies of themselves.
(a) True
(b) False
4. _____________ monitors user activity on internet and transmit that information in the
background to someone else.
(a) Malware
(b) Adware
(c) Spyware
(d) None of these
5. Viruses are __________.
(a) Man made
(c) Machine made

(b) Naturally occur


(d) All of the above

6. Firewall is a type of ____________.


(a) Virus
(c) Security threat

(b) Worm
(d) None of the above

7. Unsolicited commercial email is known as ____________.


(a) Spam
(b) Virus
(c) Malware
(d) Spyware

B. Match the following


(1) Virus
(2) Worm
(3) Trojan Horse
(4) Spyware
(5) Spam

(a) Get Rich Quick Scheme


(b) Cool Web Search
(c) I Love You
(d) Jerusalem
(e) Wazzo

C. Answer the following questions:


Q.1. While working on the computer, you notice that the system is working very slowly, files are
corrupted, default home page on the web browser has changed, lot memory is consumed,
and unnecessary pop-ups are coming. What can be the probable reason?

Security Threats and Safety Measures

107

Q.2. You have very important data on your computer. How will you ensure that this data
remains safe?
Q.3. Differentiate between virus, worms and Trojan horses.
Q.4. How is a hacker different from a cracker?

D. Lab Session
Search the internet for various new viruses and worms that surfaced in last year.
Research various email spams that are sent out these days. How many of these have you
seen which are related to banks? Please visit bank websites and identify if they have
messages about spams.
Make a list of security tools available for your computer by researching on the internet
and t ell what all threats they protect you from.
Make a list of different anti-virus programs available today, along with their pricing and
protection features.
Scan your system to find out different security threats infecting your computer.
Do a survey and find out how many people are comfortable making payments online. If
they are not, find reasons for the same. Also suggest them the ways to make online
payments safe.

108

Information and Computer Technology

Chapter 7

Project
Once you have understood all the tags of HTML and the basics of GIMP, you are ready
to make web applications. The following specifications must be considered while
developing a web site:
1. Identify the problem.
2. Once you have analyzed the problem, you will have a clear idea about the web
pages to be created.
3. When designing your site, pay attention to layout, typography and images.
4. Always use standard Font styles in your web site so that all the browsers should
support them.
5. Site should exhibit strong design, user-friendly navigation, clear and consistent
layout, and professional appearance.
6. Your site should exhibit proper use of background and font colours.
7. Website must include at least one image , it can be a scanned photo, a digital
photograph, or a graphic/artwork created by you.
8. You may use other images, but they must not violate copyright laws.
9. All images must have alt tags, be well placed, and working correctly.
10. Each page must have an appropriate title.
11. Each page must have a consistent navigation menu containing functional links to all
other main pages
12. Visit every page and check to make sure all links work correctly.
13. Test your site behaviour across multiple browsers (e.g. Internet Explorer, Firefox,
Safari, etc.) and different operating systems (e.g. Windows, iOS).
After following all the instruction now you are ready to publish your website on
web server.

Projects

109

Sample Case Studies


1. Develop a website of your favourite cartoon character. The Home page
should consists of the information of the character. It should also offer link to
other web pages and each of these web pages should contain a link to
home page and to the various html pages required in your site. Use Gimp
software to give various effects to the images to be included in the website.

Home | Tom | Jerry | About Us | Video | Contact Us

Introduction
Tom and Jerry is an American series of theatrical animated cartoon films created by William Hanna and Joseph Barbera for
Metro-Goldwyn-Mayer, centering on a never-ending rivalry between a cat (Tom) and a mouse (Jerry) whose chases and
battles often cartoon studio in Hollywood between 1940 and 1957, when the animation unit was closed. the original series is
notable for having won the Academy Award for Animated Short Film seven times, tying it with Walt Disneys silly
Symphonies as the theatrical animated series with the most Oscars. A longtime television staple, Tom and Jerry has a
worldwide audience that consists of children, teenagers and adults, and has also been recognized as one of the most famous
and lingest-lived rivalries in American cinema.

Copyrights@tom & Jerry


All Rights Reserved
Owned By IP WORLD

<html>
<head>
<title>:::Tom $

Jerry:::</title> </head>
<body bgcolor=#7aafef alink=green vlink=white link=red> <center><embed
src=audio.mp3 autostart=true height=1 width=1 ></center></ embed>
font face=trebuchet ms size=8 color=black><i>Tom $ Jerry</i></font> <center><font
face=trebuchet ms size=4 color=white><a href=1.htm >Home</a> | Tom | Jerry |
About Us | <a href=3.htm >Video</a> | <a href=2.htm>Contact Us</
a></font></center>
<font face=tr ebuchet ms size=4 color=black><h2>Introduction</h2>
Tom and Jerry is an American series of theatrical animated cartoon films created by William
Hanna and Joseph Barbera for Metro-Goldwyn-Mayer, entering on a never-ending rivalry
between a cat (Tom) and a mouse (Jerry) whose chases and battles often involved comic
violence. Hanna and Barbera ultimately wrote and directed one hundred and fourteen Tom
and Jerry shorts at the MGM cartoon studio in Hollywood between 1940 and 1957,
110

Information and Computer Technology

when the animation unit was closed. The original series is notable for having won the
Academy Award for Animated Short Film seven times, tying it with Walt Disneys Silly
Symphonies as the theatrical animated series with the most Oscars. A longtime television
staple, Tom and Jerry has a worldwide audience that consists of children, teenagers and
adults, and has also been recognized as one of the most famous and
longest-lived rivalries in American cinema.
<img src=5.jpg height=180>
<img src=1.jpg height=100 width=100>&nbsp;<img src=2.jpg height=100
width=100>&nbsp;<img src=3.jpg height=100 width=100>&nbsp;<img src=4.jpg
height=100 width=100>&nbsp;<img src=5.jpg height=100 width=100>&nbsp;<img
src=1.jpg height=100 width=100>&nbsp;<img src=2.jpg height=100
width=100>&nbsp;<img src=3.jpgheight=100 width=100>&nbsp;<img src=4.jpg
height=100 width=100>&nbsp;<img src=5.jpg height=100 width=100>&nbsp;<img
src=4.jpg height=100 width=100>&nbsp;<img src=5.jpg height=100 width=100> <hr
= 2><center><font face=trebuchet ms size=2 color=black>Copyrights Tom &
Jerry<br>All Rights Reserved<br>Owned By IP
WORLD</center></font> </body>
</html>

Home | Tom | Jerry | About Us | Video | Contact Us

Copyrights@tom & Jerry


All Rights Reserved

<html>
<head>
<title>:::Tom $

Jerry:::</title> </head>
<body alink=white vlink=white link=white bgcolor=#7aafef>

Projects

111

<img src=1.jpg height=200 >


<font face=trebuchet ms size=8 color=black><i>Tom $ Jerry</i></font>
<center><font face=trebuchet ms size=4 color=white><a href=1.htm>Home</a> |
Tom | Jerry | About Us | <a href=3.htm>Video</a> | <a href=2.htm>Contact Us</
a></font></center>
<center><embed src=1.avi height=300 width=300><hr = 2><center><font
face=trebuchet ms size=2 color=black>Copyrights Tom & Jerry<br>All Rights
Reserved </center></
font> </body>
</html>

Home | Tom | Jerry | About Us | Video | Contact Us

Contact US

IPWS Paschim Vihar

Copyrights@Tom & Jerry


All Rights Reserved

<html>
<head>
<title>:::Tom $

Jerry:::</title> </head>
<body alink=white vlink=white link=white bgcolor=#7aafef>
<img src=1.jpg height=200 ></td><td align=right valign=bottom><font
face=trebuchet ms size=8 color=black><i>Tom $ Jerry</i></font>
<center><font face=trebuchet ms size=4 color=white><a href=1.htm>Home</ a> |
Tom | Jerry | About Us | <a href=3.htm>Video</a> | <a href=2.htm>Contact
Us</a></font></center></td></tr></table><center><br><br><br><br><center><font
face=trebuchet ms size=4 color=#000000><b>Contact Us<br><br>IPWS Paschim
Vihar &copy;</b></font><br><br>
<center><hr = 2><font face=trebuchet ms size=2 color=black>Copyrights Tom &
Jerry<br>All Rights Reserved </center></font>
112

Information and Computer Technology

</body>
</html>

2. Develop a website of any personality related to the Bollywood music of your


choice. The Home page should consist of the information of the person. It should
also offer link to the other web pages containing his contribution to the industry and
each of these web pages should contain a link to home page and to the various html
pages required in your site.Use Gimp software to give various effects to the images
to be included in the website.

<html>
<body bgcolor=#800000 link=#800000 alink=#000000
vlink=#800000> <img src=main.jpg height=160 width=250>
<font face=Calligraph421 BT color=000000 size=7><b><i>
<img src=9.jpg height=50 width=80> The Legendary Kishor Kumar&nbsp;
<img src=10.jpg height=50 width=80>
<br><br>
<font face=trebuchet ms size=5
color=#ffffff> <h2>Introduction</h2></font>

Projects

113

<font face=Calligraph421 BT size=4.5 color=#ffffff>Kishore Kumar (4 August 1929 13


October 1987), born Abhas Kumar Ganguly was a popular Indian film playback singer. He is
also known as an actor, lyricist, composer, producer, director, screenwriter and scriptwriter.
Kishore Kumar sang in many Indian languages including Bengali, Hindi, Marathi, Assamese,
Gujarati, Kannada, Bhojpuri, Malayalam and Oriya. He won 8 Filmfare Awards for Best
Male Playback Singer and holds the record for most number of Filmfare Awards won in that
category. He was awarded the Lata Mangeshkar Award by the Madhya Pradesh
government and from that year onwards, the Madhya Pradesh Government initiated a new
award called the Kishore Kumar Award for contributions to Hindi cinema.

</font>
<img src=1.jpg height=250
width=350> <br>
<img src=2.jpg height=200 width=350>
<font face=Calligraph421 BT color=#ffffff size=4.5>
After Ashok Kumar became a big star in Hindi films, the Ganguly family used to visit
Bombay regularly. Kishore Kumars first film as an actor was Shikari (1946), in which
Ashok Kumar played the lead role. Music director Khemchand Prakash gave Kishore
Kumar a chance to sing Marne ki duayen kyon mangu for the film Ziddi (1948). After
this, Kishore Kumar got many other assignments, but he was not very serious about a
film career. In 1949, he decided to settle in Mumbai.Kishore Kumar played hero in the
Bombay Talkies film Andolan (1951), directed by Phani Majumdar. Although Kishore
Kumar got some assignments as an actor with help of his brother, he was more interested
in becoming a singer.
</font>
<br><marquee height=135 width=100% bgcolor=#FCAC28 scrollamount=20><img
src=1.jpg height=130 width=130><img src=7.jpg height=130 width=130><img src=2. jpg
height=130 width=130><img src=3.jpg height=130 width=130><img src=4.jpg height=130
width=130><img src=5.jpg height=130 width=130><img src=6.jpg height=130
width=130></marquee><table bgcolor=#ffcf28 width=100%><tr><td align=center>
<center><font face=calibri size=4 color=#fcac28><a href=1.html >Home</a>|<a href=2.
html >Videos</a>|<a href=3.html >Contact Us</a></center></font></td></tr></table>

</body>
</html>

114

Information and Computer Technology

<html>
<head>
<title>Kishore
Kumar::Videos</title> </head>
<body bgcolor=#800000 link=#fcac28 alink=white vlink=#fcac28>
<img src=main.jpg height=180 width=250 align= right><font face=Calligraph421 BT
color=#ffffff size=7><b><i><img src=9.jpg height=50 width=80> The Legendary Kishor
Kumar<img src=10.jpg height=50 width=80><b><i></font><br><br><br><br><center>
<embed src=Video1.mp4 height=300 width=350></center><center><embed src=Video2.
mp4 height=300 width=350></center>
<br>
<center>
<font face=calibri size=4 color=#800000><a href=1.html >Home</a>|<a href=2.html
>Videos</a>|<a href=3.html >Contact
Us</a></font></center> <br>
<br>
</body>
</html>

Contact Us
Phone No - 2521350, 2341083
Copyright @ All rights reserved
Owned by ABC WORLD, New Delhi
Copyright@Olidk Mayaal Codiek
kd (reserved by ABC World)

Projects

115

<html>
<head>
<title>::KishorKumar::-Contact
Us</title> </head>
<body bgcolor=#800000 link=white alink=white vlink=white>
<center><font face=bahaus 93 size=6 color=white><b>Contact Us</b></font><font
face=bahaus 93 size=5 color=white><br>Phone No = 25261350, 42341083
<br>Copyright &copy; All rights reserved<br>Owned by ABC WORLD, New Delhi</
center><br><hr size=10 width=100% color=#fcac28><center><font face=trebuchet ms
size=2 color=#ff0000><b>Copyright &copy; Old Singers Collection<br>Owned by ABC
WORLD</b></font></center>
</body>
</html>
3. Create a Website for the food point displaying information about nutritious food
items. The Home page should consist of the information of the food items available
in the food point. It should also offer link to the other web pages and each of these
web pages should contain a link to home page and to the various html pages
required in your site. Use Gimp software to give various effects to the images to be
included in the website.

Eating Paradise
Home Videos Contact Us

Introduction
Food is any substance consumed to provide nutritional support for the body. It is usually of plant or animal origin, and cont ains
essential nutrients, such as carbohydrates, fats, proteins, vitamins, or minerals. The substance is ingested by an organism and
assimilated by the organisms cells in an effort to produce energy, maintain life, or stimulate growth. Historically, people secured
food through two methods: hunting and gathering, and agriculture. Today, most of the food energy consumed by the world
population is supplied by the food industry.

The term health food si generally is used to describe foods that are cnsidered to be bene cial to health, beyond a normal healthy
diet required for human nutrition. However, the term is not precisely de ned by national regulatory agencies such as the U.S.
Food and Drug Administration. Health food is sometiems used as an umbrella term encompassing natural foods, organic foods,
whole foods, and sometimes dietary supplements. Such products are sold inhealth food stores or in the health/organic sections
of supermakets

CopyrightSG & EV

116

Information and Computer Technology

<html>
<head>
<title>::Healthy
Food::</title> </head>

<body bgcolor=#abe764 link=white alink=white


vlink=white> <img src=16.jpg height=150 width=400>
<font face=Calligraph421 BT size=12 color=#001e16>Eating
Paradise
</font> <br>
<font face=calibri size=4 color=#ffffff><center>
<a href=1.html>Home</a> | <a href=2.html>Videos</a> | <a href=3.html>Contact Us</
a></center></font><br><br>
<font face=trebuchet ms size=5 color=#002f00><h2>Introduction</h2></font><font
face=Calligraph421 BT size=4.5 color=#001e16>Food is any substance consumed to
provide nutritional support for the body. It is usually of plant or animal origin, and
contains essential nutrients, such as carbohydrates, fats, proteins, vitamins, or minerals.
The substance is ingested by an organism and assimilated by the organisms cells in an
effort to produce energy, maintain life, or stimulate growth. Historically, people secured
food through two methods: hunting and gathering, and agriculture. Today, most of the
food energy consumed by the world population is supplied by the food industry.</font>
<img src=healthy-food-pic.jpg height=190 width=250>
<br>
<img src=vegetables_healthy_food.17114320.jpg height=190 width=250>
<font face=Calligraph421 BT size=4.5 color=#001e16><br><br>The term health food is
generally is used to describe foods that are considered to be beneficial to health, beyond a
normal healthy diet required for human nutrition. However, the term is not precisely defined
by national regulatory agencies such as the U.S. Food and Drug Administration. Health
food is sometimes used as an umbrella term encompassing natural foods, organic foods,
whole foods, and sometimes dietary supplements. Such products are sold inhealth food stores
or in the health/organic sections of supermarkets.</font>
<br><marquee height=135 width=100% onmouseover=this.stop() onmouseout=this.
start() bgcolor=#002f00 scrollamount=20><img src=1.jpg height=130 width=130><img

Projects

117

src=2.jpg height=130 width=130><img src=3.jpg height=130 width=130><img src=4.jpg


height=130
width=130></marquee><br><hr
size=10
width=100%
color=#fcac28><center><font face=trebuchet ms size=2 color=#ff0000><b>Copyright
&copy; &#36;G &amp; &euro;V </b></font></center>
</body>
</html>

Eating Paradise
Home Videos Contact Us

Copyright @ Health Department

<html>

<head>
<title>::Healthy Food::Videos</title> </head>
<body bgcolor=#abe764 link=white alink=white vlink=white>
<table width=100%><tr><td align=left valign=bottom><img src=16.jpg height=150
width=400></td><td align=right valign=bottom><font face=Calligraph421 BT size=12
color=#001e16>Eating Paradise</td></font></tr></table><br><table bgcolor=#001e16
height=80 width=100%><tr><td><font face=calibri size=4 color=#001e16><center><a
href=1.html>Home</a>|<a
href=2.html>Videos</a>|<a
href=3.html>Contact
Us</
a></center></font></td></tr></table><br><br><br><br><table
width=100%><tr
align=center><td align=center valign=middle width=100%><center><embed src=food. mp4
height=300
width=350></center></td></tr></table><br><hr
size=10
width=100%
color=#fcac28><center><font face=trebuchet ms size=2 color=#ff0000><b>Copyright
&copy; Health Department<br></b></font></center>

</body>
</html>
118

Information and Computer Technology

Eating Paradise

Contact Us
Copyright @ All rights reserved
Owned by ABC Food Co.

Copyright@Health Department

<html>
<head>
<title>::Healthy Food::Contact Us</title> </head>
<body bgcolor=#abe764 link=white alink=white vlink=white>
<img src=16.jpg height=150 width=400 align=right ><font face=Calligraph421 BT
size=12 color=#001e16>Eating Paradise</font>
<br>
<font face=calibri size=4 color=#001e16><center><a href=1.html>Home</a>|<a
href=2. html>Videos</a>|<a href=3.html>Contact Us</a></center></font>
<br><br><br><br><center><font face=bahaus 93 size=6 color=#000000><b>Contact
Us</b></font>c <font face=bahaus 93 size=4 color=black><br>Copyright &copy; All
rights reserved<br>Owned by ABC Food Co.</center><br><hr size=10 width=100%
color=#fcac28><center><font face=trebuchet ms size=2 color=#ff0000><b>Copyright
&copy; Health Department </b></font></center>
</body>
</html>
4. Create a website depicting different festivals of India. The Home page should have
links of all festivals of India . It should also offer link to the other web pages and
each of these web pages should contain a link to home page and to the various html
pages required in your site. Use Gimp software to give various effects to the images
to be included in the website.

Projects

119

Festivals Of India
Home | ContactUs | Typesof Festivals | Feedback
Photo Gallery

Some Famous Festivals:


Diwali
Dusshera
Holi

Indian Festivals celebrated by varied cultures and through their special rituals add to
the colours of Indian Heritage. Some festivals welcome the seasons of the year, the
harvest, the rains, or the full moon. Others celebrate religious occasions, the birthdays
of divine beings saints, and gurus (reversed teachers), or the advent of the New year. A
number of these festivals are common to most parts of India, however they are
celebrated differently in different parts of the country....

<html>
<head>
<title></title></head>
<body link = blue vlink = purple alink = blue border=1>
<img src = r.gif height = 50 width = 35% border = 2><font face = trebuchet ms color
= maroon size = 30><p align = right><i><u> Festivals Of India </u></i></font>

<br>
<font face = trebuchet ms color = maroon size = 4><p align = center> Home |
<a href = 2nd page.htm>Contact Us </a>| Types of Festivals | <a href = Feedback.
htm>Feedback</a></font>
<hr>
<font face = trebuchet ms size = 3 color = maroon>Photo Gallery </font>
<marquee scrollamount = 8 behavior = scroll loop =
100> <img src = b.jpg height = 100 width = 100>
<img src = c.jpg height = 100 width = 100>
<img src = e.jpg height = 100 width = 100>
<img src = f.jpg height = 100 width = 100>
<img src = g.png height = 100 width = 100>
120

Information and Computer Technology

<img src = h.jpg height = 100 width = 100>


<img src = i.jpg height = 100 width = 100>
<img src = k.jpg height = 100 width = 100>
<img src = j.jpg height = 100 width = 100>
<img src = l.jpg height = 100 width = 100>
<img src = m.gif height = 100 width = 100>
<img src = n.jpg height = 100 width = 100>
<img src = o.jpg height = 100 width = 100>
<img src = p.jpg height = 100 width = 100>
<img src = q.gif height = 100 width = 100>
<img src = s.jpg height = 100 width = 100>
</marquee></td></tr></table>

<font face = trebuchet ms color = white size = 6 valign = middle ><p


align = center> Live the Moments .....</font>
<font face = trebuchet ms color = maroon size = 5>&nbsp;&nbsp;&nbsp; <u>Some
Famous Festivals</u>:</font>
<ul><font face = trebuchet ms color = white size =
5><i> <li><a href=Diwali.htm> Diwali</a>
<li><a href=Dusshera.htm> Dusshera</a>
<li><a href=Holi.htm> Holi</a>
<li> Eid
<li> Christmas
<li> Pongal
<li> Oman
<li> Raksha Bandhan
<li> Janamashtmi
<li> Navratri
<li> Maha Shivratri
<li> Ram Navami
</i></font></ul>

<br><p align=center><img src = a.jpg height = 250 width = 250 border = 3>

Projects

121

<br>
<br>
<br>
<font face = trebuchet ms color = Blue size = 4><p align = justify><i>Indian
Festivals celebrated by varied cultures and through their special rituals add to the colours
of Indian Heritage. Some festivals welcome the seasons of the year, the harvest, the rains,
or the full moon. Others celebrate religious occasions, the birthdays of divine beings,
saints, and gurus (revered teachers), or the advent of the New Year. A number of these
festivals are common to most parts of India, however they are celebrated differently in
different parts of the country.....</i></font>
<br>
</body>
</html>
2nd page.htm

file///C:Users/Savi/Desktop/Festivals%200%India/2nd%20page.htm

Festivals of India
Home | About Us | Types of Festivals | Feedback
Photo Gallery

Conctact Us at:
ABC Corporations
Connaught Place - 110085
And know the traditions of all Fesitvals and their Festivities

Home | Privacy Policy | Terms of Service | Feedback


2010@festivals of India | All right Reserved

<html><head><title></title></head>
<body link = blue vlink = purple alink = blue>
<img src = u.jpg height = 100 width = 35% border = 2>

<font face = trebuchet ms color = maroon size = 30><p align =


right><i>Festivals Of India</i></font>
<br>
<font face = trebuchet ms color = maroon size = 4><p align = center><a href =
Main Page.htm> Home </a>| About Us | Types of Festivals | <a href=Feedback.
htm>Feedback</a></font></td></tr></table>
122

Information and Computer Technology

<font face = trebuchet ms size = 3 color = maroon>Photo Gallery


</font> <marquee scrollamount = 8 behavior = scroll loop = 100>
<img src = b.jpg height = 100 width = 100>
<img src = c.jpg height = 100 width = 100>
<img src = e.jpg height = 100 width = 100>
<img src = f.jpg height = 100 width = 100>
<img src = g.png height = 100 width = 100>
<img src = h.jpg height = 100 width = 100>
<img src = i.jpg height = 100 width = 100>
<img src = k.jpg height = 100 width = 100>
<img src = j.jpg height = 100 width = 100>
<img src = l.jpg height = 100 width = 100>
<img src = m.gif height = 100 width = 100>
<img src = n.jpg height = 100 width = 100>
<img src = o.jpg height = 100 width = 100>
<img src = p.jpg height = 100 width = 100>
<img src = q.gif height = 100 width = 100>
<img src = s.jpg height = 100 width = 100>

</marquee></td></tr></table>
<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbs

p;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&n
bsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;

<img src = t.jpg height = 200 width = 200 border = 3>


<font face = trebuchet ms color = maroon size = 4><align = right>
Contact Us at : <br>
ABC Corporations <br>
Connaught Place - 110085 <br>
And know the traditions of all Festivals and their
Festivities </font>
<br>

Projects

123

<hr><p align=center><font face = trebuchet ms size = 2 color = black>


Home | Privacy Policy | Terms of Service | Feedback
<br> 2010 &copy Festivals Of India | All Rights
Reserved </font>
</body> </html>
Diwali.htm

file:///C:/Users/savi/Desktop/Festivals%20Of%India/diwali.htm

Diwali - The Holiest Hindu Festival


Home | About Us | Typesof Festivals | Feedback

Enjoy the Moment....

Diwali:

Deepavali or Diwali, popularly known as the festival of lights, is primarily a five day
Hindu festival which startes on Dhanteras, Celebrated on thirteenth lunar day of Krishna
paksha (dark fortninght) of the Hindu calendar month Ashwin and ends on Bhaubeej,
celebreted on second lunar day of Shukla paksha (bright fortnigh) of the Hindu calendar
month Kartik. In the Gregorian calendar, Diwali falls between mid-October and midNovermber. Diwali is an official holiday in India, Nepal, Sri Lanka, Myanmar, Mauritius,
Guyan, Trinidad & Tobago, Suriname, Malaysia, Singapore and Fiji...

13:57
05-03-2013

<html><head><title></title></head>
<body link = blue vlink = purple alink = blue>
<table height = 100 width = 100% bgcolor = Yellow cellpadding = 10><tr><td
width=35% height=100><img src = Diwali 3.jpg height = 100 width = 35% border =
2></td><td width = 90% height = 100 valign = middle><font face = trebuchet ms
color = maroon size = 30><p align = right><i>Diwali - The Holiest Hindu
Festival</i></font></td></ tr></table>
<br>
<table width = 100% height = 35 bgcolor = #F2AC28><tr><td width = 100% height =
35 valign = middle><font face = trebuchet ms color = maroon size = 4><p align
124

Information and Computer Technology

= center><a href = Main Page.htm> Home </a>| About Us | Types of Festivals | <a
href=Feedback.htm>Feedback</a></font></td></tr></table>
<br>
<hr>
<table width = 100% cellpadding = 30><tr><td width = 65% bgcolor = maroon><font
face = trebuchet ms color = white size = 6 valign = middle ><p align = center>
Enjoy The Moments .....</font></td>

<td width = 35% height = 100% bgcolor = Pink rowspan = 2>


<font
face
=
trebuchet
ms
color
=
maroon
size
5>&nbsp;&nbsp;&nbsp;&nbsp;&nb sp;&nbsp;&nbsp; <u>Diwali</u>:</font>

<ul><font face = trebuchet ms color = white size =


4> <li><img src=Diwali 2.jpg height=250 width=300>
<br><br>
<li><img src=Diwali 4.jpg height = 250 width = 300>
</font></ul></td></tr>
<tr><td height=100 valign=top><br><p align=center><img src = Diwali 1.jpg
height = 300 width = 300 border = 3>
<br>
<br>
<font face = trebuchet ms color = Blue size = 4><p align = justify><i>Deepavali or
Diwali, popularly known as the festival of lights, is primarily a five day Hindu festival
which starts on Dhanteras, celebrated on thirteenth lunar day of Krishna paksha (dark
fortnight) of the Hindu calendar month Ashwin and ends on Bhaubeej, celebrated on second
lunar day of Shukla paksha (bright fortnight) of the Hindu calendar month Kartik. In the
Gregorian calendar, Diwali falls between mid-October and mid-November. Diwali is an
official holiday in India, Nepal, Sri Lanka, Myanmar, Mauritius, Guyana, Trinidad &
Tobago, Suriname, Malaysia, Singapore and Fiji..</i></font>

</td></tr>
</table>
<br>
</body>
</html>

Projects

125

<html><head><title></title></head>
<body link = blue vlink = purple alink = blue>
<table height = 100 width = 100% bgcolor = Grey cellpadding = 10><tr><td
width=35% height=100><img src = Dusshera 4.gif height = 100 width = 35% border
= 2></td><td width = 90% height = 100 valign = middle><font face = trebuchet
ms color = maroon size = 30><p align = right><i>Dussehra-Victory Over
Evil!!!</i></font></td></tr></ table>
<br>
<table width = 100% height = 35 bgcolor = #F2AC28><tr><td width = 100% height
= 35 valign = middle><font face = trebuchet ms color = maroon size = 4><p align
= center><a href = Main Page.htm> Home </a>| About Us | Types of Festivals | <a
href=Feedback.htm>Feedback</a></font></td></tr></table>
<br>
126

Information and Computer Technology

<hr>
<table width = 100% cellpadding = 30><tr><td width = 65% bgcolor = Light
Blue><font face = trebuchet ms color = white size = 6 valign = middle ><p
align = center> Enjoy The Moments .....</font></td>
<td width = 35% height = 100% bgcolor = #F2AC28 rowspan = 2>
<font
face
=
trebuchet
ms
color
=
maroon
size
5>&nbsp;&nbsp;&nbsp;&nbsp;&nb sp;&nbsp;&nbsp; <u>Dussehra</u>:</font>

<ul><font face = trebuchet ms color = white size = 4>


<li><img src=Dusshera 2.jpg height=250 width=300>
<br><br>
<li><img src=Dusshera 3.jpg height = 250 width = 300>
</font></ul></td></tr>
<tr><td height=100 valign=top><br><p align=center><img src = Dusshera 1.jpg
height = 300 width = 300 border = 3>
<br>
<br>
<font face = trebuchet ms color = Blue size = 4><p align =
justify><i>Vijayadashami also known as Dashahara, Dussehra, Dashain (in Nepal),
Navratri or Durgotsav is one of the most important Hindu festivals celebrated in various
forms, across India, Nepal and Bangladesh.
The name Dussehra is derived from Sanskrit Dasha-hara literally means removal of ten
referring to Lord Ramas victory over the ten-headed demon king Ravana. The day also
marks the victory of Goddess Durga over the demons Mahishasur. The name
Vijayadashami is also derived from the Sanskrit words Vijaya-dashmi literally
meaning the victory on the dashmi</i></font>
</td></tr>
</table>

</body>
</html>

Projects

127

You might also like