(ITES) NVEQ Level 3

Transcription

(ITES) NVEQ Level 3

Information Technology (IT) /
Information Technology Enabled
Services (ITES)
NVEQ Level 3 – Class XI
Teacher's Handbook
PSS CENTRAL INSITITUTE OF VOCATATIONAL EDUCATIOIN
SHYAMLA HILLS, BHOPAL
A constituent unit of NATIONAL COUNCIL OF EDUCATIONAL RESEARCH & TRAINING
(MINISTRY OF HUMAN RESOURCE & DEVELOPMENT)
Government of India
Draft NVEQF Teacher's Handbook IT/ITES Level 3 under Pilot Testing. Contact the Coordinator on [email protected], 9425018802 for any Query
© PSS Central Institute of Vocational Education, 2013
Copyright protects this publication. Except for purposes permitted by the Copyright Act,
reproduction, adaptation, electronic storage and communication to the public are prohibited
without prior written permission.
Page 2 of 240
Table of Contents
IT/ITES 301 Functional English (Advanced)
Session 1
Dress And Hygiene
Session 2
Preparing A Daily And Weekly Work Plan
Session 3
The Importance of Computers
Session 4
Identifying Different Types of Computers
Session
Review Session 1
Session 5
Computer Brands and Models
Session 6
Features, Advantages and Benefits
Session
Review Session 2
Session 7
Locating Products
Session 8
Complaint HandlingCategorizing Computer Issues
Session 9
User Manual
Session
Review Session 3
Session 10
Cross Selling
Session 11
Merchandizing Via Technology
Session 12
Product Promotion
Session Review Session 4
Session 13
14: Closing a Deal
Session 14
15: Stock Count Session 15
16: Writing a Customer Service report
Session
Review Session 5
Page No.
IT/ITES 302 Digital Literacy (Advanced)
Session 1
Digital literacy
Session 2
Copyright, Trademark & Patent
Session 3
Plagiarism
Session 4
Avoiding violations
Session 5
Cyberlaws
IT/ITES 303 Word Processing (Intermediate) Session 1
Managing Lists – Sort, Renumber, Customize A List
Session 2
Adding A Watermark
Session 3
Table Manipulations
Page 3 of 240
Session 4
Working With Styles
Session 5
Working With Themes
Session 6
Playing With Pictures
Session 7
Insert And Format Screenshots In A Document
Session 8
Create Text Boxes And Pull Quotes
Session 9
Word Art And Other Special Effects
Session 10
Using SmartArt
Session 11
Controlling Text Flow
IT/ITES 304 Spreadsheet (Intermediate)
Session 1
Insert and Modify Pictures and ClipArt
Session 2
Draw and Modify Shapes
Session 3
Illustrate Workflow Using SmartArt Graphics
Session 4
Layer and Group Graphic Objects
Session 5
Goal seek
Session 6
Analyze Data with Logical and Lookup Functions
Session 7
Manage themes
Session 8
Create Modify and Format Charts
Session 9
Create and use templates
Session 10
Update Workbook Properties
Session 11
Creating and Editing Macros
IT/ITES 305 Digital Presentation (Intermediate)
Session 1
Inserting a Movie Clip
Session 2
Inserting an Audio Clip
Session 3
Working With Tables
Session 4
Working With Charts
Session 5
Inserting Transitions
Session 6
Inserting Animations
Session 7
Grouping Objects
Session 8
Inserting Speaker Notes
Session 9
Reviewing Content
Session 10
Preparing to Deliver a Presentation
Session 11
Print a Presentation
Page 4 of 240
IT/ITES 306 Email Messaging (Advanced)
Session 1
Modify message settings
Session 2
Change the message fromat
Session 3
Out of the office notification
Session 4
Create a distribution list or A Contact Group
Session 5
Insert a hyperlink
Session 6
Sort and filter messages using multiple criteria
Session 7
Manage junk email
Session 8
Set workdays and time in a calendar
Session 9
Display an additional time zone
Session 10
Set availability options
Session 11
Create calendar groups
Session 12
Manage automatic meeting responses
Session 13
Manually Modify a journal entry
Session 14
Reply to a task request
IT/ITES 307 Computer Networks Session 1
Introduction to Networking
Session 2
The OSI Model
Session 3
Terminologies and Technologies
Session 4
Network Topologies & Access Methods
Session 5
Network Hardware: Network Interface Card (NIC)
Session 6
Network Hardware: Hub, Switch & Routers
Session 7
Protocols
Session 8
IP Address
Session 9
IP Address Assignment
Session 10
Transport Layer Protocols – TCP & UDP
Session 11
Server Operating Systems
Session 12
Networking Services: Dynamic Host Configuration Protocol
Session 13
Networking Services: Name Resolution
Session 14
Networking Services: NetBIOS, WINS & DSNS
Session 15
Wireless Networking
Page 5 of 240
Session 16
Wireless Security
Session 17
Wide Area Networks Concepts
Session 18
Networking Services: Proxy Servers & Address Translation Session 19
Network Security I
Session 20
Network Security II
Session 21
Troubleshooting Networks
IT/ITES 308 Web Designing Part 1
Session 1
Introduction to Web Design & HTML
Session 2
HTML Elements & Attributes The Basics
Session 3
HTML Elements & Attributes Text Formatting
Session 4
HTML Elements & Attributes – Lists & Links
Session 5
HTML Elements & Attributes – Tables, Images & Multimedia
Session 6
HTML Elements & Attributes – Forms and Frames
Session 7
HTML Elements & Attributes – Metatags, Doctypes & Validation
Session 8
Introduction to CSS Session 9
Overview of XML and XHTML
Session 10
Forms
Session 11
Introduction to CSS Session 12
Web Site Design Scripting Tools
Session 13
Overview of DHTML, AJAX & JQuery
Session 14
Introduction to VB Script
Session 15
Overview of Apache and Web Server Session 16
Overview of ASP
Session 17
Overview of PHP
IT/ITES 308 Web Designing Part 2
Session 1
Introduction
Session 2
Creating websites and webpages
Session 3
Templates & importing webpages
Session 4
Lists, formating text, use spell check and use find&replace
Session 5
Tables and Cells
Page 6 of 240
Session 6
Images
Session 7
Hyperlinks I
Session 8
Hyperlinks II
Session 9
Audio & video
Session 10
Frames, inline framesand layers
Session 11
Hover effect, Meta Elements & Watermark
Session 12
Forms
Session 13
CSS
Session 14
Behaviors
Session 15
Compatibility
Session 16
Code view, addins, snippets and page transitions
Session 17
Dynamic web templates
Session 18
SEO Search Engine Optimization
Session 19
Forms – advanced
Session 20
Publishing webpages or websites I
Session 21
Publishing webpages or websites II
Session 22
Authoring Tools
Session 21
CSS Templates
Page 7 of 240
ACKNOWLEDGEMENTS
The following partners were instrumental in providing the content:
The Sector Coordinator of IT/ ITES “Mr. Deepak D. Shudhalwar” from Engineering and
Technology Department of Pandit Sunderlal Sharma Central Institute of Vocational
Education (PSSCIVE) along with the expert Dr. Prakash Khanale, Head of the
Department of Computer Science, DSM, Parbhani has developed this Teacher's
Handbook. The institute appreciate the work done by the team in a very short period of time.
Accenture India’s Corporate Citizenship Program (Skills 4 Life). Accenture has provided the
content material they have commissioned and developed as well as access to their
implementing partners (Dr. Reddy’s Foundation and QUEST Alliance) for this material. Microsoft Free Digital Literacy Program eLearning package has been used to supplement the
content.
The Wadhwani Foundation team involved in designing and building the content include Ms.
Darshika Sanghani, Ms. Sonia Kakkar, Mr. Karthik Chandru, Ms. Toral Veecumsee, Ms.
Rekha Menon, Mr. Ajay Goel and Mr. Austin Thomas. In addition, various public domain sources have been leveraged to create materials and
illustrations across module. The contributions of all these sources is gratefully acknowledged
and recognized.
Page 8 of 240
Preface
The National Curriculum Framework, 2005, recommends that children’s life at school must be
linked to their life outside the school. This principle makes a departure from the legacy of
bookish learning which continues to shape our system and causes a gap between the school,
home, community and the workplace.
The Teacher's Handbook on NVEQF Level 2 in IT/ ITES sector is the qualification
package developed for the implementation of National Vocational Education Qualification
Framework (NVEQF), an initiative of Ministry of Human Resource Development (MHRD),
Government of India to set common principles and guidelines for a nationally recognized
qualification system covering Schools, Vocational Education and Training Institutions,
Technical Education Institutions, Colleges and Universities. It is envisaged that the NVEQF
will promote transparency of qualifications, crosssectoral learning, studentcentred learning
and facilitate learner’s mobility between different qualifications, thus encouraging lifelong
learning. This Teachers Handbook, which forms a part of vocational qualification package for
teacher’s teaching the NVEQF in IT/ ITES sector in Level 2. The ITITeS Skill Development
Council approved by the National Skill Development Corporation (NSDC) for the IT/ITeS
Industry developed the National Occupation Standards (NOS). The National Occupation
Standards are a set of competency standards and guidelines endorsed by the representatives
of IT Industry for recognizing and assessing skills and knowledge needed to perform
effectively in the workplace. The Pandit Sunderlal Sharma Central Institute of Vocational Education (PSSCIVE), a
constituent of National Council of Educational Research and Training (NCERT) in association
with Wadhwani Foundation has developed modular curricula and learning materials for the
vocational qualification package in IT/ITES sector for NVEQ levels 1 to 4; Level 1 is
equivalent to Class IX. Based on NOS, occupation related core competencies (knowledge,
skills, and abilities) were identified for development of curricula and learning modules.
This Teacher's Handbook attempts to discourage rote learning and to bring about
necessary flexibility in offering of courses, necessary for breaking the sharp boundaries
between different subject areas. The handbook attempts to enhance these endeavours by
giving higher priority and space to opportunities for contemplation and wondering, discussion
in small groups and activities requiring handsonexperience. We hope these measures will
take us significantly further in the direction of a childcentred system of education outlined in
the National Policy of Education (1986). The success of this effort depends on the steps that
school Principals and Teachers will take to encourage children to reflect their own learning
and to pursue imaginative and onthejob activities and questions. Participation of learners in
skill development exercises and inculcation of values and creativity is possible if we involve
children as participants in learning, and not as receiver of information. These aims imply
considerable change in school routines and mode of functioning. Flexibility in the daily
timetable would be a necessity to maintain the rigour in implementing the activities and the
required number of teaching days will have to be increased for teaching and training. Page 9 of 240
About this Handbook This handbook is to assist the teachers to teach the course NVEQF IT/ ITES Level 2. Teacher should work through this hand book in the classroom to guide the students.
This handbook contains sessions which will help you to provide relevant knowledge and skills
(soft and hard) on various aspects of the unit of competency. Each session is small enough to
be easily tackled and digested by you before you move on to the next session. Animated
pictures and photographs have been included to bring about visual appeal and to make the
text lively and interactive for you. You can also try to create your own illustrations using your
imagination or taking the help of your teacher. Let us now see what the sections in the
sessions have for you.
Section1: Introduction
This section introduces you to the topic of the Unit. It also tells you what you will learn
through the various sessions covered in the Unit. Section 2: Relevant Knowledge
This section provides you with the relevant information on the topic (s) covered in the session. The knowledge developed through this section will enable you to perform certain activities. You should read through the information to develop an understanding on the various aspects of the topic before you complete the exercise(s).
Section 3: Session Plan
The session plan which contains the session topic, objectives of the session, materials &
equipment requited and preparation to be done by the teacher for teaching a topic. In
pedagogy part the Teaching and Training methodology is given which explains the process
and how much Theory, Demonstration and Practical sessions need to be taken to achive the
level of competence.
Page 10 of 240
IT/ITES 301: FUNCTIONAL ENGLISH (ADVANCED)
SESSION 1: DRESS AND HYGIENE
RELEVANT KNOWLEDGE
What do you think is Hygiene? As you all
know, it is all about keeping yourself
clean and healthy. Following a good
hygiene may be necessary for many
reasons; personal, social, health reasons,
psychological or simply as a way of life.
Maintaining a good standard of hygiene
helps to prevent the development and
spread of infections, illnesses and bad
odors.
Selfesteem, confidence and motivation
can all be altered by our body image
making it very important to follow good
hygiene practices. The way you present
yourself speaks volumes about you. Many
job interviews are highly dependent on
hygiene, as, often decisions are made by
first impressions formed within the first
few minutes of a meeting. Hence chances
of succeeding either in work or social
settings can be influenced by your
maintenance of hygiene.
What is your idea of a well dressed
person? Jot down your ideas here:
______________________________________
______________________________________
______________________________________
______________________________________
______________________________________
There are some common terms used when
talking about dress and hygiene. Some of them are introduced here. Read aloud the
following terms:
Wellgroomed (A neat and tidy person) –
He is always wellgroomed; I have never seen him looking dirty or shabby.
Polished shoes – I only wear polished
leather shoes to the office.
Clipped nails – It is easier to keep your
nails clean when they are clipped.
Wellcombed hair – Smita likes keeping
her hair clean and wellcombed.
Ironed clothes – It doesn’t matter
whether I wear the white shirt or the blue
one, as long as it is ironed well.
Deodorant – It is advisable to use a
deodorant, especially during summer, to
avoid body odor.
Read aloud the “List of Products” given
below. Your facilitator will conduct an
activity based on this. Listen carefully
and follow the instructions of your
facilitator.
List of Products:
Cherry boot polish
Rexona deodorant
Vaseline lip balm
Colgate toothpaste
Cinthol soap
Sunsilk shampoo
Happy Nails nailcutter
Gillette shaving cream
Brylcreem hairstyling gel
Dettol hand wash
Lexus iron
SESSION 2: PREPARING A DAILY AND WEEKLY WORK PLAN
RELEVANT KNOWLEDGE
What is a work plan? Why do you need
one? Have you ever thought along these
lines?
A work plan is a detailed list of the tasks
and activities that are going to be carried
out to fulfill a scope of work. As a student, it is important for you to set
Page 11 of 240
a target or goal and then plan how to
achieve it. Workplanning is your ability
to list a collection of related subtasks
that need to be done, set specific outcome
goals to measure the success of each
subtask, allocate sufficient time to carry
out each subtask, evaluate actual work
performance, and make necessary
adjustments in future workplanning as
needed. As an example, read the
following:
“School and homework. Activities and
chores. Sleeping and eating. So much to
fit into a single day!
Anisha, 15, said, "I don't have much time
for friends. I wish I could talk to them on
the computer and on the phone more".
Rakesh, 14, feels like he never has
enough time to practice his football and
hang out with friends. Instead, he's
always studying and doing homework.
Karan, 16, wants more time for cricket
and Paramjeet, 13, wishes he had more
time to watch TV. Malika, 17, said, "I
never have time to talk with my friends,
write in my diary, or watch a movie!"
And Arnav, 17, complained that he never
has enough time for himself because he's
packed with homework, tuition, and
preparing for his exams.
Wouldn't it all be easier if time were like
a DVD that you could slowdown,
speedup, fastforward, or rewind? Or
have you wished that time was like a
computer game, and when your time was
up, you could just stop it and return to it
whenever you pleased?
Well, unfortunately, we can't change the
speed of time or get more of it. What we
CAN do, however, is manage it. This means that we should:
Consider everything we HAVE to do and we WANT to do.
Understand how much time each activity in a day will take.
Prepare a plan that helps us get through the day, week, or month without running around in circles.
If you learn to tame the time ‘monster’,
you might be surprised at how much you
can get done. The real reward, however,
is that you will probably feel a lot less
stressed and far more happy!”
Look at the given sample work plan
drawn by Akaash Seth, a call center
agent at “thisisIT.com”, for 5th October,
2012. Time Task
Objective
11:00 Check check for am.
Complaint complaints that Files
have been solved,
check for complaints that are still unsolved
2:30 Meeting with discuss feedback pm.
Team on performance,
Manager, discuss career Richa Gulati
pathway
8:30 Complete number of calls pm.
“Call” Reports received – 29
number of calls dropped 6
9:30 Submit percentage of pm.
reports on successful calls –
day’s call 83%
success rate
percentage of unsuccessful calls – 17%
This plan lists the time, task, and
objective of work that Akaash Seth is
planning to do on the 5th October, 2012.
Simple work plans such as this one can be
easily drawn up for daily or weekly goals,
as required for a situation.
You can keep the points given below in
Page 12 of 240
mind when you plan your daily or weekly
goals to work upon:
•
Describe the key issues: Two questions need to be answered. 1.
What needs to be done? 2.
What needs to be done first? The answers depend on the level of
significance and importance of each task /
goal.
•
Identify key strategies: How will
you put your plan into action? List the
major steps that need to take place.
Identify any difficulties you may come
across and how they will be managed. •
Resources required: What
resources do you require to put your plan
into action.
Do you require support from your
supervisor? Do you require some additional software? Do you require a faster computer? •
Timelines: When do you start?
When do you have to finish? Are your
goals achievable in the given time? Have
you thought about the other tasks that
may need your attention at the same
time? Session 3: The Importance of Computers RELEVANT KNOWLEDGE
In this session, you will understand the importance of computers in today’s world.
Read aloud the points given below. •
The extraordinary growth of
computers in the modern world has been
amazing. Computer is an electronic
device used in almost every field even
where it is most unexpected. That is why
the age of the computer is known as the
“ITage!”
•
In most offices around the world
today, the computer has become an
important and necessary tool that enables
communication and work. •
Governments around the world are
introducing computer classes as one of
the core subjects in the education
curriculum today, because they realize
that a computerskilled enabled
workforce is very important for the
countries’ economy. In addition, by the
use of a few buttons on the keyboard,
computers have simplified many complex
tasks.
•
From schools to workplaces, it has
claimed a central position because of its
many useful functions. •
Computer has become very
important nowadays because it is very
accurate, fast and can accomplish many
tasks easily, as computers can do very big
calculations in just a fraction of a second. •
Computers allow people with
disabilities to do normal activities;
shopping online, playing games with
other people and work from home.
•
Computer knowledge is essential in
our world today, as basic computer skills
have become one of the main conditions
for getting a job. •
The presence of Internet has
revolutionized the way people
communicate and interact. Computers
make lives of people easier and more
comfortable: they give opportunities to
millions of people to keep in touch, while
being in different parts of the world.
•
Business
transactions,
broadcasting of information and
interpersonal (family and friendly)
interactions have all been incorporated in
the computerization process. •
In the days before the computer,
tasks were completed manually and
required much more time than it does
Page 13 of 240
today. •
Computers can store a huge
amount of data, far more than the human
mind.
•
Today people work for employers
from other countries even without seeing
them.
•
Computers today are irreplaceable
for business people and those who need
them for work and for students to study.
•
One of the most positive results
from the usage of computers, is the
impact it has had on deforestation;
cutting down of trees, as the use of paper
in offices around the world has gone down
vastly over the years. •
Computers today are portable and
no longer restrict their user to a desk.
They come in various models and sizes;
from the superthin Laptop to a
pocketsized Tablet PC. This makes it
easier for anyone to communicate and
work from anywhere!
Session 4: Identifying Different Types of Computers RELEVANT KNOWLEDGE
In this session, you will be recall different
types of computers. How many can you
name? List them in your notebooks and
describe each one of them in your own
words in a sentence.
Review Session 1
RELEVANT KNOWLEDGE
The purpose of this session is to evaluate
your knowledge and understanding of
Sessions 1, 2, 3 and 4. Methodology: The review evaluations
will be Question ‘and’ Answer based.
Answers will be assessed on Content,
Context, Grammar, Sentence structure
and Vocabulary based on the sessions
that were imparted. Process: The review evaluations will be
divided into four parts. One for each
session:
•
Hygiene and Dress.
•
Preparing a daily and weekly work plan.
•
Importance of Computers.
•
Identifying different kinds of computers.
Session 5: Computer Brands and Models RELEVANT KNOWLEDGE
In this session, you will talk about your
preference for a particular computer
brand. Name some well known computer
brands popular for the following
categories of computers:
•
Desktops
•
Laptops
•
Tablet PCs
Select a category and prepare to defend a brand of your choice. You can defend the brand from the point of view of:
•
Affordability
•
Efficiency
•
Brand reliability
•
Other attractive features – like the processor speed, storage (memory) space, look, monitor screen resolution, DVD drive, warranty, free software, etc.
Listen carefully to your facilitator as
he/she guides you in forming appropriate
sentences.
Read aloud the following terms related to computer brands and models.
USP (Unique Selling Point) – A feature of
a product shown as the main reason why
people should buy it. For example, the
USP for Sony Vaio is it’s punch line “‘Go
Vivid”, as it explains that Vaio comes in
Page 14 of 240
different colors.
Brand ambassador – A wellknown
person or celebrity who promotes and
advertises a particular brand For
example, Kareena Kapoor is the brand
ambassador for Sony Vaio Laptops Branded products – Popular products
belonging to established brands, such as,
Vaio, iPad, Windows7 and the
microprocessor, belong to, Sony, Apple,
Microsoft and Intel respectively. Models – Most computer brands are
available in various models, with
different features and prices. For
Example, HCL has 22 different models of
Laptops; HCL ME Laptop K4307 priced
at Rs 41, 610, HCL ME Laptop P3897
priced at Rs 29, 250, HCL ME Laptop
G3845 priced at Rs 25,130, etc. Session 6: Features, Advantages and Benefits RELEVANT KNOWLEDGE
Look at the heading of this session. What
do these terms indicate to you? How do
these terms relate to a product? Jot down
your thoughts. The features, advantages
and benefits of a product are referred to
as the FAB of the product. Read aloud the
details below:
Features
•
A feature of a product is something
which is hopefully unique in some way. •
A feature should differentiate one
product from its competition (although
many times features are similar between
competitive products).
•
The important features of a
product are its Unique Selling Points
(USPs) that are not available with the
competitor's product. (For Example: The
“iPhone 4S” from Apple). Therefore, you
need to identify your own product's
unique selling points and make sure your
customer agrees that these are important
to them.
Note: Most people think features are
benefits but they are not. The customer
likes the features because they provide
them with an advantage, and the
advantage then provides them with the
benefits.
Here are some examples of the features of
a product – mobile phone:
•
Some mobile phones have the
ability to surf the web and run
Internetbased applications.
•
Many mobile phones have builtin
digital cameras, and can play music and
videos that are stored on the device in
addition to making phone calls. •
Some of the latest mobile phones
have builtin physical keyboards while
others use touch screen keyboards within
the phone's screen or a traditional
numbered phone keypad. •
Some newer smart phones are also
capable of streaming music and video
from the web.
•
Mobile phones with builtin
Bluetooth can be connected to handsfree
headsets and speakerphones, as well as
share data with your computer and other
devices without having to connect the
phone to them using wires.
•
Some mobile phones offer only
builtin memory, while others give users
the ability to expand the phone's memory
using memory cards.
Advantages
•
The advantage is a result of the
feature and is providing something good
for the customer. •
The advantage is dependent upon
the feature.
•
The advantage is not always
Page 15 of 240
apparent so sometimes it needs to be
explained. •
Always ensure the customer
understands the advantages to the
features the product provides.
Given below are some examples of
advantages of the product mobile phone.
•
Mobile phones today enable many
company executives to work from across
the world due to its computing
applications. •
Mobile phones today perform
various functions, eliminating the need
for carrying different standalone
gadgets.
•
Mobile phones are now a
customers’ music system, digital camera,
gaming device, computer, all rolled into
one!
•
These mobile phones cater to the
need of each and every class of people.
•
The newest mobile phones ensure
that customers get outstanding
multimedia capabilities and hightech
digital cameras that enable customers to
capture a moment and turn it into a
memory.
•
Mobile phones with MP3 player,
allow customers to play their favorite
music tracks with superb sound quality
and share them with their friends via
powerful Bluetooth wireless technology.
•
Mobile phones allow customers to
access the latest technology in the palm of
your hand. Benefits
•
The benefits are the final results
caused by the advantages, which in turn
have been brought about by the features. •
Few people really understand what
benefits are, and can successfully
communicate them to the potential
customer. •
The benefit is the real reason that
a customer will make the decision to
invest money and buy the product.
benefits of the product mobile phone.
•
Stay connected anytime and
anywhere: The most basic benefit of a cell
phone for which most of us use it is that
we can stay connected with our loved
ones in any part of the world and
anytime. Gone are the days when we used
to stand in queues to make an STD or
ISD calls. You can talk to your loved ones
staying even seven seas far with cell
phones.
•
Mini PC: cell phones are nowadays
almost equivalent to mini computers. The
latest ones are equipped with windows
and internet facilities. So you don’t need
to wait for the newspaper! You can simply
access the internet on your cell phone and
get to know about the latest news, your
emails, movie shows and a lot more!
•
Enhance your business: cell phones
are a great help even at your business.
With cell phones, you can constantly stay
in touch with your employees and get to
know about crucial information of your
business.
•
Wholesome entertainment: with a
cell phone in your hand, you don’t need a
TV or PC to get entertained. It is all in
your cell phone. You can play games,
listen to music, and click pictures and
even record videos in your cell phone.
•
Transfer of data: these days cell
phones are equipped with infrared and
bluetooth technologies which allow you to
transfer data like mails, pictures, music
and even videos just in span of seconds.
Knowledge of FAB helps to impart
product information to the potential
customer. Sometimes customers may not
Page 16 of 240
be aware of the advantages and benefits
of the product, so it’s the responsibility of
a salesperson to bring it to their
attention. After all, FAB is the real
reason why customers choose one product
over another. Given this information, you will follow
the instructions of your facilitator and
complete an activity in class.
Review Session 2
RELEVANT KNOWLEDGE
Sessions 5 and 6. Methodology: The review evaluations
will be Question ‘n’ Answer and Role play
based. Answers will be assessed on
Content, Context, Grammar, Sentence
structure and Vocabulary based on the
sessions that were imparted. Process: The review evaluations will be divided into two parts, one for each session:
•
Computer Brands and Models.
•
Features, Advantages and Benefits.
Session 7: Locating Products RELEVANT KNOWLEDGE
The role of a sales representative is very diverse. Some of the activities of a sales representative are:
•
Assisting and encouraging
customers to select and purchase
products. •
Describing the FAB and sometimes
even do a demo of the product.
•
Answer all of the customer’s
queries regarding specifications,
warranty, EMI options, maintenance etc.
•
Address the customers’ needs i.e
advise and help the customer locate
appropriate products.
•
Receive payments, orders and
makes invoices.
•
Arrange display of goods in retail
stores.
•
Coordinate stock inventory and
order new stock
Listen carefully to the instructions and
directions of the facilitator as he/she
guides you through a role play of a
computer sales representative.
Session 8: Complaint Handling RELEVANT KNOWLEDGE
We all have complained about something
or the other in our daily lives. Now, it is
important for you to understand:
•
The nature of a complaint.
•
The importance of keeping a customer happy.
•
The reasons why customers complain.
•
The result a complaint has on business.
•
The different ways of handling a complaint.
How do you define a complaint? “An expression of dissatisfaction by a
customer whether justified or not”
How does a happy customer affect
business? A happy customer will…
•
Returns the next time
•
Use the other services that the business (restaurant / hotel / shop / organization, etc.) is promoting or selling
•
Appreciate the staff and respects them
•
Recommend the place to his family Page 17 of 240
and friends
•
Thus, increase the profits of the place
Note: A study says that 95% of customers
stop going to a hotel, restaurant or store
because somebody from the staff was rude
to them.
______________________________________
______________________________
______________________________________
______________________________
______________________________________
______________________________
______________________________________
______________________________
What do you think would happen if your favorite store/restaurant lost 95% of its customers? Why do think customers complain? Can you list a few reasons?
Some of the main reasons why customers complain are…
•
Bad service; very unacceptable and
disappointing.
•
Unsatisfactory service; average and ordinary •
Delayed response in service; taking
too much time, sometimes days.
•
Issues not being handled seriously; not given due importance.
•
Not getting the promises promised;
insincere assurance.
•
Rude and disinterested staff.
•
How do you think complaints affect
businesses? ______________________________________
______________________________________
______________________________________
______________________________________
A study says that One unhappy customer
not using the service of a business equals
to thirtyfive people (including friends,
family and social contacts) not using its
service. Do you think it is a good idea for a
business to actively seek (try to find out)
customers’ complaints? Support your
answer with reasons.
______________________________________
______________________________________
______________________________________
______________________________________
One of the most effective ways of
handling a complaint is to:
Kill the reason for the complaint. Don’t let the complaint arise in the first place.
Read aloud the eight steps to solve a complaint:
1.
Provide customers your full and undivided attention.
2.
Listen completely.
3.
Ask the key question “what else?”
4.
Agree that an issue exists; never disagree or argue.
5.
Apologize; for any problem caused
6.
Assure that the complaint will be looked into at once. 7.
Reassure that the issue will be solved at the earliest (Ask again “what else?”).
8.
Thank the customer for bringing the complaint to your attention.
Go through the text given below
“Complaint Handling; Keeping
Customers Happy”. •
Akhil is upset about the service at
the store. He tells the store manager he’s
never coming back.
•
Nilofer apologizes to the customer,
for the faulty laptop he bought, and
assures him that she will make sure the
laptop is replaced and the whole issue
solved within 72 hours.
•
Ranvir takes down a complaint
from Mr. Shorey, who is very
disappointed about the below average
service he’d received the last time he’d
Page 18 of 240
called.
•
Manisha is upset! She has been put
on hold, for more than 30mins, by the call
center agent she was speaking to. She is
definitely going to raise a complaint about
this to the agent’s superior.
•
Customers at the restaurant are
always complaining to Tanya about
Mahesh’s poor service. If this keeps
happening, Tanya fears the restaurant
may face a big loss!
Listen carefully to the instructions of
your facilitator and fill in the details
below:
“Ways of Handling Complaints”. A: Does your place of work have a complaint department?
B: No, it doesn’t.
A: Then who handles all of the customers’
complaints?
B: We do! A: What do you mean you do? Don’t you
think it’s wise to have a separate
department for that? Did you know that
for every complaint registered, there are…
B: ____ unregistered complaints. I know
and I do agree that it is important to keep
our customers ______; however, we don’t
have the budget that allows such a
department. So, even with the few of us,
we manage to ______ our customers with
our ___ and undivided ________!
A: I understand. So, what are the
different ways you handle complaints?
B: First, like I said, we show all our
customers that we care by giving each of
them individual attention, ________ to
everything they have to say, asking
them whatever the issue is. A: Sounds good, but what if the customer
insists that there was a problem with the
service, even if you know there wasn’t.
What would you do then?
B: Simple. Never ________ or _____, as
“the customer is always right”! So, we
_____ that an issue exists, and __________
for any problem caused to them and then
assure them that their complaint will be
looked into at once. A: Does that make the customers happy?
B: Yes, it does. Especially when we
_________ them that their issue will be
solved at the earliest, and ______ them for
bringing the complaint to our attention.
A: Wow! This has really taught me a lot
about how to handle customer
complaints. Thanks!
B: You’re welcome!
Session 9: Categorizing Computer Issues RELEVANT KNOWLEDGE
What is categorization? It implies that
objects or ideas are placed in categories or
groups, for a specific purpose. Generally,
a there is a relationship between items in
a category. Categorization is fundamental
in language, decision making, and in all
kinds of environmental interaction. In
this session, you will be able to categorize
products and understand instructions
related to it.
Study the following table and try to
match the two columns – issues with the
relevant category.
Computer Issue
Category
Can’t Connect to the Operating Email
System
All the files are Hardware
opening very slowly
AntiVirus Screen Freeze
Software
DVD doesn’t work
Internet
All the files are Memory / Disk corrupted
Space
Page 19 of 240
Now imagine that you are guiding your
younger sibling to match the two
columns. How would you instruct her to
create the categories match?
Write down the sentences that you form.
Note the set of instructions that you have
created and underline the words that
help make an ordinary statement into an
instruction.
Now, read aloud the following list “Words
for Categorizing Issues”. You have also
been given sample sentences using the
words. 1.
Troubleshoot: Mend, Repair
2.
You have to troubleshoot the issue with the hard disk
3.
The agent who troubleshot the
problem with the DVD drive was very
helpful
4.
Solve: Explain
5.
Solve these issues as soon as possible
6.
Customers are pleased when their computer issues are solved
7.
Classify: Organize, sort
8.
Classify the issues into various categories
9.
It is important to classify all computer related issues into categories and solve them on time
Label: Mark, tag
1.
All hardware products have been labeled under various categories 2.
Label each computer with the customers’ names on it
Divide: Separate
1.
Divide the issues amongst them 2.
Computer related issues” has been
divided into two subcategories –
Hardware and Software
Connect: Link, join
1.
The customer was not able to
connect to the internet 2.
He did not face any issues while he
was connected to the internet
Make your own sentences with the words
for categorizing issues.
Now, read aloud the “List of Computer
Issues and Categories” given below. Computer Issues
Loss of memory
No sound speaker
The keyboard is not working
Screen freeze
Computer crashed
Unable to open programs
Can’t turn on the computer or nothing happens
Computer is running slow
CPU is not switching on
Too many Popups are making the screen hang
System shuts down whenever games are played
System takes a long time to startup
Categories
Software: System, Programming and Application
Hardware: Keyboard, Monitor, Printer,
Optical disc drive (CD / DVD), Floppy
disk, Memory card, USB flash drive, CPU
(Central Processing Unit)
Hard disk: Motherboard Network, Power
supply, Randomaccess memory (RAM),
Sound card, Video card
Internet: Broadband; Dialup and
Wireless, Modem Listen carefully to the instructions given
by your facilitator and complete an
activity in class.
Session 10: User Manual Page 20 of 240
RELEVANT KNOWLEDGE When you purchase a product, you
generally find a small booklet along with
it, guiding you how to effectively and
optimally use the product. What is this
booklet? Yes, it’s a user manual or a user
guide.
What is the purpose of this manual?
Would it make a difference if it was not
there? What kinds of products have user
manuals? Is it very complicated and
difficult to follow?
Think about the answers to these
questions and participate in your class
room discussion.
The basic outline of a good user manual is
as follows:
•
User manuals or product manuals
are either big or small books with a set of
instructions that are user/customer
friendly.
•
The main purpose of a user manual
is to make the product and procedures
easier for the users/customers to
understand.
•
Before making a user manual,
companies do a lot of research to define
who the user/customer is, how they will
use the user manual and how much
experience they have with the product.
•
Most user manuals have a
reference page with a stepbystep
description of how to fix, repair and
setup a product. •
User manuals usually also have a
wordlist with their meanings. (For
example: a user manual about computers
may have the term CPU mentioned in a
number of places. All that the user has to
do is turn to the wordlist and the
meaning of the term can be found there.
CPU = Central Processing Unit.)
•
Some user manuals may be very
lengthy and of many pages, while others
may only be a couple of pages long.
•
Most user manuals have images /
pictures of the products and instructions
to be followed. Pictures are better than
text, especially in complex procedures
where users / customers need to have
visual confirmation that they're
performing the steps correctly.
•
The user manuals for heavyduty
machines come with a page consisting of
safety measures that the users/customers
should follow while using the product. Review Session 3 RELEVANT KNOWLEDGE The purpose of this session is to evaluate
Sessions 7, 8, 9 and 10. Methodology: The review evaluations
sessions that were imparted. Process: There will be one review evaluation for each session: •
Locating Products
•
Complaint Handling
•
Categorizing Computer Issues
•
A User Manual.
Session 11: Cross Selling RELEVANT KNOWLEDGE Cross selling is selling additional
products to an existing customer. For
example, a customer is going to buy a
computer from your company. You can
cross sell a DVD player or some
educational or game CDs along with it.
Page 21 of 240
Some common terms and phrases which
can be used while cross selling a product
such as a computer or a mobile phone are:
•
“Would you also like to try
out/buy…”
•
“We have a special offer for you…”
•
“Limited offer…”
•
“This ________ will look good/work
well with the_____________.”
•
“This _________ complements the
______ very well.”
Read the following examples:
•
‘Would you also like to try out this
Compaq wireless mouse? It will work well
with the laptop.”
•
“We have a special offer for you.
Since you are buying the Compaq laptop,
you can also buy this Compaq wireless
mouse at half the cost price.”
•
“This HP printer can be bought at
half the cost price with the laptop. It’s a
limited offer so you should avail it soon.”
Session 12: Merchandizing Via Technology RELEVANT KNOWLEDGE What do you think is “Online and
Telemerchandising”. Read aloud the
following points out loud. Definition: Online
and
Telemerchandising is how a company
markets its products/services via the
telephone, or displays its products/
services on its’ website. •
Internet and the telephone is the
fastest growing business phenomenon on
Earth. That is why companies are
spending a fortune on calling software,
customer service/sales representatives,
website designing, categorizing product
software, advertisements, etc.
•
These days, going to the store to
shop for an electronic item is considered
too tiresome for some. •
The new internet age, has
revolutionized the way human beings
interact with each other. Today, people
want the company selling the product to
reach them via the internet or via a call. •
Customers want the whole
“customer sales / service experience” to
reach them in their living rooms, without
as much as moving an inch! •
Customer sales representatives
need to encourage all clarification queries
the customers may have, while the
customer sales representatives explain
the products’ features, advantages and
benefits.
•
should read up in depth about the
product they’re marketing, and must be
confident enough to answer all the
questions about the product. •
The purpose of merchandizing
products via such technology is that it
shall meet the customer’s needs and
wants, thus making the customers happy.
•
also know that marketing is all about
creating good relationships with the
customers so that they can buy their
company’s products. •
When merchandizing over the
telephone customer sales representatives
need to remember to be tactful and
assure the customer that they can trust
the product is worth investing in. •
need to also be efficient, listen carefully,
sound energetic, and be prompt in
responding, polite in speech, patient with
elderly customers and pleasant in mood. •
who are helpful and have an organized
Page 22 of 240
way of communicating, plus sounds
natural (not scripted) and is eager to
serve will mostly find their
merchandizing calls ending very, very
satisfactorily!
So, when merchandizing over the phone with customers, all the customer sales representatives need to do is, remember the “Telephone”.
T Tactful, Trustworthy
E – Efficient
L Listen carefully
E – Energetic
P – Prompt, Polite, Patient, Pleasant
H – Helpful
O – Organized in thought
N – Natural sounding
E Eager to serve.
In conclusion, whether serving or selling
customers,
customer
sales
representatives always need to remember
to smile a lot and have some fun; good
marketing becomes “best” only when
customer sales representatives are able to
make customers feel that the whole
interaction was pleasurable and fun. Only
then will the results be great and
amazing!
Session 13: Product Promotion RELEVANT KNOWLEDGE In this session, you will discuss the topic of promotion of items.
Read aloud the following questions and
the points listed below each question.
What do you mean when you say you are promoting a product?
•
To encourage the sales of products
through advertisement, adding bonus
features and or other publicity.
•
How products are usually
promoted?
•
Advertisement
•
Adding bonus features like gift
items, two for the price of one, etc. For
e.g., “Buy a Desktop Computer and get a
pair of speakers for free”, “Buy a
‘Resilience’ Data Card, and get a 25%
discount on the first year’s bill”,
“Fourpack Game Cds, 50 Rupees off”, etc.
•
Brand ambassadors. E.g., Kareena
Kapoor for Sony Vaio, Abhishek
Bachchan for Idea Cellular, etc.
Review Session 4
Sessions 11, 12 and 13. Methodology: The review evaluations
sessions that were imparted. Process: There will be one review
evaluation for each session: •
CrossSelling. •
Merchandising via Technology •
Product Promotion.
Session 14: Closing a Deal RELEVANT KNOWLEDGE One of the roles a customer sales/service
representative plays is to answer the
customer’s queries in order to close a
deal. A customer sales/service
representative must try his/her best to
get the customer to buy an item. In order
to close the deal, he/she needs to explain
the features and offer benefits which
make the deal very attractive.
Some of the questions a customer might ask are:
1.
Will you deliver it to my place?
Page 23 of 240
2.
Is an upgrade available?
3.
Can I take this car out for a test drive?
4.
Does this item have a warranty on it?
5.
Can I get a discount on the price?
How would you answer the above
questions in the positive? Jot down your
answers here:
Session 15: Stock Count RELEVANT KNOWLEDGE
As you know, not only selling items and closing deals but also counting inventory may be a part of a sales representative's daily job routine.
A stock count as the name suggests is the
counting of inhand inventory. This is
very important from the business point of
view. Losing track of inventory is a sure
recipe for disaster in a business.
Moreover, you can lose a customer if
often, he/she searches for an item at your
store and does not get it due to
unavailability. The customer will
definitely switch loyalty to a better
stocked store! Hence, you need to know
which products are moving, which are not
and also how much of each item is left in
hand. What tasks do you think are involved in a
stock count? Daily stock count involves the following tasks:
1.
Identifying location (The best place
to showcase the product)
2.
Arranging products (So that the
products look attractive and the
customers can easily identify and choose
the product they want)
3.
Counting products (So they know
how many were originally on sale, how
many sold, and how many are unsold)
4.
Updating stock count format (Improving on the way/plan of stock taking)
All computer manufacturing companies
need to take a count of their stocks on a
daily basis. Why? Think and jot down
your answer.
Session 16: Writing a Customer Service report RELEVANT KNOWLEDGE What is a customer service report? A Customer Service report is a very
important aspect of running of successful
business. Customer sales/service
representatives use customer service
reports or call reports to record details of
all the customers they receive, from
potential to existing customers.
Call reports typically include what was
discussed with the customer, the outcome
of the conversation, and any other
relevant information. These reports are
then submitted to supervisors and are
used to keep a record of contacts with
customers. They can also give supervisors
valuable feedback about an employee's
job performance.
Look at the following chart (Customer
Service Report Chart):
Page 24 of 240
The Customer Service report has been
prepared showing the number of
customers, their addresses and contact
numbers. The report also shows the
reason why the customers contacted the
company, their date of contact, the
discussion details, products sold, services
requested, customers who need to be
called back, customers who need service
provided, and any followup calls or
service that needs to be made or
delivered.
With this information in hand, now listen
carefully to you facilitator and complete
the exercises in the session.
Review Session 5
The review evaluations will be Question
and Answer and RolePlay based.
Answers will be assessed on content,
context, grammar, sentence structure and
vocabulary based on the sessions 14, 15
and 16. The review evaluation is divided
into three parts. One for each session: •
Closing a Deal. •
Stock Count.
•
Writing a “Customer Service Report”.
Page 25 of 240
IT/ITES 302: DIGITAL LITERACY
SESSION1: Digital literacy
next few sessions. RELEVANT KNOWLEDGE
SESSION 2: Copyright, Trademark &
Patent
Intellectual Property
Intellectual property (IP) is a legal concept
that refers to intangible property rights.
Intangible property, describes something
which a person or corporation can have
ownership of and can transfer ownership to
another person or corporation, but has no
physical substance. For example if you create an illustration for
use in ebooks (digital form of textbook
viewed on computing devices), it becomes an
intellectual property. You can transfer the
ownership of this illustration to a publisher
either for a fixed fee, through a royalty
scheme or at no cost. Generally ownership lies with the owner,
protected through legal rights. By protecting
the efforts, owners can have a safe social
environment where their work is protected
and hard work is rewarded. Intellectual property is a legal concept
referring to creations of the mind for which
exclusive rights are recognized. Under
intellectual property law, owners are granted
certain exclusive rights to a variety of
intangible assets, such as:
•
Musical, literary, and artistic works.
•
Discoveries and inventions. •
Words, phrases, symbols, and designs.
Intellectual property rights also allow
protecting intellectual activity in industrial,
scientific, literary & artistic fields. Different
types of intellectual property rights that can
increase protection include copyright,
trademarks, patents, industrial design rights
and in some jurisdictions, trade secrets.
Note: You will learn about the different types
of intellectual property rights in detail in the
RELEVANT KNOWLEDGE
Copyright
Copyright is a legal concept, enacted by most
governments, granting the creator of an
original work, exclusive rights to it, usually
for a limited time period. Copyright
protection is available to both published and
unpublished work. Copyright was initially conceived as a way for
governments to restrict printing. But
nowadays, this concept helps promotes
creation of new works by protecting authors,
giving them control of content and the right
to make profits from it. Works such as
paintings, sculptures, books, photographs,
software, audio & visual works, architectural
designs, etc. are protected by Copyright.
Copyright can be made by either individuals
or companies. Companies usually have a
legal department with experts to deal with
Intellectual property such as the Copyright. Exclusive rights
Exclusive rights mean that only the copyright
holder is entitled to exercise the rights (listed
below) and others are prohibited from using
the work without permission. Following are
some of the rights typically attached to the
holder of the copyright:
a) To produce copies or reproductions of
the work and to sell those copies
(including, typically, electronic copies).
b) To import or export the work.
c) To create derivative works (works that
adapt the original work).
d) To perform or display the work
publicly.
Page 26 of 240
e) To sell or assign these rights to others.
Copyright jurisdictions
Copyrights are said to be territorial, which
means that they do not extend beyond the
territory of a specific state unless that state is
a party to an international agreement. For
example rights for a content that is
copyrighted in one country may or may not be
applicable in another country. Today,
however, this is less relevant since most
countries are parties to at least one such
agreement. Copyright validity
Generally validity of a copyright is whole life
of the creator plus fifty to a hundred years
from the creator's death, or a finite period for
anonymous or corporate creations. Things that cannot be copyrighted
Several categories cannot be copyrighted such
as:
•
Slogans, short phrases, familiar
symbols or logos, lettering, coloring.
•
Ideas, procedures, methods, systems,
processes, concepts, principles,
discoveries, or devices, as
distinguished from a description,
explanation, or illustration.
•
Works consisting entirely of
information that is common property
and contain no original authorship (for
example: standard calendars, height
and weight charts, tape measures and
rulers, and lists or tables taken from
public documents or other common
sources)
Copyright symbol
Content or information that is copyrighted
usually identified through the symbol ©;
information related to copyright or legal
terms is usually made available in product
manuals, warranty cards, websites, etc. Use of copyright symbol © doesn’t necessarily
mean it’s copyrighted. For example, you might notice lots of
websites that have © symbol indicating that
the content, website hosted are copyrighted.
It reminds the visitors of the website to
respect copyright.
Obtaining copyright
Copyright registration is a legal formality
intended to make a public record indicating
the ownership and the rights of the owner.
This can help owners file a case against
infringements of their content. Copyright
involves procedures as required by the law;
refer to copyright bodies or seek help from
copyright experts for proper procedure. Using copyrighted content
You can use copyrighted materials if you
obtain permission from the owner; in most
cases, you may have to get a written
confirmation from the owner to avoid any
legal issues.
Note: If a copyright notice is not available, it
is recommended to contact the webmaster or
owner to check if you require any special
permission to use the material. Also it is the
right of the owner to grant or deny
permission, to part or complete material. If
the permission is granted, then the owner
may charge a fee or provide the material free
of cost; however, the decision is left with the
owner. In rare cases, if the copyright of the
material is expired and confirmed, then the
material maybe used without permission. Copyright infringement
Copyright infringement is the unauthorized
use of works under copyright, infringing the
copyright holder's "exclusive rights", such as
the right to reproduce, distribute, display or
perform the copyrighted work, spread the
information contained within copyrighted
works, or to make derivative works. It often refers to copying "intellectual
property" without written permission from
the copyright holder, which is typically a
Page 27 of 240
publisher or other business representing or
assigned by the work's creator. Copyright
infringement is often associated with the
terms piracy and theft. Examples of copyright infringement includes
(not limited to):
•
Downloading and using software
without paying for it (if it is paid
software), purchasing software and
redistributing it for free, etc.
resulting in software piracy.
or brand services)
3. ® (the letter "R" surrounded by a
circle, for a registered trademark)
Trademark can be registered if it is able to
distinguish the goods or services of a party,
will not confuse consumers about the
relationship between one party and another,
and will not otherwise deceive consumers
with respect to the qualities.
Like Copyright, Trademarks can be located
on a package, a label, a voucher or on the
product itself. A trademark is typically a
name, word, phrase, logo, symbol, design,
image, or a combination of these
elements.Example of a trademark includes
the logo for Wikipedia website (figure below):
•
Paying for single copy and using it on
multiple computers (referred to as
Software Piracy).
•
Downloading paid MP3 (music or
audio) or video from websites without
paying any money.
•
Downloading and/or distributing
movies from the Internet through
direct downloads or torrents.
•
Using copyrighted logos without
permission.
Wikipedia Logo
•
Downloading licensed software
without paying for it.
•
Downloading and/or distributing
movies without permission
A patent is a form of intellectual property. It
consists of a set of exclusive rights granted by
a sovereign state to an inventor or their
assignee for a limited period of time, in
exchange for the public disclosure of the
invention.
Trademark
A trademark is a recognizable sign, design or
expression which identifies products or
services of a particular source from those of
others. The trademark owner can be an
individual, business organization, or any
legal entity. A trademark may be designated by the
following symbols:
1. ™ (the "trademark symbol", which is
the letters "TM", for an unregistered
trademark, a mark used to promote or
brand goods)
2. ℠ (which is the letters "SM" in
superscript, for an unregistered
service mark, a mark used to promote
Patent
The procedure for granting patents,
requirements placed on the patentee, and the
extent of the exclusive rights vary widely
across countries based on their national laws
and international agreements. Typically,
however, a patent application must include
one or more claims that define the invention.
These claims must meet relevant
patentability requirements, such as novelty
and nonobviousness. The exclusive right
granted to a patentee in most countries is the
right to prevent others from making, using,
selling, or distributing the patented invention
without permission.
Patent is done through Patent Offices that
Page 28 of 240
are governmental or intergovernmental
organizations which controls the issue of
patents.
SESSION 3: Plagiarism
RELEVANT KNOWLEDGE
copied and reproduced without owner’s
consent, it is referred to as content scraping. Internet plagiarism is widely practiced in
academia and journalism. For example:
•
Students, professors or researchers
may copy content from the Internet
that is considered academic
dishonesty and may be punished
through suspension or termination.
•
Reporters may copy recent news from
other website for local paper or other
publications and authors using
content in text books without
providing citation that is considered
unethical. Authors and reports may
lose credibility with the organization
and may be terminated as a result.
Plagiarism
Copying, reproducing or distributing
information without the owner’s consent is
referred to as plagiarism. Getting involved in
such practices is considered unethical. Copyright infringement refers to violations
leading to legal consequences whereas
plagiarism refers to activity such as
reproducing another’s work as if it is one’s
own original work. Plagiarism is considered
an ethical offense and not as a crime.
Understand ethics in the following context:
You write an article for a competition and
someone else copies your original work and
claims that she has created the work.
plagiarism:
1. Downloading and using images or
content from websites or other sources
and claiming it to be your original
work. If you want to use the information available
on the Internet on your personal use or for
public distribution, you need to ensure that
you are authorized to copy or distribute the
information. In general, it is necessary to
obtain permission from the author or the
publisher before copying or distributing the
information.
Following is a general guideline to avoid
plagiarism:
•
Use quotations when placing text in
documents to indicate that this is
copy; use different fonts or colors for
quotations. •
Include the source as a footnote either
below the quotation or at least at the
end of the document.
•
Paraphrase the entire text using your
own words; check with the original
paraphrase for technical accuracy.
•
Indicate if it’s an improvement of
accuracy and quote the original text.
2. Modifying existing company logos on
brochures, flyers, business cards, blogs
or other distribution materials.
3. Copying fulltext or image from
websites and placing it in documents
without citations or quotations.
Internet Plagiarism
Internet is a major resource for searching,
researching, collecting and using information.
This information available could be owned by
an author who may have published the
information for free or for a fee through a
publisher. When information such as text, tutorials,
source code to applications, news, etc is
Detecting Plagiarism
Plagiarism is common due to widespread use
of computers today. It can be detected
manually or automated through
Page 29 of 240
computerassisted methodologies. your blog or printed material (Sample below).
Though detecting plagiarism can be difficult,
some websites offer textbased plagiarism
detection services to detect online presence of
copied content. Some of the online plagiarism
detection services include (not limited to):
“This document is compiled from content
available in www.wikipedia.org.”
1. Chimpsky (chimpsky.uwaterloo.ca)
2. Copyscape (www. Copyscape.com)
3. Plagium (www.plagium.com)
4. PlagTracker (www. PlagTracker.com)
SESSION 4: Avoiding violations
RELEVANT KNOWLEDGE
When you create content and/or publish, it
becomes your intellectual property. As owner
of the content, you have all rights to control
how the information can be copied,
distributed or reproduced and also, who can
use the information. Similarly to use
intellectual property owned by others, you
need proper permissions from the rightful
owner. However in some cases, the owners
might provide guidelines for using the
content without prior permissions enforced
through certain licensing terms.
Certain authors, publishers or owners allow
copying, reproducing or distributing content
through certain legal conditions without the
need for obtaining written permission. For
example, you may be permitted to use the
content under certain methods & licensing
types such as Citation, Fair Use, Public
Domain, Creative Commons, etc. Citation
Citation is a reference to a published or
unpublished source. Citation is used for
acknowledging or attributing the original
work in order to avoid plagiarism. For
example, if you would like to quote few
sentences from a newspaper or book, you can
indicate the source of the content used in
“Compiled
from
http://en.wikipedia.org/wiki/Plagiarism”
Citation is usually available at the end of a
document or material referred to as a
“footnote”; however, citations need to be
provided based on the terms and conditions
as set by the owner. For example, you might have noticed the
following citation in this text book (end of
first session):
“Note: This document is compiled from a
variety of sources including Wikipedia, U.S.
Copyright website, Copyright handbook from
Copyright office – Government of India
(http://copyright.gov.in/Documents/handbook.
html). “
This is an example to indicate where the key
points and content are sourced from to: one,
encourage readers to visit respective websites
for any clarification and two, to comply with
legal requirements. Fair Use
Fair use is a limitation and exception to the
exclusive right granted by copyright law to
the author of a creative work. Fair Use refers
to using copyrighted materials to a limited
extent without obtaining permission.
Examples of fair use include news, reporting,
teaching, researching, library archiving, etc. For example, you can include screenshots of a
software product in a training document or a
blog. However, it is recommended to check
with the product vendor (in this scenario) or
the website for legal requirements. To know
more about Fair Use, visit
http://en.wikipedia.org/wiki/Fair_Use.
Public Domain
Works in the public domain are those whose
intellectual property rights have expired,
been forfeited, or are inapplicable. Basically,
Page 30 of 240
the public domain consists of works that are
publicly available. For example: a public
domain that provides free images is
www.openclipart.org. Creative Commons
Creative Commons (CC) is a nonprofit
organization headquartered in Mountain
View, California, United States devoted to
expanding the range of creative works
available for others to build upon legally and
to share. The organization has released
several copyrightlicenses known as Creative
Commons licenses free of charge to the
public. These licenses allow creators to
communicate which rights they reserve, and
which rights they waive for the benefit of
recipients or other creators.
A Creative Commons license is one of several
public copyright licenses that allow the
distribution of copyrighted works. A Creative
Commons license is used when an author
wants to give people the right to share, use,
and even build upon a work that they have
created. Creative Common licensing provides
an author flexibility (for example, they might
choose to allow only noncommercial uses of
their own work) and protects the people who
use or redistribute an author's work, so they
don’t have to worry about copyright
infringement, as long as they abide by the
conditions the author has specified.
There are several types of Creative Common
licenses. The licenses differ by several
combinations that condition the terms of
distribution.
Creative Commons licenses consist of four
major condition modules: •
Attribution (BY), requiring attribution
to the original author. •
Share Alike (SA), allowing derivative
works under the same or a similar
license (later or jurisdiction version). •
NonCommercial (NC), requiring the
work is not used for commercial
purposes.
•
No Derivative Works (ND), allowing
only the original work, without
derivatives.
These modules are combined to currently
form six major licenses of the Creative
Commons:
•
Attribution (CC BY)
•
Attribution Share Alike (CC BYSA)
•
Attribution No Derivatives (CC
BYND)
•
Attribution NonCommercial (CC
BYNC)
•
Attribution NonCommercial Share
Alike (CC BYNCSA)
•
Attribution NonCommercial No
Derivatives (CC BYNCND)
For example, Wikipedia uses Creative
Commons AttributionShare Alike 3.0 license.
You can learn more about Creative Commons
at www.creativecommons.org.
Best practices to avoid copyright violations
Following are some of the guidelines to avoid
copyright violation:
1. Always check the source for legal
requirements; usually guidelines are found
in terms and conditions, terms of use, legal
use, fair use, about us, press images, etc.
sections of the website. If any of the pages
or instructions are not available, mail the
author (or webmaster) to confirm if you
can use the content in your website or
material.
2. Never download or use illegitimate
(pirated) software; if possible try to
research and use open source software as
an alternate instead.
3. Never share product keys or serial keys;
never install paid software (for self or
others) unless you are sure of the
transaction (receipt). Page 31 of 240
4. Never attempt to browse websites that are
restricted by the government.
5. If content is copied or reproduced under
Fair Use Policy, provide citation or credits
to the author, source or publisher.
6. When providing content or software, it is
essential to provide copyright information.
For example, you may include details such
as whether the enduser can reproduce /
distribute / download the content/ software
you have created / developed without your
permission, or, if they need to get in touch
with you for acquiring permissions for a
fee, etc. 7. If you are not clear about the licensing
terms and conditions, get help from a
licensing expert or contact the owner.
SESSION 5: Cyberlaws
RELEVANT KNOWLEDGE
Cyber laws are legal regulations to control
cyber crimes. Millions of users are dependent
on the Internet all over the world and crimes
are possible in the cyber space. Cyber Crime
Cyber Crime or computer crime refers to any
crime that involves a computer and a
network. Cybercrimes are defined as:
"Offences that are committed against
individuals or groups of individuals with a
criminal motive to intentionally harm the
reputation of the victim or cause physical or
mental harm to the victim directly or
indirectly, using modern telecommunication
networks such as Internet (Chat rooms,
emails, notice boards and groups) and mobile
phones (SMS/MMS)". Cybercrimes can also refer to unauthorized
access or modification to computer materials.
Activities such as spam, fraud (mail, chat,
etc.), threats, harassment, etc. are some of
the cybercrimes popular today. When
communicating through Chat, Mail or
forums, extra care must be taken to avoid
falling into traps. Never respond to chat, mail
or electronic messages that are suspicious or
fraudulent in nature; for example, you may
receive a mail that could promise financial
benefits without any efforts which in turn
might be a scam. Several unethical & illegal things happen on
the Internet. Activities such as cheating,
fraud, misappropriation, piracy, defamation,
pornography, hacking, planting viruses, IPR
thefts, copyright violations, threats, etc. are
committed through the Internet today. These
activities are treated as cyber crimes and
involving in such activities could lead to
severe punishments. Defamation
In layman’s language, defamation means
making false statement(s) about someone or
something which results in spoiling the
reputation of the individual, business,
product, group, etc. Defamation can be either, slander (verbal) or
libel (written). Both slander and libel ways of
defamation are considered to be punishable
offences; depending on the severity, the
punishment could be severe. In short, it is
illegal and unethical to practice defamation
and never should be encouraged. Cyber Laws
To maintain the Internet as a safe place for
all, laws and regulations are required. Laws
& regulations that cover the Internet & the
World Wide Web are referred to as Cyber
laws.
Cyber law or Internet law is a term that
summarizes the legal issues related to use of
the Internet. It is less a distinct field of law
than intellectual property or contract law, as
it is a domain covering many areas of law and
regulation. It includes internet access and
usage, privacy, freedom of expression, and
jurisdiction etc. To know about Cyber laws in
India, Visit http://deity.gov.in/. Page 32 of 240
Page 33 of 240
IT/ITES 302: WORD PROCESSING (ADVANCED)
Session 1: Managing Lists – Sort, Renumber, Customize A List
RELEVANT KNOWLEDGE
Introduction and Recap
While working with word processors
earlier, you created bulleted and
numbered lists. As you may recall, you
use numbered lists when you are working
with instructions to be done in a sequence
i.e. steps to be followed, and the numbers
suggest an order. The same applies when
you refer to specific items by number. If
ordering using numbers are not
necessary, you can use bullets.
Lists help to organize the contents of a
document and summarize key points that
are easier to read and remember. For
example, if you would like to summarize
several paragraphs, you can summarize
as points and display a list that is easier
to understand. In some cases, you may
need sublists under existing lists. For
example, a planets list can have a sublist
of moons. Creating multiple level lists
help you to organize the contents of your
document effectively.
You have already created single level
bulleted and numbered lists and are
aware that they can be created by
clicking on the Bullets/Numbering icon in
the Paragraph group under the Home
tab. These lists are by default,
automatically indented from the page
margin. To stop creating the list, click the
highlighted Bullets/Numbering icon again
to turn it off or press Enter twice. To use
a different bullet type (e.g. arrow instead
of a dot) or a different numbering (a,b,c…
instead of 1,2,3…), click on the
highlighted bullet or number button on
the menu and select a different style. If
you want to use a bullet design other
than the ones provided by default, you
can click on Define New Bullet… or
Define New Number Format… and create
a design of your choice.
Sorting a list
If you want to arrange an existing list in
a particular order (alphabetic or value,
ascending or descending), you can do it
using the sort function. To practice
sorting a list, do the following:
•
Open a new word processing
document.
•
Select the Numbering icon in the
Paragraph group under the Home tab.
•
Enter the names of you classmates on
a separate line. (Make sure to press
Enter after every name).
•
When you have finished, select the
entire list and click on the Sort button
in the Paragraph group. The Sort
Text dialog box appears.
Page 34 of 240
beginning of each list, do the following:
•
Place the cursor on the item where
you want to restart the numbering,
and rightclick.
•
Select Restart Numbering. This
automatically resets it as another list
instead of continuing from the
previous list (Figure 1 right).
•
Alternatively, you can also make a list
to continue from a previous list by
selecting the option Continue
Numbering. Select sort by Paragraph since the
words are separated by the Enter key,
like paragraphs. You can also specify
whether the items are text or date or
numbers and if it should be sorted in
ascending or descending manner.
•
If you want to start the numbering
from a specific number, place the
cursor next to the number. Click the
Click OK. Notice the result! Your list
of classmates is now displayed in
alphabetic order of their names.
Type the new value (starting number) in
the Set Value To: and Click OK. Observe
the change in the list.
Sorting Text based on conditions
•
•
Renumbering a list
Number dropdown menu select Set Numbering Value. and
Setting Value
Switching between bullets and
numbers
Occasionally, you may realize you do need
to use numbers instead of bullets or vice
versa. You can also change the numbers
to bullets in a list.
Switching between a bullet list to a
Number list
When you create lists, the numbering
may continue throughout the document.
Sometimes when you want to create a
new list (figure above left) or when you
want to continue an old list from before
(which has been reset to 1) renumbering
is useful. To restart the numbering at the
Bullet is a symbol used for representing
items in a list. Bullet symbols can have a
variety of shapes, such as circular,
square, diamond, arrow, etc. Bullets can
also include pictures. To use bullets for
an existing numbered list do the
following:
•
Reselect the list of classmates you
had sorted.
Page 35 of 240
Click on the bullets icon on the
toolbar and select desired bullet
from the Bullets list by clicking on
it. Notice the change as the
numbers change into bullets.
Multilevel Lists
the next level. Each new list within a list
creates a new list level. Now, do the
following:
Having worked with single level lists,
now you will learn about the powerful
feature of multilevel lists. A multilevel
list has list within lists. The added
advantage is that you can mix numbers,
letters and bullets in such a list. Look at
the list below. 2. Click the (Multilevel list) icon
available under Paragraph group in
the Home Tab. The following
dropdown appears:
•
1. Open a new document in word
processor.
System Software
Operating System
DOS
Windows XP
Windows Vista
Compiler
Assembler
Interpreter
3. Select the appropriate list style from
the default List Library.
Package
Once you select a list style, the starting
number or bullet format is inserted in the
document.
DBMS
•
To create the sublevel list, press
Enter and then the Tab key (or click
the Indent button on the toolbar
under Paragraph group). On doing so,
the next level is displayed.
•
To return to the previous level in the
list press Shift+Tab key (or click the
Decrease Indent button on the toolbar
under Paragraph group).
Application Software
Word Processors
Spreadsheets
Utility
Antivirus
Backup Software
Disk Defragmenter
How do you create such a multilevel list?
To create such a list, you need to first
understand the concept of list levels. A
single level list has all details at one
level. When you add another list under
one item, you are creating a new list at
4) To practice, create the sample on
System and Application software list
given above.
Creating your own list style
•
You can also design your own list style
at each level independently. To design
Page 36 of 240
a list style, do the following:
•
Click the Multilevel List button to see
the list library. •
Click Define New Multilevel List…
option. A dialog box for customizing
the list appears. You can define the
number/ bullet format for every level
available in the list. After selecting
the format and alignment, click OK to
apply the changes to the document.
Customizing Level Styles
.
New Multilevel List
If you create a list style, use it in many
places in the document and may decide to
change the design later, it is advisable to
create your own list style. Then when you
modify this list style, it is automatically
updated all over the document. You can
create your own list styles by doing the
following:
Select the Define New List Style… option
available in the dropdown list. A dialog
box for customizing the list style appears.
You can customize the style by selecting
fonts, size, images, etc.
•
To convert this style into a template
available in other documents, select
the radio button New documents
based on this template.
•
Click OK.
Session 2: Adding A Watermark
RELEVANT KNOWLEDGE
A watermark is text or an image
embedded as a background of a
document. Watermark is typically used
for indicating readers the ownership such
as copyright information, status of a
document such as its confidentiality, etc.
Watermark can be text or image such as
company name, department, logo,
document status such as draft or
confidential, etc. Create a watermark
To create a watermark, do the following:
1. Open a document in Word Processor.
2. Click on the Watermark option
available in Page Background group
under the Page Layout tab (shown
below). A dropdown list of default
watermarks available within the word
processing software appears. Page 37 of 240
Watermark library by clicking on it.
Notice the DO NOT COPY watermark
is applied to the document across all
pages!
Default Watermarks
3) Select DO NOT COPY 1 from the
Watermark applied in a document
3) Click OK. Create a customized watermark
You can customize the watermark by
specifying the font, size and color or use a
picture for watermark in the Printed
Watermark dialog box. To create a customized watermark, do the
following:
1) Select Custom Watermark… option
available in the dropdown list. A Printed
Watermark dialog box appears. You can
customize the watermark here by
selecting either a picture or some text.
Custom watermark applied in a
document.
Notice the custom watermark is now
applied to the document. Session 3: Table Manipulations
RELEVANT KNOWLEDGE
Custom Watermark dialog box
2) Select Text Watermark and type
Watermark Demo under Text option.
You are familiar with using spreadsheet
software for sorting and computing
numeric values. You can also perform
similar operations in using word
processing software. You have already
learnt how to create a table for tabular
representation of data using spreadsheet
Page 38 of 240
software. • Open a new document in the word
processing software. •
Create a table in the new document
with the following data:
Name
Sub1 Sub2 Sub3 Tot
Radha
78
89
86
Anita
87
91
88
Kashish
75
79
82
Ambikagiri 85
76
77
Lakshmi
75
88
90
Aniruddha
95
78
65
Vidya
82
87
76
Geeta
90
89
87
Sort data in a table
You can sort data available in a table
when you want to visualize data in a
particular sequence. You can sort up to
three levels in a table on individual
columns (not rows). To sort the table data
in the Name column by alphabetical
order, do the following:
1. Select the Sort option available under
Data group in the Layout tab. A dialog
box appears (shown below).
3. Select Name under Sort by drop down
list.
4. select Ascending to specify the sort
order. 5. Click OK.
Notice the data in Name column is sorted
alphabetically. Similarly, if you would like to sort the
table based on highest score in subject 1,
do the following:
•
Select the Sort option available under
Data group in the Layout tab. •
Select Subject 1 under Sort by drop
down list.
•
Select Descending to specify the sort
order.
•
Click OK
Notice the list is sorted by top to bottom
score in Subject 1 Column.
Now sort by Subject 2 and Subject 3
columns using the procedure mentioned
above.
Perform calculations in a table
If you are using numbers in a table such
as financial data or score, you can apply
formulas for computations. This is similar
to the calculations performed in a
spreadsheet. For example, to find the
total score for the first student in the
table, do the following:
1) Place the cursor in the last cell of the
row and select the Formula option
available under Data group in the Layout
tab as shown below:
A Formula dialog box appears (figure
below)
2. Sort by condition dialog box
Page 39 of 240
spans at least two pages to complete this
exercise.
a) Place the cursor on the row that has
headers (first row)
Formula dialog box
Note: Before you enter the formulae, you
need to understand the row and column
numbering system in a table. Columns
represent letters and Rows represent
numbers (similar to that of a
spreadsheet). Calculations are performed
based on cell references. First cell in the
table is A1 and the cell to the right is B1.
The cell below A1 is A2.
b) Select Layout Tab, Select Repeat
Header Rows under Data group.
Notice the header text is available on
subsequent pages.
Working with cell layout
If you want to modify an existing cell
layout, you can use the Rows & Columns
group in the Layout tab in the word
processing software. For example, if you
want to:
•
Add a row above, select Insert Above
option.
•
Add a row below, select Insert Below
option.
•
2) Enter the formula =SUM(LEFT). This
will calculate the total of all the values
present in the left side of the cells.
Add a column to the left, select Insert
Left option.
•
Add a column to the right, select
Insert Right option.
Note the value in Total column. •
To remove a cell, table, row or
column, select appropriate option
under Delete dropdown menu.
Since this is very similar to spreadsheets,
you can apply the formulas learnt during
spreadsheet sessions. You need to enter
the formula in a particular cell, similar to
a spreadsheet, in order to calculate. Note: Calculations done using a word
processor is suitable for simple
calculations. For complex operations such
as data filtering, validation, etc, it is
advisable to use spreadsheet software.
Repeat table headers across multiple
pages
If you have a lengthy table that spans
across multiple pages, it will be easier to
refer if the headers are repeated on each
page. Table headers are available only on
the first row of a table by default. To
include header on each page, do the
following: Rows & Columns group
•
Sometimes, a header or a detail may
span several columns or rows. To
combine two or more cells in the same
row or column, into a single cell, select
the cells that you would like to merge.
Select Merge Cells option under Merge
group in Layout tab. Note: You need to have a table that
Page 40 of 240
Cell Size group
To change the orientation of the text in
the cell, select Layout tab and specify the
Alignment type under Alignment group.
Merge group
•
Similarly, to divide a cell, do the
following:
•
Place the cursor in the cell that you
would like to split. •
Select Split Cells option under Merge
group in Layout tab. •
•
Enter the value in Number of columns
and/or Number of rows text box in
Split Cells dialog box.
Click OK. Alignment group
Apply designs to table You can apply designs to a table to make
it look attractive. To apply design, do the
following: Click on the table. The Design tab is now available. Select it.
Select a design available from Table
Styles group. For example, click on Light
shading – Accent 1 from the list. Notice
the style Light shading – Accent 1 is
applied to the table.
Split Cell dialog box
To adjust the size of a cell, select Layout
tab and specify the size under Cell Size
group.
Table design applied to a table
•
To apply a different design, select
other styles from the Table Styles
group. Customize a table design
You can also customize the style or create
your table design. To do so, do the
following:
•
Click on the More icon in Table Styles
group in Design Tab. •
Select New Table Style…. A Create
New Style From Formatting dialog
box appears.
Page 41 of 240
Now create your table styles by choosing
font, size, theme colors and borders; apply
the custom design to the table created
earlier. Session 4: Working With Styles
RELEVANT KNOWLEDGE
Create New Style From Formatting
dialog box.
•
In Create New Style From Formatting
dialog box, do the following:
•
Type a new in Name: text box, for
example, MyTableStyle1.
•
Select Table Grid from the dropdown
list under Style based on:.
•
Select Odd Banded Rows from Apply
formatting to: dropdown menu
•
Select a fill color, for example Dark
Blue, Text 2, Lighter 80% from Theme
Color dropdown menu.
•
Select Even Banded Rows from Apply
formatting to: dropdown menu.
•
Select a fill color, for example Olive
green, Accent 3, Lighter 80% from
Theme Color dropdown menu.
•
Select Header Row from Apply
formatting to: dropdown.
•
Select a fill color, for example White,
Background 1, Darker 5% from Theme
Color dropdown.
•
Click OK.
•
To apply this custom design, select the
more icon in Table Styles group. The
new style will be available under the
Custom section of the Table Styles list.
•
To apply, click MyTableStyle1. Styles give your document a professional
look and saves time. You have observed a
default style in your documents created
using a word processor:
1. Headings are in a font that
contrasts with the text body.
2. Paragraphs are separated by white
space.
3. Elements such as lists are
indented.
4. Emphasized text is usually in a
contrasting color.
You have also learnt to apply different
formats using font size, style, bold, italics
etc. As you know, this method of direct
formatting can be very tedious when
updating a huge document. If you want to
change the look of the document, you
must select each element separately and
apply the new formatting choices.
On the other hand, by using styles to
format your document, you can quickly
and easily apply a set of formatting
choices consistently throughout your
document.
A style is a set of formatting
characteristics, such as font name, size,
color, paragraph alignment and spacing.
Some styles even include borders and
shading.
For example, instead of taking three
separate steps to format your heading as
Page 42 of 240
Cambria, 14 point, bold, you can get the
same result in a single step by applying
the builtin Heading 1 style (Styles group
under Home tab). For each heading just
click on Heading 1 and the job is done!
formatting needs to be consistent. For
example, if one word in your paragraph is
bold, every word in your new style will be
made bold.
•
Place the mouse pointer within the
new paragraph.
•
In the Styles group, click the More
Accessing the Style task pane
The Styles task pane is used extensively
when working with styles. Styles can be
quickly set, applied, and modified by
using the task pane. To access the style
task pane, Styles dialog box launcher
icon. The Styles task pane appears. The
keyboard shortcut for the same is
Alt+Ctrl+Shift+S.
Note: Change of style is either a change
of character style (the font, font size, color
etc.) or a change of paragraph style
(alignment, spacing, paragraphing, and
indentation). Creating your own style
You can create your own styles in two
ways: From existing text
•
Using the Styles task pane.
•
To create a style from existing text,
do the following:
•
Format a paragraph the way you
want your style to be applied.
Input the desired character or
paragraph formatting, typeface,
borders, shading, spacing, and
alignment.
Note: Paragraph styles include character
formatting. Whatever formatting choices
your sample paragraph has (for example
left and right indents or a border), it will
be part of your new style. Consider all of
these components when creating your
own style. Moreover, your character
button
.
•
Select Save Selection as a New
Quick Style....The Create New
Style from Formatting dialog box
appears.
•
Enter the name for your style in
the Name text box (Note: names
are case sensitive).
•
Click OK. This style will be
accessible from the Styles group.
Alternatively, using the Styles task pane,
you can create styles before you use them.
You can also import and export styles to
and from other documents and templates.
To create a style using the Styles task
pane, do the following:
Select the Styles task pane and click the
New Style icon
. The Create New Style
from Formatting dialog box appears.
Create New Style From Formatting
dialog box
Page 43 of 240
1. Type a name for the new style in the
Name text box. (Note: names are case
sensitive)
2. Select the Style type as Paragraph or
Character to create a paragraph style
or character style respectively.
2. Move your mouse pointer over the
style you want to change, a drop down
arrow is visible. Click on the down
arrow and select the option Modify….
The Modify Style dialog box appears.
3. From the Style based on dropdown
list, either select an existing style (to
base the new style on) or select (no
style) to create a completely new style.
4. In the Formatting section, make the
adjustments as per your desired style.
5. Complete all details and click OK.
Applying and modifying a style
Now that you have created styles, to
apply the same, do the following:
Selecting the text you want to format.
1. Select the required style from the
Styles group. Note that as your cursor
moves over each style, a preview of
the style appears on the selected text.
On selecting a style, it is
automatically applied to the selected
text.
2. Now imagine that you have just
finished creating an 80 page report
with several subheadings and your
boss is not happy with the font and
alignment. He wants you to change it
to left aligned, italics, bold, Arial point
14. You have been smart enough to
use a self created style for
subheadings. So now, all you need to
do is modify the style and it
automatically updates subheadings all
over the document! What a relief! But
how do you modify a style?
To modify a style, do the following:
1. Access the Styles pane.
Styles dialog box
Make the desired changes and click
OK.
Delete styles
You can delete a custom style created by
you. When you do so, the word processor
automatically applies the Normal style to
all paragraphs / text formatted with the
deleted style.
•
Access the Styles task pane.
•
Move your mouse pointer over the
style you want to delete, a drop
down arrow is visible. Click on the
down arrow and select the option
Delete…. A confirmation dialog
box appears. •
To delete the style, click YES; or to
cancel without deleting the style,
click NO. If you select yes, the
Page 44 of 240
style is deleted.
menu under Themes group.
Note: There may be situations (for
example, when you work on text from
another source) where you want to
remove all formatting from a selected
portion or the entire document. In such a
case, select the text and then the option
Clear All from the Styles task pane.
Session 5: Working With Themes
RELEVANT KNOWLEDGE
Themes can help in creating professional
looking documents with coordinated sets
of colors, fonts, effects and backgrounds.
When you create a new document in word
processing software, Office theme is
applied by default by which a specific set
of colors, fonts, effects are applied to the
document. However, you can customize
the look and feel of a document by
modifying theme settings or design your
own theme. Default Themes
Notice the default themes available in the
dropdown list.
•
To apply a theme, select it from the
dropdown list (for example,
concourse) and click on it. Notice
the
visual
difference.
Using default themes.
•
•
Open a new document in word
processing software and create a
document by using an existing
template available within the word
processor.
To view list of themes, select Page
Layout tab, click Themes dropdown
Customizing a theme
•
You can customize the look and feel
by modifying the theme color,
theme font and theme effects
available under Themes group
(Image below).
Page 45 of 240
Theme Colour
Theme Font
Theme Effects
• To apply a theme color, click the
dropdown menu available under theme
color and select by clicking on an item
available in the list.
look of the document by selecting a theme
you like. You can also fine tune the color
and font schemes to give your document
the desired professional looking design.
• To apply a theme font, click the
font and select by clicking on an item
available in the list.
Quick Styles available under Styles group
in Home Tab rely on the theme selection.
Similarly, the fonts in Fonts dropdown
and styles in Style Set dropdown (under
Change Styles dropdown in Styles group)
are determined based on a theme
selection. • To apply a theme effects, click the
effects and select by clicking on an
item available in the list.
1. Select File > New.
Notice the changes in the document after
applying theme color, theme font and
theme effects.
2. Select Equity Report under
Installed Templates and Click
Create. Download themes
3. Now navigate to Page Layout Tab
You can download and use themes in a
document. To do so, 4. Select Median Theme from Themes
dropdown list. 1. Select Page Layout tab.
2. Select Themes dropdown under
Themes group and click Browse for
Themes. Relation between Quick Styles and
Themes
Having worked with styles, Quick Styles
and Themes, it is now important to grasp
the relationship between them. On the
surface, it seems that both serve the same
function, helping you to change color,
typefaces and style sets. However, the
difference is that while themes define the
overall look of your document, styles offer
different palette options that work with
the main design.
Once you apply styles to your document,
you can quickly change its look to suit
your needs by selecting the Quick Style
set you want. You can further refine the
5. Navigate to Home Tab, Click
Change Styles Dropdown menu
Notice the list of Fonts tailored for this
particular theme. To summarize, when styles are used in a
document it interacts with the Quick
Style Sets and themes to provide
professional looking documents. Session 6: Playing With Pictures
RELEVANT KNOWLEDGE
You have already learnt to insert pictures
in a word processor document. You can
customize the pictures by resizing and
using special effects available within the
word processing software. Modifying pictures and their appearance
Open a new document in word processor
and insert a picture into the document.
Page 46 of 240
Click on the picture. You will notice the
image has a black border around it and at
each corner and in the middle of each side
are boxes. A “Picture Tools” toolbar pops
up with an additional Format tab on the
menu bar (refer figure below).
Word processing software includes
support for limited photo formatting and
editing. However, if you want to use
advanced functions consider using photo
editing software such as GIMP,
Photoscape, Paint.NET, etc. example, if the document that has
pictures is intended to be sent over email,
select EMail (96 ppi): minimize
document size for sharing and Click Ok.
Click Ok. Large pictures occupy more space in turn
increasing the file size of the document.
In such cases, you can reduce the size of
the picture or compress them to save hard
disk space. Crop pictures
You can crop the picture to discard
unwanted areas of a picture (sample
below).
Compressing pictures
To compress a picture, do the following:
•
Select Format Tab. •
Select Compress Pictures under
Adjust group.
To crop the picture, •
Select Format tab. •
Select Crop tool under Size group.
Use the crop cursor to remove
unwanted areas of the picture. Resize a picture
•
Click Options… A dialog box with
settings for compression appears
You can resize a picture to show the
complete but smaller version of it.
To resize, drag the boxes at the corner of
the picture until the desired size is
reached. Alternatively, you can specify the size in
height & width by specifying numeric
value in the height in Size group. You can specify the settings here. For
& width text box
Note: Dragging the boxes in the middle of
each side will only change the height or
width dimensions (depending on which
Page 47 of 240
side you choose). To keep the picture’s
height and width ratio in proper
proportion, drag the boxes at the corner;
both the height and width will
simultaneously resize so that your picture
stays perfectly proportioned. Also
remember that the larger you resize your
picture, the more pixilated (grainy and
blurry) it gets.
the following:
•
Select Picture Effects dropdown in
Picture Styles group. •
Bring your cursor on Reflection >
and select Tight Reflection,
touching effect (example below).
Improving clarity
In some cases, the picture may lack
clarity due to excess brightness or
contrast. a) To modify the brightness of the picture,
Select Format Tab. Select Brightness
dropdown and select the value
(percentage). b) To modify the contrast of the picture,
Select Format Tab. Select Contrast
dropdown and select the value
(percentage). For much accurate adjustment, do the
following:
•
Select Brightness or Contrast
dropdown.
•
Select Picture
Options.... •
Move the slider next to brightness
and contrast to preview
•
Now apply other reflection effects.
Practice by applying Shadow, Glow, 3D
& bevel effects to illustrations and
observe the difference. You can apply different shapes to
pictures. To apply a cloud shape to a
picture, do the following:
1. Select Picture Shape dropdown in
Picture Styles group. 2. Select Cloud from the dropdown
list. Correction
Click Close once necessary
modifications are made.
Applying special effects
At times, some illustrations look better
when polished using special effects. Word
processing software includes picture
styles such as Shadow, Reflection, Glow,
3D & other effects for enhancing
pictures. To apply reflection effect, you need to do
Now apply different shapes and observe
the effects.
Session7: Insert & Format Screenshots in A Document
RELEVANT KNOWLEDGE
A screenshot is an image taken by the
user to record what is displayed on the
monitor of the computer. Screenshots are
Page 48 of 240
used for demonstrating a program or a
problem associated with a program. For
example, there are several screenshots
included in this manual demonstrating
various options available within the word
processing software. You can take screenshots by using the
Print Screen key and this option captures
the entire screen that can be inserted as a
picture in a document. •
Click Properties. Ensure the screen
is the active window.
•
Press ALT + Print Screen on your
keyboard.
•
Use CTRL+V to paste the
screenshot in a document.
To take a screenshot of the entire
desktop, do the following:
•
Open a new word document. •
Press Print Screen Key on your
keyboard. •
To paste the screenshot on the
word document, press CTRL+V
together on the document. Notice
the entire screen is pasted into the
document. Screenshot of Computer System Properties
Notice only the active window is pasted in
the document. You can further modify or crop the
screenshot or apply effects to enhance the
image using the word processing
software. Session8: Create Text Boxes And Pull
Quotes
RELEVANT KNOWLEDGE
Screenshot of word processing software
In some cases, you may need to insert
portions of a screenshot instead of entire
screen, in that case you can use the ALT
+ Print Screen Key combination. For example if you want to take the
screenshot of only the computer
properties, do the following:
•
Rightclick My Computer.
A text box is used for placing a block of
text in a document. Though a text box can
be placed anywhere in a document, it is
usually used for highlighting key points
that are indicated within quotes( i.e. “”). A “pull quote” is a quotation or excerpt
from an article highlighting or
summarizing a key topic. It is typically
used in journalism and publishing. For
Page 49 of 240
example, you might notice shorttext such
as a proverb or advertisement quoted in
italics in the middle of a document or an
attention grabbing text message in a
newspaper (Samples below).
2. Select Simple Text Box from the
Text box dropdown. (See sample
below).
Replace the default text with the
following in italics and within quotes.
“TEAM, T Together, E Everyone, A
Achieves, M More – Chambless.”
Resize the text box as required.
Advertisement (left) and Attention grab
in a Newspaper (right)
To understand and work with pull quotes,
do the following:
1. Create a new document
2. Type the following text displayed
below:
Teamwork
Teamwork refers to efforts made by
individuals in a team who work together
to achieve a common goal.
You can insert pull quotes using text
boxes to annotate and make an article
appear interesting by adding exciting
facts. For example, you can use the text
“TEAM, T Together, E Everyone, A
Achieves, M More Chambless.” to
annotate with the topic mentioned above.
To insert a textbox, you can either use the
builtin text box gallery or draw a text
box that suits your needs. To use a text
box from the builtin text box gallery
Notice the document containing text
annotated through a sample pull quote. At times, the text box from builtin
gallery may not suit your purpose. In
such a case, you can draw a custom text
box by doing the following:
•
Click Text Box dropdown available
under Text group in the Insert tab.
1. Click Text Box dropdown available
under Text group in the Insert tab.
Page 50 of 240
box. Now you can use the text box
to fill content such as text or
image. Customize text box
You can customize the appearance of the
text box to make it look more attractive.
To modify the text box, do the following:
Select by doubleclicking on the text box.
•
Click and drag to draw the text
a)
Notice the Dashed Outline Accent
3 applied to the text box. Now customize the text box further by
applying different shape fills & shape
outlines available in Text Box Styles
group. You can also apply different shadow
effects from Shadow Effects dropdown in
Shadow Effects group. Session 9: Word Art And Other
Special Effects
Apply a text box style from Text Box
Styles group in Format tab. For example,
select Dashed Outline Accent 3 from the
Text Box Styles dropdown menu. You can add special effects to text such as
Shadow, 3D Rotation, etc. to make text
visually attractive. To create a poster for Children’s day, use
WordArt and do the following:
•
Open a new document
•
Select WordArt option in Text
group under Insert tab. (figure below).
RELEVANT KNOWLEDGE
WordArt is a textstyling utility. It allows
users to create stylized text with
numerous "special effects" such as
textures, outlines, etc and many other
manipulations that are not available
through the standard font formatting. Page 51 of 240
•
You can select from a variety of
styles from the WordArt dropdown list.
For example, select WordArt Style 16
from the dropdown list. A dialog box
appears similar to the one below.
•
Replace the default text with
“Children’s Day”. •
Click OK. You will see a result
similar to the one below.
You can customize the text further by
adding 3D effects. For example, select
3D Style 7 from 3D Effects dropdown
menu in Shadow Effects group. (result
below).
Practice by applying different WordArt
styles. Session10: Using SmartArt
RELEVANT KNOWLEDGE
SmartArt is a set of editable & formatted
diagrams in word processing software
that are used to create organizational
charts, process diagrams, relationship
diagrams, etc. When you want to present a flow chart, a
good visual diagram can help you easily
explain the flow or the steps involved.
Word processing software have a feature
called SmartArt using which, it is
convenient and easy to create such
diagrams. SmartArt categories
There are 115 preset SmartArt graphics
layout templates in categories such as
list, process, cycle, and hierarchy. For
example, if you would like to create a
diagram to represent a process flow, you
can use the Process SmartArt Style. SmartArt has seven categories. These are
1.
List – Use this style to present a
listing. 2.
Process – Use this style to show
steps in a process. 3.
Cycle Use this style to show steps
in a continuous process.
4.
Hierarchy Use this style to
represent an organizational chart or
decision tree diagrams.
5.
Relationship Use this style to
represent relationships.
6.
Matrix Use this style to display
how parts relate to a whole.
7.
Pyramid Use this style to display
relationships with the largest component
at the top or the bottom. Creating a SmartArt diagram
To work with SmartArt, do the following:
1.
Open a new document in the Word
processor.
2.
To insert a SmartArt illustration,
click on SmartArt option available under
Illustrations group in the Insert tab. A
dialog box with a list of SmartArt styles
appears (shown below).
Page 52 of 240
Example of online shopping process flow
Adding visual effects
If you want to enhance the visual effects,
you can choose from the SmartArt Styles
available in Design tab. To apply a style,
doubleclick
the
SmartArt
SmartArt dialog box
To represent a online shopping process
flow, do the following:
•
Select Process (left pane).
•
SelectVertical Chevron List layout.
•
Click OK.
When an instance of a SmartArt is
inserted, a text pane appears next to it
enabling the user to enter text that
should appear in the SmartArt graphic.
Each SmartArt graphic, based on its
design, maps the text outline, onto the
graphic.
1.
Replace [Text] by following the text
given below:
1.
Step 1: Visit www.flipkart.com
2.
Step 2: Select Products
3.
Step 3: Compare Price &
features
4.
Step 4: Add to Shopping Cart
5.
Step 5: Make payment
Notice the flow chart created looks
similar to the one below. Select subtle effect from the SmartArt
Styles dropdown list. Notice the effect
applied to the SmartArt (figure below).
If you want to modify the SmartArt by
adding colors, you can choose a color
scheme from Change Colors dropdown in
SmartArt Styles group. For example,
select ColorfulAccent colors from the
Change Colors dropdown menu. Notice
the color scheme applied to the SmartArt
(Figure below). Color Scheme applied to the SmartArt
Modifying the SmartArt content
Page 53 of 240
If you want to add another step, you can
use the Add Shape dropdown menu
available in Create Graphic group under
Design tab. If you want to switch the layout, you can
use the Right to Left option in Create
Graphic group. Create Graphic group
Use the Promote & Demote option in
Create Graphic group to promote or
demote levels in a list (for example,
replace step 3 with step 2 and vice versa).
Now apply different styles available
under SmartArt Styles group. Session 11: Controlling Text Flow
RELEVANT KNOWLEDGE
When you read newspapers or magazines,
you might have noticed text content span
across different pages. When entering
text there must be some way wherein the
text flows from one text box to another on
a different page. across pages? Editors use special procedures to control
text that can span across multiple pages
through a feature builtin within the
word processing software.
Text flow is a word processing feature
that can help in controlling text flowing
across multiple pages. To understand text
flow and how it operates, do the following:
1.
Open a new document
2.
Insert couple of text boxes using
the Draw Text Box option to include
roughly four to five lines of text content
(Height about 1 inches and width about 1
inch, sample below) across two pages.
3.
By default, text boxes move along
with the content within the document
making it difficult to work with. So, to
make the text box fixed in a particular
position, doubleclick the text box. 4.
By default, text boxes move along
with the content within the document
making it difficult to work with. So, to
make the text box fixed in a particular
position, doubleclick the text box. 5.
Select Format tab.
6.
Select More Layout Options… in
Text Wrapping dropdown under Arrange
group. A Advanced Layout window
similar to the one below appears. You might have noticed that the first five
to six lines of a news item may be present
on the main page and rest of the news
content continue several pages away.
Have you ever thought how do the
editors control the content and its flow
Page 54 of 240
7.
Uncheck Move object with text
8.
Uncheck Move object with text
under Options.
9.
Click OK. Now the text box is fixed
in its position and will not move when
text is added to the document. Repeat the
procedure for the second text box. 10.
You need to establish a link
between the two text boxes for the text to
flow between the two boxes. To establish
the link, do the following:
11.
Select the first text box. 12.
Select Format tab.
13.
Select Create Link in Text
group. Notice the shape of the cursor
changes to a straight pitcher with a down
arrow on it.
14.
Now place the pitcher cursor over
the second text box (Notice the straight
pitcher cursor now changed to tilted
pitcher) and click. This will create the
link between the first box and the second
box.
15.
Enter the following content in the
first text box:
Importance of Soft Skills
Soft skills are often described by using
terms often associated with personality
traits, such as:
(a)
Optimism
(b)
Common sense
(c)
Responsibility
(d)
A sense of humour
(e)
Honesty
These are also abilities that can be
practiced (but require the individual to
genuinely like other people) such as:
a)
Empathy (sensitivity to others
views/feelings)
b)
Teamwork
c)
Leadership
d)
Communication
e)
Good manners
f)
Negotiation
g)
Sociability
h)
Ability to teach.
It's often said that qualifications and
expertise (often called “hard skills”) will
get you through an interview but you
need soft skills to get (and keep) the job.
Many people often refer to 'soft skills' as
'people skills' or 'emotional intelligence'.
Hard skills are the technical abilities
required to do a job or perform a task:
essentially they are acquired through
training and education programs.
Some studies have shown that a person's
ability to manage his or herself and relate
to other peoplematters twice as much as
intelligence or technical skills in job
success.
Results of recent studies on the
importance of soft skills indicated that
the single most important soft skill for a
job candidate to possess was
interpersonal skills, followed by written
or verbal communication skills and the
ability to work under pressure.
The work environment is constantly
changing due to technology,
customerdriven
markets,
an
informationbased economy and
globalization. These factors impact on the
structure of the workplace and lead to an
increased reliance on, and demand for,
Page 55 of 240
soft skills.
Soft skills are not a replacement for
hard/technicalskills. They are, in many
instances, complementary, and serve to
unlock the potential for highly effective
performance in people qualified with the
requisite hard skill.
Notice the text continues to fill in the
second text box automatically. You can
also link multiple text boxes using the
above mentioned procedure. Similarly, to remove the link between
text boxes, do the following:
(a)
Select the text box
(b)
Click Format tab (c)
Select Break Link option available under Text group.
Page 56 of 240
IT/ITES 304: SPREADSHEET (ADVANCED)
Session 1: Insert and Modify Pictures
and ClipArt
(figure below).
RELEVANT KNOWLEDGE
You have learned to work with pictures
and clipart in earlier sessions using word
processing software. You can insert
pictures and clipart in spreadsheet
software as well. Spreadsheet software includes a variety
of clip arts. You can use these in
spreadsheets. Searching and inserting a Clip Art
If you want to insert a clip art in a billing
statement, do the following:
1.
Click File > New. Under New
Workbook dialog box, select Installed
Templates. 2.
Select Billing Statement template
from Installed Templates and click
Create. A window similar to the one
below appears.
Billing statement template
Notice the template does not have any
logo or pictures. To insert a clip art, do
the following:
1.
Select Clip Art under Illustrations
group in the Insert tab. The Clip Art search dialog box appears Clip Art search dialog box
1.
To search for a clip art use relevant
keywords in the search box. So, to display
clip arts related to billing, type billing in
the Search for: text box and click Go. Notice clip arts tagged as billing in the search results (figure below).
Search results dialog box
Note: Spreadsheet software will display
the Clip Art Organizer dialog box to
include search results of clip arts from
online web site (if not prompted before).
Page 57 of 240
This option requires an active Internet
connection as the spreadsheet software
needs to fetch relevant clip arts from the
online website based on the keywords
specified in the search text box. Preview and insert a Clip Art
To preview the clip art before inserting into the spreadsheet, do the following:
•
Click on the dropdown arrow next
to the clip art (figure below, left) and click
preview/ properties. A Preview/
Properties dialog box along with selected
clip art appears with technical & keyword
details such as file format, image vertical
& horizontal size, file size, assigned
keywords, etc.(figure below, right).
Billing statement spreadsheet with
clipart.
Insert a picture
You can also insert pictures or photos in a
spreadsheet. For example, you can insert
a logo in an invoice, locations of sites in a
travel quotation, etc. To insert a picture
do the following:
1.
Open a new workbook in
spreadsheet. Click on the Insert tab on
the Ribbon.
2.
Click on the option Picture in the
Illustrations group (figure below). 3.
The Insert Picture dialog box
appears (figure below). Browse the
location of the picture, select the picture
and click Insert. •
To insert, doubleclick on the clip
art. Notice the clip art is added to the
spreadsheet (figure below).
Page 58 of 240
Note: Spreadsheet software inserts the
clip art or the picture with its actual size.
The Clip Art may be too large, thus,
hiding the essential details in the
spreadsheet. Hence, it is advisable to
resize the clipart or the picture. To resize the picture/clip art, do the
following:
1.
Drag the corners of the clip art or rightclick the picture.
2.
Select Size and Properties option
and specify the desired width & height of
the picture just as you do in a word
processor.
Applying Effects
You can apply special effects such as
Shadow, Reflection, Glow, 3D effects, etc.
to enhance the appearance of a clipart or
picture. Adding special effects can make
the spreadsheet look attractive. For example to apply 3D effect, do the
following:
1.
Doubleclick on the clip art or picture. 2.
Select Picture Effects dropdown in
Picture Styles group under Format Tab. 3.
Point to 3D Rotation.
4.
Select Isometric Right Up from the
list. Notice the Isometric Right Up style is
applied to the picture. To practice what you have just learnt,
insert different clip arts & pictures in the
same worksheet. Apply different Picture
Effects, Picture Shapes & Picture Borders
and observe the change. Page 59 of 240
available under the Illustrations group
under the Insert tab. To insert a shape, do the following:
1.
Open a new workbook and enter
the following data:
2.
You will insert visual call outs to
illustrate the reason for high volume of
sales. To do so, select Insert tab. Picture Shapes, Picture Borders &
Picture Effects dropdown menus.
Session 2: Draw and Modify Shapes
3.
Under Shapes dropdown menu in
Illustrations group, select Rectangular
Callout. Click and drag until the shape is
complete. 4.
Add the requisite text within the
Rectangular Callout (sample figure
below).
RELEVANT KNOWLEDGE
You have learnt to work with shapes in
earlier sessions using word processing
software. You can use shapes in
spreadsheets to annotate or insert a
comment to compliment the data or the
data analysis. Inserting a shape
You can shapes such as lines, basic
geometric shapes, arrows, equation
shapes, flowchart shapes, stars, banners,
and callouts using the Shape option
Notice the attention grabbing text in the
rectangular callout representing the
reason for high sales figure in the table. Modifying a shape
Page 60 of 240
You can modify the callout to enhance the
visual appearance by applying different
styles . To modify the callout you had
created, do the following:
1.
Doubleclick on the callout.
2.
Select Subtle effect – Accent 3
visual style from Shape Styles dropdown
menu. Notice the visual effect applied to
the callout (figure below).
You can apply fancy effects such as
reflection, shadow, glow, etc. to make this
callout look much more attractive. 1.
To apply glow effect, point to Glow
from Shape Effects dropdown menu in
Shape Styles group.
2.
Select Accent Color 1, 8 pt glow
from the list and apply. Notice the Glow
effect applied to the callout (figure
below).
You have already learnt about SmartArt
and using it in Word processing software.
You can use Smart Art in spreadsheet
software to illustrate a timeline or a
workflow process.
You can illustrate a sequence of actions or
events such as different phases of a
project or process by using SmartArt in
spreadsheet software. Workflow consists
of a sequence of actions where each step
has a precedent before the next action or
step can begin. You can basic workflow
process using SmartArt. Workflow process can vary from simple to
complex structures. It is widely used in
almost every business today, ranging
from manufacturing, production to
research & development, etc. For example, a simple workflow process
for recruitment includes:
•
Post job description and required qualification.
•
Collect resumes.
•
Match skill sets.
•
Conduct preliminary assessments.
•
Shortlist potential candidates.
•
Conduct facetoface interviews.
•
Finalize candidates.
•
Provide employment offer.
•
Complete hiring formalities.
To create the illustration for this
workflow process, do the following:
1.
Select Insert tab. 2.
Select SmartArt in Illustrations
group. A window similar to the one below
appears.
Session 3: Illustrate Workflow Using SmartArt Graphics
RELEVANT KNOWLEDGE Page 61 of 240
1.
Notice, the recruitment process
defined here is a continuous process. To
illustrate a continuous process, you can
use the Cycle SmartArt graphic. Select
Cycle from the list (left)
2.
Select Basic Style and click OK. A
SmartArt graphic similar to the one
below is displayed.
3.
You need to add text to illustrate
the workflow process. To modify the
default text, enter the following under
Type your text here section: •
Post Job Description & required qualification
•
Collect Resumes
•
Match Skill sets
•
Conduct Preliminary Assessments
•
Shortlist Potential Candidates
•
Conduct Facetoface interviews
•
Finalize candidates
•
Provide employment offer
•
Complete hiring formalities
The recruitment workflow (illustrated
below), now displayed as a continuous
process, is easier to comprehend. Modify a SmartArt
To enhance visual appearance of the
SmartArt, you can use the Design tab to
customize the color, style and layouts. To
apply a style, do the following:
1.
Select Design tab
2.
Select Moderate Effect available in
SmartArt Styles group and apply. Notice
the visual effect changed (figure below). Use the following table as a reference
when illustrating workflow process:
•
Use List, if you want to illustrate a
listing that do not follow a stepbystep
process.
•
Use Process, if you want to
illustrate a one way process.
•
Use Cycle, if you want to illustrate
a continuous process.
•
Use Hierarchy, if you want to
illustrate tree structure such as an
organizational chart.
•
Use Relationship, if you want to
illustrate connections between sets.
•
Use Matrix, if you want to
illustrate how parts relate to a whole.
•
Use Pyramid, if you want to
illustrate a top to bottom proportional
relationship.
Page 62 of 240
Session 4: Layer and Group Graphic Objects
RELEVANT KNOWLEDGE
You have already learnt to group
graphical objects in word processing and
presentation software. You can also group
graphical objects in spreadsheet software.
Grouping can help when you want to
simultaneously move, rotate or resize
multiple objects in a workbook. You can
group objects such as pictures, clip art,
shapes and text box. Once grouped, they
appear as a single object. Layers
When working with graphical objects
such as pictures, clip arts, shapes, etc.,
each object is layered on top of each other.
For example if you insert a picture over
data, the picture overlaps hiding the data
and likewise if you draw a shape over a
picture, the shape overlaps hiding the
picture. You can rearrange layers
according to your requirement after
inserting several pictures, clip arts or
shapes. To understand working with layers, open
a workbook using spreadsheet software
and add few graphical objects to the
workbook (sample figure below).
Notice the graphical objects overlap each
other. In this example, a star overlaps a
square box, which in turn overlaps the
computer clip art.
Viewing and moving between layers
To view layers, do the following:
•
Select the Page Layout tab. •
Select Selection Pane in Arrange
group.
On doing so, the Selection and Visibility
dialog box appears (figure below).
•
Select the layer from the list to
highlight. •
To move a layer up or down, you
can use the up arrow or down arrow
buttons in the Selection and
Visibility dialog box. For example, to bring the computer clip
art to the front as the topmost layer,
select it and then click the up arrow
button until it is visible as the topmost
layer. With every click, you will notice a
movement of the object selected.
The Selection and Visibility dialog box
helps you easily arrange objects in
different layers. Grouping Objects
Sometimes, you work on a spreadsheet
that has multiple graphical objects, each
object being placed with great care at a
relational distance from each other. To
move them all to another position would
Page 63 of 240
mean spending effort in positioning them
once again. So what’s the solution? Grouping can help in organizing a group
of objects to act like one single object
making them easier to move in a
worksheet. To understand how to group objects, do
the following:
•
Open a worksheet and insert
different graphical objects (sample figure
below). •
Select all the objects that you want
to group. To select multiple objects, press
the Ctrl key and select the objects. Multiple objects selected for grouping
•
Select the Group option available
under Arrange group in the Format tab. •
Click on Group, to group all the
selected graphical objects in the
workbook. •
Try moving or resizing the object;
notice all the objects grouped move as if it
is it is a single object. Similarly, to ungroup, select the object
and then select Ungroup available in the
Group dropdown menu. Session 5: Goal seek
RELEVANT KNOWLEDGE
Goal Seek is a special and very useful
feature of spreadsheet software. This
feature allows you to alter the data used
in a formula in order to find out what the
modified results will be. Basically, goal
seeking is the ability to calculate
backwards to obtain an input that would
result in a given output. This is also
referred to as the whatif analysis or as
back solving. For example, if you want sell a book
worth Rs.500 with a sales target of Rs.
30,000 but are unsure of how many books
you need to purchase and sell, you can
use the goal seeking method to create a
forecast. This function helps you to see
how one element of data in a formula
affects another.
To learn about this feature of
spreadsheets, you will first create a
scenario with the example discussed
above and then create a forecast using
goal seek.
Do the following:
•
Open a new worksheet and enter
the following details in respective rows
and columns.
To compute the total amount, calculate
the product of the price per book and the
number of books to be sold. Enter the
Page 64 of 240
formula in B3 as =B1*B2. Since we do not know the number of
copies to sell to reach the target revenue,
keep the value as zero in B3. Now, use Goal Seek function to find out
how many copies are needed to achieve
the target revenue.
•
To use goal seek, click Goal Seek
from WhatifAnalysis dropdown menu
available under Data Tools group in Data
tab. A Goal Seek dialog box appears.
Now enter the following values:
•
Specify the cell reference as B3 in the Set Cell text box. •
Specify the cell reference as B2 in
the By Changing Cell text
box;spreadsheet software will change the
goal value until it completes matching the
target income.
•
Select the To Value text box and
enter the goal, 30000.
•
Click Ok.
Notice the Goal Seek Status dialog box
that displays the progress for computing
the value necessary to reach the goal
value. Notice that No. of books to Sell is
automatically populated with a target
value of 60 to meet the income of Rs.
30000.00.
Note: The Step & Pause buttons in the
Goal Seek Status dialog box will be active
when spreadsheet software is unable to
find a solution. If you would like to set different targets
or goals, click Undo (CTRL+Z) and try
with different target values using the
procedure outlined in this session. This feature can be very useful in loan or
investment calculation. Another scenario
where this feature can be used is to
answer the “whatif” questions people ask
after elections (for example, how many
votes would have been needed to win,
etc.). Session 6: Analyze Data with Logical
and Lookup Functions
RELEVANT KNOWLEDGE
When you need to perform complex
calculations and data analysis, you can
use the powerful functions of a
spreadsheet Lookup function and
Logical function. For example, if you have a large database
of customers and you want to find out
customers by location, town, etc. you can
use a combination of logical and lookup
functions for your data analysis. Lookup functions are used to return a
value from a single column or from an
array. For example, if in one sheet of a
spreadsheet, you have a parts list in a
table containing thousands of part
numbers and their description and other
details (supplier, price etc.). On a
separate sheet in the spreadsheet, you
have the Invoice with columns for Part
Page 65 of 240
Number, Description, Quantity Sold,
Price, and Total. Now, when you enter
the part number in the Part Number
column of the Invoice sheet, the
VLOOKUP function can be used to
automatically search for and get the
related details of the input part number
(description, price, etc).
This has a two pronged benefit:
•
It helps avoid data entry errors.
•
Updation in one central place will
automatically be reflected in places where
the data has been used.
Logical functions in a spreadsheet help in
decision making based on conditions.
Logical Functions
Spreadsheet software provides seven
logical functions that are available under
Logical dropdown in Function Library
group under Formulas tab. Logical function employs operators for
returning TRUE or FALSE values. Logical Operators compare two values
and return the result as either a TRUE or
FALSE. Operators include =, <, >, <=, >=, and <>. Logical functions include AND, TRUE, FALSE, IF, NOT, OR and IFERROR.
AND Function
The AND function returns TRUE if all
the argument results are true and
returns FALSE if one or more argument
results are false. To understand AND
function
1.
Open a new worksheet and enter the following data:
2.
Type the following in cell B2 & B3
=AND (5<A2, A2<100) and press Enter. •
The AND function will display
TRUE if the number is within the range
of 6 to 100 AND the value should be
greater than 5. •
The AND Function will display
FALSE if the value is not within the
mentioned range. Notice the result in the column where the
formula was entered.
OR Function
Returns the value TRUE if any argument
is true and returns the value FALSE if all
arguments are false. To understand the
OR function
•
Enter the following data in a
spreadsheet:
Type the following in cell A6 = OR (A1>50, A2>60, A3>100) and press Enter.
•
The OR function will display TRUE
if any of the values present in A2, A3 or A4 satisfies the rule mentioned in the formula. •
Notice the result.
IF Function
The IF function is used where logical
decisions are needed in a calculation. To
understand the IF function.
•
Enter the following data:
•
Page 66 of 240
NOT (A1="I like to learn more") and
press Enter. You see the result as given
below:
•
Type the following in cell C2 = IF
(A2>B2,"Insufficient Funds") and press
Enter. •
Wherever the value in Expense
column is greater than the value in
Income column, the IF Function displays
a comment “Insufficient funds” in the
Comment column.
•
Now change the value in the
Expense column making it less than the
value in the Income column and notice
the Comment changing to “FALSE” as the
given condition is no longer met. IFERROR Function
The IFERROR function returns either the
specified result if the formula is right or a
user specified error message if formula
leads to an error. To understand
IFERROR function
•
•
Type the following in cells D2, D3
& D4 = IFERROR(B2/C2, "Error in
calculation") and press Enter. •
The IFERROR function displays
either the result if the formula and the
values are right or “Error in calculation”
if the value cannot be computed. NOT Function
The NOT function returns reversed
logical value i.e. if it is used for a TRUE
expression, FALSE is returned, but, if it
is used for FALSE expression, TRUE is
returned. To understand the NOT
function.
•
Enter the following in cell A2 =
•
Now enter “I like to learn more” in
cell A1 and press Enter. Notice the
changed value. TRUE() and FALSE() Functions
The TRUE() function returns the logical
value TRUE in its cell. Similarly,
FALSE() always evaluates to logical value
FALSE. These functions are used with
other functions. TRUE() or FALSE() can be used for
testing purposes to force a certain value
to be returned. For example, consider the
IF statement:
•
IF (logic_test;true_value;false_value). •
If logic_test evaluates to TRUE, true_value is returned, otherwise false_value is returned. Lookup Functions
Lookup functions return values by
looking up a table. Most popular lookup
functions include the VLOOKUP and
HLOOKUP. These functions are available
under Lookup & Reference dropdown in
Function Library group under Formulas
tab.
Note: VLOOKUP needs data to be sorted
in ascending order; sort the data before
attempting to use the function in a
spreadsheet.
VLOOKUP looks for data vertically (top
to bottom) until it locates a value that
matches your query. HLOOKUP looks for
data horizontally (left to right) until it
locates a value that matches your query.
Lookup functions are used when you have
a huge amount of data to analyze and
Page 67 of 240
take decisions. To understand the
VLOOKUP function, you will work on an
exercise that is based on the assumption
that the spreadsheet has a lot of data and
that you need to find out the department
of a person by specifying the Employee
ID. Do the following:
•
•
Type the following formula in cell E3 (or any other empty cell) = VLOOKUP(A3,A1:C4,3,0) and press Enter. The output will be as given below:
The syntax of VLOOKUP is:
=VLOOKUP(lookup_value,table_array,col
_index_num,[range_lookup])
•
Lookup_Value is the value you
want to search for in the first column of
the table_array. In this case, it is the
Employee ID (A3). •
Table_Array is the data range to be
searched. In this case, it is A1:C4.
•
Col_Index_num is the number of
the column in the table_array that
contains the data you want returned. In
this case, it is the third (3) column that
refers to department. •
Range_lookup is the logical value
that returns either TRUE or FALSE.
This value indicates if VLOOKUP should
return an exact value or an approximate
value. •
If TRUE, an exact or approximate
match is returned. If the exact match is
not available, then the next largest value
is returned. •
If FALSE, only an exact match is
returned. If the exact match is not
available, then the error value #N/A is
returned.
To understand HLOOKUP, you will work
on an exercise where it is assumed that
the records or data are available
horizontally (figure above) and that you
need to find out the Department of a
person using the Employee ID. Do the
following:
•
•
Type the following formula in cell D5 (or any other empty cell):
=HLOOKUP(10203, A1:D3, 3,0) and press Enter. The output will be as given below:
The syntax of HLOOKUP is:
=HLOOKUP(lookup_value,table_array,ro
w_index_num,[range_lookup])
•
Lookup_Value is the value you are
searching for in the first column of the
table_array. In this case, it is the
Employee ID (D3). •
Table_Array is the data range to be
searched. In this case, it is A1:C4.
•
Row_Index_num is the row
referenced for returning respective value.
In this case, it is the third (3) row that
refers to department. •
Range_lookup is the logical value
Page 68 of 240
that returns TRUE or FALSE; this value
indicate if HLOOKUP should return an
exact value or an approximate value. •
If TRUE, an exact or approximate
match is returned. If the exact match is
not available, then the next largest value
is returned. •
If HLOOKUP value is smaller than
the smallest value, the error value #N/A
is returned. In this session, you have learnt about the
fundamentals of logical & lookup
functions. You can perform complex
analysis by combining the functions with
different arguments. You can also use
data from different columns, rows,
worksheets or spreadsheets for data
analysis. Refer to the spreadsheet help
file for more syntax, constraints and
examples to learn more about logical &
lookup functions in detail. Session 7: manage themes
RELEVANT KNOWLEDGE
Themes are used to format a spreadsheet
and make it look attractive. For example,
you can create attractive scorecards,
business reports or invoices to customers
(email or color print) by using themes. You can apply themes to existing
documents, documents created from
templates or a even a blank document. To apply themes to a new spreadsheet, do
the following:
•
Create a new spreadsheet for
managing your weekly timetable similar
to the one below (Include fields for days,
number of periods(classes) per day and a
shape to indicate the heading).
Weekly timetable sample using shapes
and table formatting
•
Select Page Layout tab
•
Select Paper theme from Themes
dropdown (sample below) and observe the
changes. Select different themes until you
find a theme that fits your need.
Weekly timetable sample after applying
Paper Theme. You can customize the look
and feel of a workbook by modifying the
Theme Color, Theme Font and Theme
Effects available under Themes group
(figure below).
Colors, Fonts & Effects dropdown menu
For practice, change the theme color to
Oriel and observe the change. Oriel Color applied
Now change the theme font to Technic
and observe the difference. Page 69 of 240
Technic Font applied
Change the theme effect to Equity and
observe the change. Equity Effect applied
Note: There might be minor alternations
made when applying Fonts or Effects.
Pay close attention to the changes.
Saving a Theme and using it later
You can save themes for future use once it is customized. To save a theme, do the following:
•
Select Page Layout Tab
•
Select Save Current Theme… in
Themes dropdown menu (figure below)
Saving themes
•
Type a name for this theme, for
example: MyTheme01 (figure below) and
click Save.
Save Current Theme dialog box
To apply this theme to another
spreadsheet, do the following:
1.
Open the spreadsheet
2.
Select Page Layout tab
3.
Select Themes dropdown menu in
Themes group (figure below)
4.
Notice the theme saved earlier is
now available in the list. You can apply
the theme by clicking on it.
Custom Themes in Themes dropdown
Downloading Themes
You can download and use themes in a
workbook. Use search engine such as
Google to find download themes from
different websites. To apply the theme
downloaded earlier, do the following:
1.
Select Page Layout tab.
2.
Select Themes dropdown under
Themes group.
3.
Click Browse for Themes. Select
the theme downloaded to your computer
and click Open. Theme will be applied to
the spreadsheet and results will be
displayed on the screen. Page 70 of 240
Session 8: create and use templates
RELEVANT KNOWLEDGE
Templates can help you save time and
effort because all the work it takes to
design a workbook has already been done.
You can use templates that are builtin
within the spreadsheet software or create
your own templates. Creating and using a template
To create a template, first you need to
create a spreadsheet as per your
requirements and then convert it to a
template. You can create templates for a
variety of purposes such as invoices, bills,
feedback forms, quiz, etc. To create a template of a bill that auto calculates the price with sales tax, do the following:
1.
Open a new spreadsheet.
•
Create the following entries (figure
below):
•
A6 to A11 (Description)
•
B6 to B11 (Price per quantity)
•
C6 to C11 (Quantity)
•
D6 to D11 (Total). Enter the
formula to autocalculate the total as a
product of price per quantity and
quantity {based on the values entered
in the cells (example: D6=B6*C6, etc.)}. •
C13 (Net Total).
•
D13 (=SUM(D6:D11)
•
C14 (Tax Amount).
•
D14 (leave this blank to enter tax amount)
•
C15 (Total Amount)
•
D15 (Enter the formula to find the sum of Net Total and Tax Amount)
Custom bill
1.
To save this as a template, select
File > Save As…. Select the type as
Template from the Save as type: drop
down list. For example, you can specify
Excel Template if you are using an Excel
Spreadsheet.
◦
Enter a file name, for example, Bill sample. Click Save.
Now you can use this template whenever
you need to raise a bill. To use this
template, do the following:
•
Select File > New
•
Select My Templates (figure below)
Template
•
Notice the Bill template created
earlier is now available. To use this
template, select the template and click
OK. A worksheet based on this template
will be created (figure below).
Page 71 of 240
templates installed by default. Hence, at
times, a template that you need may not
be readily available. In such a case, either
you can download the template from
websites.
To search for a template, do the following:
1.
Type a keyword for example,
billing, in the search box (centre section
of the New Workbook dialog box) and
Worksheet created automatically using the template.
Now you can use or share this template. Using inbuilt templates
You can also use the templates that are
inbuilt in the spreadsheet software.
To use templates available in the
spreadsheet software, do the following:
•
Click on File > New. •
To view the list of templates
installed along with the spreadsheet
software, click Installed Templates under
Templates. Notice the available list of
templates. •
To use a template, click on it from
the list and click Create. For example, if
you would like to create a tracker for
monitoring attendance, do the following:
•
Select the the Timecard template
from the list and click Create (figure
below). click the
icon. (Note: You need an
active internet connection to perform this
task.).A list of templates matching your
keyword appears.
2.
You can preview the templates. To
use a template, doubleclick on it. Timecard template
•
You can customize this worksheet
further according to your needs. Downloading templates
Spreadsheet software has limited
Page 72 of 240
Session 9: Update Workbook Properties
Keywords, Category Comments and
Status here.
RELEVANT KNOWLEDGE
Workbook properties contain information
about the workbook such as the author of
the workbook, date and time when the
workbook was created and modified, etc.
This information is referred to as
metadata.
Adding information about author,
company, etc. can help in identifying the
source of the document. For example if
you need to report an in error in a
document, it will be easy it you know
information about the author or the
company. You update a workbook's properties to
store additional information about the
workbook. For example, you might want
to store information about what the
workbook is used for to help potential
users of the workbook. You can only
update the properties of a workbook that
you own and currently have open.
You might also want to view a workbook's
properties to find out information about
the workbook. For example, you might
want to find out the name of the
workbook owner or the date that the
workbook was created or last saved.
To update a workbook’s properties, do the
following:
a)
Open a workbook in Spreadsheet
software. b)
Click on File. A dropdown menu
appears. c)
Click Prepare > Properties. An
additional detail dialog box appears above
the work area of your work sheet (figure
below). You can view or modify details
about the Author, Title, Subject,
d)
To view additional details such as
date of creation or when the spreadsheet
was last modified or accessed, click the
dropdown Document Properties located at
the left corner.
e)
Click Advanced properties. A
[Workbook name] Properties dialog box
appears. Notice the details available
under General, Summary, Statistics,
Contents and Custom tabs. Session 10: Creating&Editing Macros
RELEVANT KNOWLEDGE
Macros are used for storing a sequence of
action that can help reducing time and
effort while performing repetitive tasks.
In other words, when you find yourself
performing the same actions or tasks in a
spreadsheet, again and again, it is useful
to create a macro. A macro is a recording of each command
and action you perform to complete a
task. Once you have created a macro,
whenever you need to carry out that
particular task in a spreadsheet, all you
need to do is to run the macro!
To understand how to use macros, you
will first open a new workbook in
spreadsheet software and then format the
worksheet title. As you know, the macro recorder works
by recording all keystrokes and clicks of
the mouse. Since a worksheet title is
generally unique to a worksheet, before
Page 73 of 240
starting the macro, enter the tile as “My
Test Worksheet 1” in cell A1. Now do the
following:
•
Click on Macros option available
under Macros group in the View tab. A
dropdown menu appears.
This workbook
•
Using this option, the macro is
available only in this workbook.
•
New workbook
•
This option opens a new workbook.
The macro is available only in this new
workbook.
•
Personal macro workbook.
•
This option creates a hidden
workbook Personal.xlsb which stores your
macros and makes them available to you
in all workbooks. Macro created with this
option is available only after saving the
workbook.
•
Name the macro as MyMacro1.
•
Select Personal Macro Workbook
under Store the macro dropdown list and
click OK.
•
Notice a small blue square at the
left bottom (status bar) indicating the
current status (figure below). From now
the sequence of actions that are
performed will be recorded until the Stop
button is clicked.
•
Select the Record Macro... option
from the dropdown menu. A dialog box for
recording the sequence will be displayed
(figure below).
•
a)
Give a name to the Macro you are
creating. The name you give here will be
listed and can be used later.
b)
It is optional to specify a shortcut
key for the macro. You can enter in a
letter, number, or other character in the
available space. Doing so will allow you to
run the macro by holding down the CTRL
key and pressing the chosen letter on the
keyboard.
c)
Specify the location by selecting
one of the options from Store macro in:
dropdown
list.
•
Do the following sequence of
actions:
1.
Select cells A1 to M1.
2.
Click on Home tab and then on
Merge & Center option in the Alignment
group. Page 74 of 240
3.
Click on the bold icon in the Font
group.
4.
Select Fill colour drop down from
the Font group and select Theme Colour
Yellow.
5.
Now click the Stop button.
Alternatively, you can click on Macros
option available under Macros group in
the View tab. Notice that the option Stop
Recording is available here now. 6.
The Macro recorder will stop
recording keystrokes or actions and the
macro is ready to be used. Save this
workbook.
7.
Open a new workbook. Enter a
Worksheet title in cell A1.
8.
Click View tab
9.
Click Macros dropdown arrow and
click View Macros. You will see a Macro
dialog box containing list of macros
created earlier.
Notice that macro MyMacro1 appears in
the list. Click Run. Notice the actions
done earlier apply automatically to the
new spreadsheet.
Note: If you are using MSexcel the
spreadsheet software will save the
recorded macros with the file name of
PERSONAL.XLSB under C:\Documents
and Settings\USERNAME\Application
Data\Microsoft\Excel\XLSTART folder
so that the macros can be made available
whenever the spreadsheet software is
launched. Editing Macros
You can modify a macro to include
additional sequences or remove certain
sequences. However to edit Macros you need to
understand a language used by
spreadsheet software called Visual Basic
for Applications (VBA). In short, macros
are set of instructions written using VBA
and used by spreadsheet software to
complete a automated task. Caution with Macros
Though macros are usually created for
automating tasks, it is possible to create
macros programmatically that can run
programs or spread virus on a computer.
Spreadsheet containing macros are
considered to be a high risk. This is
because when a spreadsheet containing
macros is accessed from another
computer, spreadsheet software disables
the macros by default. This results in
reduced functionality of the workbook
itself as the macro is disabled and the
user sees with a window similar to the
one below:
If you are certain about the source, you
can change the settings available within
the spreadsheet software in order to allow
the macro to work.
To view the security settings, do the
following:
Click File > Excel Options > Trust Center
> Trust Center Settings > Macro Settings.
A window for altering security settings,
similar to the one below appears. Page 75 of 240
Notice the list of options under Macro
Settings on the right. By default, it is set
to Disable all macros with notification.
Macros can be digitally signed to confirm
it is safe. To receive a digital signature,
you need to contact the system
administrator or reputable certificate
authority (CA). If the spreadsheet
containing the macros is digital signed by
a reputable CA, macros will not be
disabled. If you receive a workbook containing macros and you want to:
•
Disable the macros and you don’t
want to be notified; select Disable all
macros without notification. •
Disable the macros and you want
to be notified; select Disable all macros
with notification.
•
Enable the macros only for the
workbooks that are digitally signed;
select Disable all macros without
notification. •
Run the macros in any case; select
Enable all macros (not recommended;
potentially dangerous code can run).
IT/ITES 304: PRESENTATION (ADVANCED)
Session 1: Working with a design template
RELEVANT KNOWLEDGE
In presentation software, there are many
inbuilt design templates with various
layouts, formatting and colors. These
combinations help you to create
eyecatching presentations. You have
learnt to work with templates in earlier
sessions using word processing and
spreadsheet software. You can also work
with templates in presentation software.
Templates or presentation templates
refer to a sample design that helps in
saving your time and effort. Sometimes, in a template, you may find
sample content along with designs. For
example, if you want to conduct a quiz
using a presentation you may choose a
Quiz template and modify the required
sections.
Viewing installed templates
Presentation software usually includes a set of sample templates. To view installed
templates, do the following:
1.
Go to File > New. A New
Presentation dialog box containing
different types of templates appears
(figure below). 2.
Select Installed Templates and
browse the list of templates installed on
your system.
New Presentation dialog box
Using installed templates
To create a quiz conducted through a
Page 76 of 240
presentation, do the following:
1.
Select the Quiz Show template
under Installed Templates section.
2.
Click Create. A presentation based
on the template opens (shown below).
Quiz Show template applied to a presentation
1.
Run the presentation to
understand the different types of question
styles in this template. 2.
Now you can use this template and
customize the contents by replacing the
Questions, Answers, Transition effects,
Animation etc. Copying templates from other presentations
You can also copy design templates from
other presentations. This is helpful when
you want to copy from a preformatted
presentation (for example, with school
logo, matching color scheme, etc.) to your
existing presentation. To copy the design
from an existing presentation, do the
following:
•
Click File > New. Select Installed
Templates.
•
Select Pitchbook from the Installed
Templates list (figure below)
Installed Templates dialog box
•
Click Create
•
Save this presentation.
Now to copy the design from this
presentation to a new presentation, do
the following:
•
Create a new blank presentation
(CTRL+N).
•
Open the presentation created
using Pitchbook template.
•
To view both the presentations
sidebyside for easy reference, select
View Tab and select Arrange All under
Window group (figure below).
Presentations arranged sidebyside
•
Select the slide containing the
design that you want to copy. •
To copy this to the new
presentation, select Home tab and select
Format Painter. Notice the formatting is
ready for application. •
Now switch to the blank
presentation. Move your cursor over the
first slide in the slide list of the new
presentation and select the first slide by
clicking on it. Notice the design is applied
to this blank presentation (figure below).
Page 77 of 240
Design applied from another presentation
You can use the abovementioned
procedure to apply designs from other
presentations as well.
Customizing a template
Sometimes the builtin templates may not
suffice your design needs. In such cases,
you can customize a template and use it
for other presentations you create. To
customize an existing design template, do
the following:
Note: We will use the existing
presentation created using pitchbook
template.
•
Open the presentation created using pitchbook template.
•
To select a design, select Design tab. •
Select the Themes dropdown (figure below)
Themes Group, Design Tab
List of themes in Themes dropdown
•
Select a theme to be applied for
this design, for example, Trek. Notice the
theme applied to the whole presentation
(figure below).
Trek Theme applied to the presentation
•
You need to save this a template
for future use. To save this as a template,
select File > Save As… > Template.
•
Provide a file name for this
template. For example, DESIGN
TEMPLATE {YOURNAME]. (figure
below)
Page 78 of 240
Save As… dialog box
•
Click Save.
You can now use this customized design
template to create other presentations. To
use this customized design template, do
the following:
•
Create a new presentation by selecting File > New. •
Select My Templates… . New Slide dropdown menu
•
Now you can work with the
presentation and insert different slides
available in the New Slide dropdown
menu.
You can further customize the look and
feel of the template by modifying theme
color, theme font and theme effects by
clicking the respective dropdown arrow
available under Themes group in the
Design tab (figure below).
My Templates dialog box
•
Notice the customized design
template available in the list. Select
DESIGN TEMPLATE {YOURNAME},
click OK.
•
Select Home tab and then select
New Slide dropdown (figure below).
Notice the slides available based on the
customized design.
Colors, Fonts & Effects dropdown menus
in the Themes group
1.
To apply a theme color, click the
dropdown menu available under Colors
(figure above, left) and select by clicking
on an item available in the list.
2.
To apply a theme font, click the
dropdown menu available under Fonts
(figure above, middle) and select by
clicking on an item available in the list.
3.
To apply a theme effect, click the
dropdown menu available under Effects
(figure above, right) and select by clicking
Page 79 of 240
on an item available in the list.
Notice the changes in the presentation
after applying theme color, theme font
and theme effects. Session 2: Using the slide master
RELEVANT KNOWLEDGE
In the last session, you used inbuilt
templates found in presentation software.
However, you may wish to create your
own template so that certain features,
such as a predefined background, your
organization’s logo or company colors are
always present whenever the template is
opened. These templates are called
Master Slides.
There are four different Master Slides
1.
Slide Master – the master for all
slides in the presentation other than the
Title Master. •
Each presentation template comes
with a slide master. The slide master
controls the overall formatting and object
placement for the presentation Font
type, color and size, background color,
and certain special effects (e.g. text
shadowing). When you want to make a
global change to the appearance of your
slide you need not change each slide
individually, just make changes once on
the slide master and that changes other
slides automatically.
2.
Title Slide Master the master for
the Title page only.
•
When you open a new
presentation, the presentation software
assumes that you will begin your slide
show with a title slide. Adding a title and
subtitle to this slide layout is as easy as
clicking and entering text in the given
text boxes.
3.
Notes Master the master for
creating the Notes pages.
•
This feature of presentation
software enables adding notes to the slide
as you are constructing them. These notes
can be seen afterwards in normal views.
These notes might be some kind of special
points or notifications.
4.
Handout Master the master for
creating Handout pages.
•
These are thumbnails of slides
printed together on a sheet of paper.
These are often printed and sent for
review before the presentation is shown
to an audience. During the presentation,
these handouts can be distributed to the
audience.
When you launch a presentation, the
default design template or theme is a
plain, white slide. This is created from
the slide master. As already discussed, a
slide master is an element of the design
template that stores information about
the template, such as font styles,
placeholder sizes and positions,
background design, and color scheme
information. Slide masters also allow you
to insert common elements on every slide,
for example, a common footer, slide
number, copyright line, logo, or even
pictures. All slides in a presentation are
created using the fonts, colors and
graphics specified in the slide master.
Each new slide takes on these features.
This feature is very useful when you want
all slides in your presentation to use
similar fonts, formatting, colors, and
graphics. It saves time and the effort of
applying repetitive formatting. You can
customize an existing slide master and
create a template for your personal use.
Presentation software includes several
tools to control the look and functionality
of the slides. Page 80 of 240
Slide Master View allows you to control
the themes to make the presentation look
consistent across all the slides. Working with the slide master
Open a new presentation in the
presentation software. To work with Slide
Master view, do the following:
•
Select the View tab and click Slide
Master under Presentation Views group. Notice the Slide Master tab now available
in the Ribbon (figure below). You can
customize the styles, background and
layout for the entire presentation here.
Create a presentation template Now you will create a template with the following options:
1.
Open a new presentation and select View tab> Slide Master
2.
Apply a Theme – Technic
•
To do so, click Technic under
Themes dropdown in Edit Theme group
(fig. below) (hint: All themes are
alphabetically arranged; browse for the
relevant one).
3. Insert a placeholder for inserting
company logo or picture Title Slide.
(Placeholders help organize content in the
layouts. Content may be a clipart, or
picture, or text, or chart, or table, etc.)
Click Picture from Insert Placeholder
dropdown under Master Layout group.
Note the cursor turns to a crosshair (Plus
symbol). Now draw a square box on the
right top corner to place the logo. 1.
Apply borders to the placeholders
Tile and Content Layout slide.
•
Click the Tile and Content Layout
slide from the list (Hint: Move your
mouse over the slides available for
customization; Slide layout names will be
available for reference).
•
Doubleclick the Title placeholder,
select Intense Effect Dark 1 from Shape
Styles group under Format tab. Page 81 of 240
already selected!).
1.
Click Slide Master tab and click
Close Master View available in Close
group.
•
Now save this template. While
saving select the file type as template
from Save as type: dropdown list. Note: This template is saved under
Templates folder and is available under
My Templates section. Using the customized template
•
Now click File > New to create a
new presentation. Click My Templates.
Notice the template created earlier is
listed here. Select the template and click
OK.
•
Insert a Title Slide from the New
Slide dropdown menu in the Home tab.
Notice the placeholder for inserting the
logo or a picture available on this slide.
•
Insert a Tile and Content Layout
Slide from the New Slide dropdown
menu. Notice the Title Placeholder
displaying the custom border applied
earlier. This is due to the effect of Slide
Master customized earlier. Now you can
continue working with the presentation.
Preserving the Slide Master
To avoid any changes to the Slide Master
by mistake, you can preserve the slide
master template. To do so, •
Go to Slide Master View. •
Rightclick on the slide master
(first slide) and select Preserve master
(figure below).Alternatively, you can the
option Preserve from the Edit Master
group in the Slide Master tab (if it is not
Now create additional templates using
different styles, themes, colors, etc.
Using Multiple Design Themes
If you have noticed only a single design
theme can be applied to a presentation by
default. If you want to use multiple
design themes in a presentation, you need
to modify the slide master. In this
example, you will use both the Foundry
and Origin theme in a single
presentation. a)
Open a new presentation using the presentation software.
b)
Select Design tab.
c)
Select Theme dropdown and select Foundry theme from the list.
d)
Notice the Foundry theme applied to your presentation. e)
To add another theme, select the View tab and then select the Slide Master
(figure below).
Page 82 of 240
Slide Master View displaying slide
layouts with Foundry theme applied
a)
Scroll to the bottom of the Slides/
Outlines Pane (left side of the screen)
(figure below).
End of the Slide/Outlines Pane
a)
Now click below the last slide in
the list (you will notice the cursor
blinking)
b)
Now select the second theme to be
used in this presentation. From the
Themes dropdown, select Origin theme
(figure below).
Origin Theme from Themes dropdown list
a)
Once Origin theme is selected, a
new set of slides based on Origin theme is
inserted below the first set of slides
(figure below).
Slides based Origin Themes displayed under the first set
a)
Click Close Slide Master.
b)
You can now add slides either
based on Foundry or the Origin Theme.
To insert a slide, select Home tab, select
New Slide dropdown list (figure below).
New Slide displaying slides based on both
themes
a.
You can now select different slides
based on either Foundry or Origin
Theme. Page 83 of 240
Ribbon.
2.
Click on the option Header &
Footer available under Text group, as
shown below.
A Header and Footer dialog box appears
(shown below).
b.
You can save this as a template for
future use.
Use the procedure described above to add
more design themes to your presentation. Session 3: Creating headers & footers
RELEVANT KNOWLEDGE
You have learnt that you can use the
slide master to insert information
globally across slides. One such item,
usually required is headers and footers.
You have learnt to create headers and
footers in documents using word
processing software. You can also add
headers and footers to the slides using
presentation software. As you already
know, headers and footers help to:
•
Include important information
about the slides for the presenter (or
audience), such as the date the
presentation was created or delivered.
•
Brand the slides with your
company name.
•
Automatically place a slide number
on each slide.
Open a new presentation in presentation
software, to work with headers and
footers, 1.
Click on the Insert tab on the You can specify the Date and time, slide number and custom message here. Once complete, click either:
1.
Apply, to display the specified
details only in the current slide.
2.
Apply to All, to display the
specified details on all slides. Do the following in the Slide tab:
1.
Check Date and Time option under
Include on slide section.
2.
Click Apply to All. 3.
Now play the presentation; notice
the current date and time displayed at
the bottom of each slide. You can also customize the header and
footer of notes and handouts. Click on
Notes and Handouts tab in Header and
Footer dialog box (shown below). Page 84 of 240
As you can see this is quite similar to the
Slide tab. You can specify the Date and
time, slide number and a customized
message here. Once complete, select
Apply to All, to display the specified
details on all notes and handouts.
Do the following in the Notes and
Handouts tab:
1.
Check Footer textbox.
2.
Type your name in the textbox.
3.
Click Apply to All. 4.
Go to File > Print >Print Preview.
5.
Select handouts in the Print What: dropdown menu. 6.
Select the appropriate option and
notice the name displayed at the bottom.
Session 4: The Handout Master
RELEVANT KNOWLEDGE
Handouts are set of slides distributed as
hard copies to an audience during a
presentation. You can customize the
handouts using the handout Master in
the presentation software.
You use the handout master to customize
the layout, include or exclude header,
footer or page numbers of printed
handouts. To work with handout master, open an
existing presentation.
Click on the View tab on the Ribbon. Click on the option Handout Master in
the Presentations group, as shown below.
A window similar to the one below
appears.
In this example:
a)
To set 9 Slides per page, Select 9
Slides from Slides Per Page dropdown in
Page Setup group under Handout Master
Tab.
b)
Ensure Header, Date, Footer and
Page Number options are checked in
Placeholders group under Handout
Master tab.
c)
Once complete, click Close Master
View in Close group.
Handout elements are not visible on the
screen as they are meant for printing
purposes. To confirm the changes you
have made, print the handouts. Exporting
Handouts to a word processor.
Page 85 of 240
A handout is printed for circulating to the
audience. You can further customize your
handout and make it professional looking
by exporting it to a word processing
software from the presentation software.
Doing so, you can add additional text
such as a thank you note, contact details
for future communication or feedback,
etc.
To send the presentation to word
processing software, •
Click File > Publish. •
Select the option Create Handouts.
If you are using MS Office, a window
similar to the one below appears.
Select the option:
•
Paste: if you need the slide and
notes to be inserted in the word
processing document. •
Paste Link: if you need the word
document to be automatically updated
whenever you update the slides or the
handouts. •
Select the option Notes next to
slides, and select Paste Link. •
Click OK.
Note: Word processing software will
automatically insert a table with slide
and notes.
Now edit the content and notes in the
presentation. Switch to the document and
confirm the status of the contents. Are
they updated automatically?
Generally, presentations can increase in
size if it has many graphics inserted for
emphasis. When you are working on a
draft of a presentation and want an
approval or review before you create the
presentation, you can send only the
outline of a presentation. Session 5: The notes master
RELEVANT KNOWLEDGE
Note: You can customize the page layout
of slide and notes, as you want them to
appear in the document by selecting the
appropriate radio button in this window.
Notes master view is used for setting up
header, folder and layout of printed notes.
You can create notes pages with a
reduced image of your slide, and notes
that go along with the slide. The
formatting of the notes pages are
specified in the Notes Master. Remember
to add page numbers to your speaker
notes so that if you drop a stack of notes
pages, you can use the page numbers to
quickly sort them back into order!
To work with notes master, open an
Page 86 of 240
existing presentation that has sufficient
notes for practice.
1.
Click on the View tab on the Ribbon.
2.
Click on the option Notes Master in
the Presentations group, as shown below.
Note: Notes will not be visible in the
slideshow. To confirm if the changes are
applied, use print preview or print the
notes. To preview, select print preview
and select Notes Pages under Print What:
dropdown menu. A window similar to the one below
appears.
Session 6: Saving in Different Format
Similar to working with handout master
view, you can customize the orientation,
header, footer and slide position on the
page. Notes master has two placeholders
by default; one for the slide and one for
the notes. You can apply themes, theme
colors, theme fonts and theme effects by
using the Edit Theme group under Notes
Master tab. You can also insert pictures, cliparts,
shapes, SmartArt, etc. using the
Illustrations group under Insert Tab.
For example if you want to reduce the
size of the image taken by the slide when
printing notes and change the page
orientation, you can use the notes master
to:
•
Resize the Slide area to make it
smaller
•
Change Page Orientation to
Landscape by choosing Landscape in
Notes Page Orientation Group
RELEVANT KNOWLEDGE
You can save your presentation in a
variety of formats. Some situations where
this might come in handy are:
•
If you want to send your
presentation to someone but you do not
want them to use your design template,
you can save and send the presentation
as images. •
Select File > Save As…. Notice the
list of file formats displayed in the
dropdown such as PNG(Portable Network
Graphics Format), GIF, JPEG, etc. •
If you want to publish your
presentation as a web page on your LAN
or the Internet, you can save the
presentation as a webpage.
Save the presentation as images
To save your slides as images, do the
following:
•
Open a new presentation or an
Page 87 of 240
existing presentation
•
To save the files in PNG, select
PNG from the dropdown list. Click Save.
You will see a window similar to the one
below. •
You can select a single slide or all
the slides in the presentation. •
Select Current Slide Only if you
want to save only a selected slide
•
Select Every Slide if you want all
the slides in the presentation to be saved
as an image. When you have multiple
slides, each slide will be automatically
saved as a separate image. (figure below).
Folder contents with list of images of
slides
•
You can now send selective or all the images in the folder.
Save the presentation for publishing on a
web page
To publish the presentation as a web
page, do the following:
•
Open a new presentation or an
existing presentation
•
Select File > Save As….. Select the
type as Web Page.
•
Click the button Publish…(figure
below)
Save As…dialog box
A dialog box with publishing options
appears(figure below)
•
You can publish the entire
presentation or selective slides of a
presentation. •
To publish the entire presentation,
select Complete Presentation.
•
To publish selective slides, specify
the slide range in Slide Number value
box.
•
You can include or exclude speaker
notes from being published along with the
presentation. To publish speaker notes,
select the checkbox Display Speaker
notes.
•
In the text box File name:, enter
the location where you want the web
pages to be saved. Page 88 of 240
Select the checkbox Open
published web page in browser, if you
want to open the web page automatically
after publishing it. •
Click Publish. Notice the web page
displayed using your default browser
(figure below).
•
Web page displayed in web browser
Downloading and submitting templates
The presentation software has a limited
number of inbuilt templates. However,
you can download templates from several
websites either free or for a fee. For your
reference, here is a list of website from
where you can download templates:
1.
www.powerpointstyles.com 2.
www.presentationmagazine.com 3.
www.templatemonster.com 4.
www.slideshop.com 5.
www.graphicriver.net Note: In most cases, even paid websites
usually offer a limited numbers of free
templates for personal use. Check if the
website offers any free template that for
both personal and commercial use. You
can also publish use your own
presentation on the Internet either free or
for a fee. Check out the website for
procedures to submit or sell your
templates. Session 7: Assignment
RELEVANT KNOWLEDGE
Guidelines
Before you design and deliver a
presentation, use the following guidelines
that can help you make effective
presentations:
1.
Analyze the topic and the need for this presentation.
2.
Understand your audience.
3.
Estimate the number of hours
required for a presentation.
4.
Collect required resources (photos,
clip arts, audio / video clips, flash
animations, etc.) relevant to this
presentation.
5.
Prepare speaker notes & handouts.
6.
Use a rough sketch first to
estimate and then create the actual
presentation.
7.
Keep approximately 56 points per
slide with not more than 3040 words
8.
Keep only the keywords or key
points in the slides, not an entire
sentence unless it is of high importance.
9.
Use readable fonts such as Arial,
Tahoma, Verdana with size around 2430
Points & colors.
10.
Use appropriate images &
backgrounds or designs; don’t overcrowd
the slide with too many graphic or text
elements.
11.
Revise key points on each slide
once ready; replace keywords or points if
required.
12.
Rehearse the presentation at least
23 times to make sure you are
comfortable delivering it; use timings for
recording the time taken for each slide.
Adjust the content for delivery if
required.
13.
Anticipate questions based on the
Page 89 of 240
content and keep answers ready.
14.
Keep printouts of handouts ready.
15.
Include citations to indicate
sources of information if used (websites,
books, etc.). 16.
Include references for additional
reading through websites and books for
selected topic.
17.
Summarize the presentation
towards the end. Be ready to accept
questions from the audience.
18.
Include contact information at the
end of the presentation.
IT/ITES 306: EMAIL MESSAGING (ADVANCED)
SESSION 1: MODIFY MESSAGE
SETTINGS
Sometimes it is necessary to alert
recipients about the importance or
sensitivity of the information you are
sending as well as making sure that your
message has been received and read. At
the same time, as a recipient of email, it
is critical that senders know when you
will be able to respond to their email.
Moreover, when you email regularly to
the same group of people, there is a great
way to save time. In addition, you may want to insert
hyperlinks about resource in a mail you
send. In the following five sessions, you
will learn about all these features of
emailing software.
RELEVANT KNOWLEDGE
You have already learnt to work with
email messages using the email
messaging software. Email messaging
software allows us to modify various
settings such as setting importance,
confidentiality, set color category,
delivery options, etc.
Message settings alert the recipient of the
message about the importance and
sensitivity of a message. Both the
message importance and sensitivity are
indicated by an icon after the message
subject in the Inbox. Importance
Email messaging software allows you to
set priority for messages. For example,
since exam schedule is of high
importance, you can set the importance
level of exam related emails to high. If
you want to set high importance for a
mail message as a one time activity, do
the following:
•
Compose a new mail message.
•
Click red exclamation (!) under
Options group in Message tab. •
Send the email message to a
recipient.
Messages will be marked with red
exclamation (!) when viewed by the
recipients indicating that this message is
of high importance (figure below).
Page 90 of 240
Message when viewed in list
Email when opened. To set importance
level as high for all outgoing messages, do
the following:
1.
Select Tools > Options
2.
Select Email Options... under
Preferences tab
3.
Select Advanced Email
Options...in Email Options dialog box. 4.
Select High from Set importance:
dropdown list under When sending a
message section.
5.
Click OK thrice to save the settings
and move to the previous window.
6.
Now compose and send a mail to a
recipient.
7.
Notice the message received by the
recipient is marked with red exclamation
(!).
Note: By using the above specified
settings, all outgoing messages will be
marked as High, even messages that have
low priority. This can be very misleading.
Use high importance only for critical
email messages.
Sensitivity
When you send a mail that as sensitive
information, it may be accidentally
forwarded to another person or to a group
by the recipient. In such cases, you can
indicate the sensitivity of the message by
special markers such as normal (default),
private, personal or confidential. This
way the recipient can be made aware of
the sensitivity of the message. To mark a
message as Private, do the following:
1.
2.
Select Options tab. 3.
Click on the dropdown arrow in
More Options group. The Message
Options dialog box opens:
4.
Select Private under Sensitivity:
dropdown under Message settings (image
above). Click Close.
5.
Send this message to a recipient.
6.
The recipient will see a message
similar to the one below when the mail is
viewed. Note that this option is just an indicator
to the recipient, sent with a belief that
the recipient will be ethical and keep the
message private, not highlighting the
contents to others. However, the recipient
can choose whatever he/she wants to do
with such an email. Delivery Options
Delivery options include settings that:
a) Specify that replies be sent somewhere
other than to the sender of the message.
b) Delay delivery of the message until a
specified date or time. The message is
stored in the Outbox until it is delivered.
c) Have the message expire after a
Page 91 of 240
specified date or time. After the
expiration date, if the message has not
been opened yet, it is deleted. If the
message has been opened, it is crossed
out.
Setting Expiration
You can set expiry date and time for time
sensitive messages. For example if you
send an email to a large group
announcing a public gathering at a
specific date & time, you generally do not
expect participants to join the gathering
after the specified date and time and it is
useless if this message is viewed by the
recipients beyond the schedule. Hence,
you can set the mail to expire
automatically beyond a particular
schedule and mails will be marked with
the status as expired denoted by a
strikeout icon. For example, you need to compose a mail
to announce an Interschool competition
along with its schedule. To set the
message to expire beyond the schedule, do
the following:
1.
Create the appropriate mail.
2.
Select Options tab and click
dropdown arrow in More Options group.
A Message Options window appears.
3.
To set expiration, select the
checkbox next to Expires after under the
section Delivery Options and specify the
exact date and time as mentioned in the
schedule.
4.
recipient
The message is displayed with a
strikethrough (figure below), if viewed by
the recipient after the date and time has
elapsed, indicating that the message is no
longer valid.
Viewed in mailbox Message when opened
beyond schedule
Delay Delivery
If you want to send a message on a later
date, at a specific schedule, you can use
the delay delivery option. Delay delivery
is useful when you want to delay the
message delivery for example,
announcing a time sensitive activity such
as a contest or when waiting for a
confirmation from your supervisor about
an announcement. In such cases, you can
prepare the mail in advance but set it to
shoot off later.
To understand how to specify delayed
delivery, do the following:
1.
Compose a new mail message
announcing a painting contest – “Miracle
of Hands”.
2.
To delay the delivery, select
Options tab. Select the dropdown arrow
in More Options group. The Message
Options dialog box appears.
3.
To set the mail to be sent at a later
schedule, check Do not deliver before:
under Delivery options section and select
a data & time from dropdown list. For
this exercise, select the current date as
date and set the time 5 minutes from the
current time. Click Close. 4.
Now send this message to a
recipient. Notice this message will be
queued in Outbox and will be sent only at
the specified time. 5.
Now compose another message and
Page 92 of 240
send this immediately to a recipient. Note
the difference.
Notice the second message is delivered
immediately to the recipient; message
marked for delayed delivery will be sent
only at the specified time. Check with the
recipient if they have received the contest
mail after the delayed schedule. To delay the delivery for all messages, do
the following:
For example, to set the messaging
software to delay delivery of mails for all
messages by 60 minutes, do the following:
1.
Select Tools > Rules and Alerts.
Click New Rule… A dialog box appears.
2.
Select Check messages after
sending from the dialog box Step1: Select
a template.
3.
Click Next. A window similar to
the one below appears indicating that this
rule will be applied all messages. Click
Yes.
4.
Check defer delivery by a number
of minutes under Step 1: Select action(s). 5.
Select a number of from the dialog
box Step 2: Edit the rule description (click
an underlined value).
6.
A Deferred Delivery dialog box
appears. You can specify the delay in
minutes here. In this case enter the value
as 60. 7.
Click OK. Click Next twice and
Click Finish. Click OK. 8.
Now compose a new test mail
message and send it to a recipient.
9.
Notice the message is queued in
the outbox waiting to be sent 60 minutes
later. 10.
To confirm, select outbox. Double
click the queued message. Select Options
tab, select dropdown arrow in More
Options group. Notice the schedule set
automatically 60 minutes from now under
Do not deliver before: (data & time
values). Receiving a confirmation (Requires
Exchange environment and/or ISP
support)
Sometimes, when you send important
messages, you may need a confirmation
that the email message sent by you has
reached the recipient. Email messaging
software can track delivery of messages;
however, this is not a guarantee that the
recipient has read and understood the
message. If you want to specify the confirmation
settings as a onetime activity, do the
following:
•
Compose a new email message.
•
Apply the Request a Delivery
Receipt option available under Tracking
group in Options tab. •
recipient.
You will receive an email message either
with icon next to the mail message if it
is delivered to the recipient or with icon next to the mail message if it is not
delivered.
To receive delivery receipts for all
outgoing messages, do the following:
Page 93 of 240
•
Select Tools > Options.
•
Select Email Options...under
Preferences tab.
•
Select Tracking Options...under
Email Options dialog box.
•
Select Delivery receipt under the
section For all messages I Send, request:.
•
Click OK thrice to save the settings
and move back to the previous level. •
recipient.
Notice that you will receive delivery
receipts for all outgoing messages once
delivered to the recipient. Read Receipt
If want to receive a notification when the
recipient has viewed or read your mail,
you can use the Read Receipt feature. To
receive a notification for a single mail, do
the following:
•
Compose a new email message
•
Apply the Read Receipt option
available under Tracking group in
Options tab. •
recipient
When the recipient of your mail has
viewed the mail, he/she will see a dialog
box requesting permission for sending
notification to the sender of the mail.
If the recipient clicks Yes (a decision
made by the recipient), then you will
receive a mail that the message was read
by the recipient indicated by the next to the email (figure below). icon
If the recipient has clicks No, you will not
receive any notification. However, if the
message is deleted without begin viewed
or read, you will receive an email with
Message Deleted Without Being Read
notice indicated by icon next to your
mail message. To receive read receipt notification for all
messages, do the following:
1.
2.
Select Email Options...under
Preferences tab.
3.
Select Tracking Options...under
Email Options dialog box.
4.
Select Read receipt under the
section For all messages I Send, request:.
5.
Click OK thrice to save settings
and move to the previous level. 6.
recipient.
Notice that you will receive red receipts
for all outgoing messages if the recipient
chooses to click Yes. Note to instructor: Disable the rule
before moving to next section as this rule
will delay all other activities in this
session. To disable, select Rules and
Alerts, uncheck this rule and Click OK. Flag Messages
Imagine yourself in a role in which you
interact with many people through mails
everyday; it would be extremely difficult
when you want to track multiple
activities. You may forget to respond to a
vendor, sign a contract or followup with
Page 94 of 240
someone for an important decision.
Flagging email messages can help you to
manage emails much effectively. For
example if you want to set a remainder
for yourself, do the following:
1.
Select a mail message from the list
2.
Select Actions > Follow Up >
Custom…
3.
In the custom dialog box (figure
below) under Flag for Me:, select Reply
from Flag To: dropdown list. 4.
To set an alarm, check Reminder:
and select a date and time from dropdown
values.
If you want to send a message to someone
and you need a reminder for yourself for
following up, do the following:
•
•
Select Follow Up dropdown arrow
under Options group. Select Custom. •
Check Reminder: , select a date
and time convenient to you for a follow
up. •
Click OK.
•
Send the message to a recipient.
•
Select Go > Tasks to view the
ToDo list. Notice the reminder set in the
list.
Sometimes you may delegate a task to
your colleague and expect a response. If
your colleague forgets about the delegated
task, you may not receive the response on
time. To avoid this, you can flag the
message you wanted your colleague to
respond. To set a reminder for a task
delegated to your college, do the
following:
•
•
Select Follow Up dropdown and
select Flag for Recipients…
5.
Click OK
Reminders are stored in the email
messaging software as ToDo’s lists. To
view list of ToDo’s, select Go > Tasks.
Notice the follow up listed under ToDo
list flagged along with reminder (Left)
and action to perform (Right).
•
Flag for Recipients section, select
Page 95 of 240
Reply from Flag To: dropdown list, select
data and time under Reminder:
dropdown. •
Click OK.
•
Send the message to a recipient.
Note: Following screen will be available
only on the recipient’s email messaging
software. Mail message flagged using this
procedure is displayed to the recipient
similar to the one below:
Flag icon on a mail message. Notice the flag icon next to the mail
message (Left) and text above Sent:
(Right).
Now the recipient can add this flagged
reminder to their calendar by:
•
Rightclick on the flag icon •
Select Add Reminder… (figure
below)
•
Click OK in the Custom dialog box.
Now the reminder is added to the ToDo
list in Recipient’s email messaging
software. To view the to do list , select Go
> Tasks.
Flag on a mail message
Notice the flagged reminder (left) and
text (Right).
Since the reminder is added to the
recipient’s calendar, alerts may popup
depending on how the recipient’s
messaging software is configured.
Recipient can send a reply to the sender
to indicate the completion of task.
Voting
Imagine a situation where you want to
finalize a decision based on votes from a
group of audience. Usually a meeting is
conducted or groups are collected for
voting. This requires lot of time spent by
each voter. To save time and money,
electronic votes are used, especially if a
large group (possibly located in different
geographical locations) is being
addressed. For example, to conduct a survey across
your school to have special computer lab
classes over a weekend, do the following:
•
explaining the details of this survey.
•
To insert voting buttons, do the
following:
•
Select Options tab •
Select dropdown arrow in More
Options group. The Message Options
dialog box appears.
•
Select Yes; No from Use Voting
buttons: dropdown list in Voting and
Tracking options section (image below).
For now, select Yes; No from the list. •
Click Close
•
Send the message to a recipient or
group of recipients.
Recipients will receive your mail just like
any other mail, except that in addition
they can choose Yes or No from a menu
similar to the one below. Message viewed
in inbox (figure left) and when opened
Page 96 of 240
(figure right)
responses by viewing the number of votes
instead of checking mails one by one. To
view the response, click on the title area
above From:, and click View voting
responses.
A window similar to the one below
appears with a list of results.
Recipients can respond either by choosing
Yes or No from the dropdown depending
on their decision with or without
additional comments. When recipients
click Yes (or No), a window similar to the
one below appears:
•
If Send the response now is
selected, the decision is sent immediately
•
If Edit the response before sending
is selected, messaging software allows
you to add comments before sending the
vote. •
Click OK.
Once recipients have made their votes,
the sender will receive the results with
the voting decision in the Subject line
(figure below).
If you have received large number of
responses, it is easier to track the
Note: Not all recipients vote. Responses
from recipients who voted will be
displayed in the result. You can
consolidate the results from the recipients
to make the decision based on votes. You
can customize the voting dropdown by
specifying values separated by semicolons
in Use Voting buttons: dropdown list.
Examples:
•
Recommend; Don’t Recommend
•
Monday; Wednesday; Friday
Categories
You have learnt to create color categories
for appointments using Calendar. Now,
you will learn about a similar concept
with mail messages. When you have large number of mails in
your inbox, it may be difficult to locate
specific messages. You can color code and
categorize messages that are easier to
locate. For example, Blue color can be
mapped to messages from vendors, Red
for mails from supervisor, Green for mails
Page 97 of 240
from colleagues, etc. For example to apply a color, do the
following:
1.
Double click on a message
2.
Select Categorize dropdown menu from Options group
3.
Select Blue Category from the
dropdown list. A Rename Category dialog
box appears (figure below).
•
Type a name, for example Office
and click OK.
8.
To add a new color and a category:
• Click New…
• Type a new in the Name: text box
• Choose a color from Color: dropdown
and a shortcut from Shortcut Key:
dropdown. • Click OK. Now you can assign this category
whenever you receive mails from clients. SESSION 2: CHANGE THE MESSAGE
FROMAT
RELEVANT KNOWLEDGE
4.
Type Vendor in the Name: text box
and click Yes.
5.
From now on, you can mark the
messages vendor that will be easier to
locate. You can modify the existing color
categories or create your own categories
by doing the following:
6.
Select Actions > Categorize > All
Categories…
7.
•
•
To rename an existing category:
Select {color name} Category Click Rename. Why have different formats?
You have already learnt how to compose
email messages. When sending emails,
you need to consider if the recipients have
necessary support to view the email as
intended. When a recipient views your
mail using a email software different
from yours, the message may appear
distorted or garbled making it difficult to
read. In such cases, you need to send the
message in a format that is acceptable to
the recipient’s email software. Email messaging software supports a
variety of formats to address these kinds
of issues. For example if a recipient
reports that their email software can
accept text formats without any
problems, it is advisable to change the
format at your end before sending the
mails. Page 98 of 240
Modify email format
To modify message formats, do the
following:
1.
Open the email messaging
software.
2.
Go to Tools > Options. A Options
dialog box appears.
3.
Select Mail Format tab. Notice the
list available under Compose in this
message format dropdown list in the
section Message format.
Email messaging software supports the
following formats:
1.
HTML – This is the default
message format in email messaging
software. This format allows the user to
add formatted text, images, and
hyperlinks in the message. Message
composed using this format look like
document. 2.
Plain Text – This format of email
message enables the user to add only text
contents without any images or text
formatting such as bold, italic, colors, etc.
This format is supported by all email
messaging software. You can use this
when you need maximum compatibility. 3.
Rich Text – This format enables
the user to add formatted text content.
The email messaging software
automatically converts the RTF format to
HTML while sending over the Internet.
Note: In most cases, you can leave the
default setting as it is. Change the
message format settings only if the
recipient is having issues viewing your
mails.
Using Plain Text Format
Plain text format is a simple text format
that has widest compatibility compared to
other formats. Since plain text format is
pure text, mails composed using this
format are smaller and move faster
compared to other formats. If you want to send a plain text message
as a onetime activity, you can change the
message format at the time of composing
an email by doing the following:
•
Select File > New > Mail Message.
•
Select the Options tab.
•
Select Plain Text under Format
group.
•
Now compose a test message.
Notice that options such as bullets,
paragraph options are greyed out as you
cannot use advanced text formatting
when using plain text format.
•
Send the mail to a recipient and
observe the format received by the
recipient. If you want to set your email messaging
software to use only Plain text format for
all outgoing messages, do the following:
1. Select Tools > Options.
2. Select the Mail Format tab.
3. Select Plain text from the Compose in
this message format: dropdown list (in
the Message format section).
Page 99 of 240
4. Click on Apply.
5. Click OK.
Now select File > New > Mail Message.
Notice the default mail format is in plain
text (Plain Text option is selected in the
Options tab). Using HTML Format
HTML format is similar to that of a
webpage containing text and graphics
formatted in a specific way. Messages
composed using this format appear as it
would appear in a web browser. HTML
mails are used in scenarios that require
attractive messages such as a newsletter
or marketing emails. However, since
HTML mails contain graphics, colors,
tables, URLs, etc, they take up more mail
space making the email bulkier and it’s
movement is slower compared to other
formats. Most email software includes support for
HTML format through a GUI editor for
composing mails and a rendering engine
for displaying HTML mails. If you want to send a HTML Mail
message as a onetime activity, you can
change the message format at the time of
composing an email by:
•
Select File > New > Mail Message.
•
Select Options tab.
•
Select HTML under Format group.
•
Now compose a test message;
notice options such as bullets, paragraph
options are available as you can use
advanced text formatting in the HTML
format. •
Now send the mail to a classmate
and observe the format received by the
recipient. If you want to set your email messaging
software to use only HTML format for all
outgoing messages, do the following:
•
•
Select Mail Format tab.
•
Select HTML from the Compose in
this message format: dropdown list (in
the Message format section).
•
Click Apply.
•
Click OK.
•
Now select File > New > Mail
Message. Notice the default mail format
is in HTML (HTML option is selected in
Options tab). Rich Text Format
Rich Text format is a proprietary format
developed by Microsoft. RTF is
recommended when you use Microsoft
Exchange, a mail server from Microsoft.
However, Outlook automatically converts
email messages composed using rich text
format to HTML format when it is sent to
an Internet recipient such as Gmail or
Yahoo! Mail. Note: It is recommend to use HTML
format if you send and/or receive mails
from recipients using a variety of mail
servers/clients to avoid any compatibility
issues. If you want to send a mail message using
rich text format as a onetime activity,
follow the same steps as learnt for HTML
and then select Rich text under Format
group Now when you compose a test message;
the options such as bullets, paragraph
options will be available .
Send the mail to a recipient and observe
the format received by the recipient. Similarly, you can set your email
messaging software to use only rich text
format for all outgoing messages
Page 100 of 240
SESSION 3: OUT OF THE OFFICE
NOTIFICATION
RELEVANT KNOWLEDGE
Understanding Out Of Office notification
Out Of Office feature of messaging
software (referred to as OOO),
automatically sends a standard reply to
your incoming messages while you are
out of the office, on leave/vacation or
having limited access to mails. Configuring an Out of Office notification
To configure the out of office notification,
as a first step, you need to create a
template that will be used when
automatically responding to received
mail. Do the following:
1.
Start the email messaging
software.
2.
Go to File > New > Mail Message,
and compose a message similar to the one
below.
and click Save. If you are using MSoffice,
the option would be Outlook Template.
5.
You need to formulate a rule so
that whenever you receive a mail, the
message in the template is sent as a reply
to the sender. To setup the rule, select
Tools dropdown menu. 6.
Click Rules and Alerts…. A Rules
and Alerts dialog box appears similar to
the one below.
7.
Click New Rule…. A Rules Wizard
dialog box appears (figure below).
3.
Now, save this as a template. Click
File> Save As. A dialog box appears as
shown below.
4.
Specify a name, select the relevant
option from Save as type dropdown menu
8.
Select Check messages when they
Page 101 of 240
arrive under Start from a blank rule and
click Next. 9.
In the next step, you need to
specify to the conditions that need to be
checked. 10.
Select the sent only to me option
available under Step 1: Select condition(s)
and click Next. 11.
In the next step, you need specify
what you want to do with the message.
Here, select reply using a specific
template option available under Step 1:
Select action(s).
12.
Now, you need to specify the
template to be used. Under Step 2: Edit
the rule description (click an underlined
value), click a specific template. A Select
a Reply Template dialog box appears
(figure below).
13.
Select the template (use Look in:
dropdown menu to locate the template)
and click Open. 14.
Click Next. The Rules Wizard
dialog box appears wherein you can
specify any exceptions to the rule you
have just created. (figure below). Page 102 of 240
15.
For now, click Next. Click Finish
on the next window. Finally, click OK.
16.
From now on, the message
specified in the template will be sent
automatically whenever you receive a
mail. You can also set up rules to forward mails
from a specific client to a colleague who is
handing issues in your absence or to
forward messages on a critical project to
your manager.
Page 103 of 240
SESSION4: CREATE DISTRIBUTION
LIST or CONTACT GROUP
RELEVANT KNOWLEDGE
Understanding distribution lists
A distribution list refers to a collection of
contacts or a contact group enabling you
to quickly address and send messages to a
group of recipients. For example, if you
want to send the exam schedule for 11th
grade students, you can create a group
that has all the members of the 11th
grade students and then send the
schedule to that particular group. This
helps in saving time and avoids leaving
out anyone by mistake from the list. Distribution lists are stored in the
contacts folder, where you can identify
them by the distribution list symbol.
Creating a distribution list
You need to create a distribution list
before you can work with it. To create a
distribution list, do the following:
•
software.
•
Go to File > New > Distribution
List. A window, similar to the one below
appears.
•
Specify a name for the distribution
list, for example my classmates in the
Name: textbox. •
You need to add contacts to this
distribution list. To add contacts, do the
following:
•
Click Select Members option
available under Members group. A dialog
box appears with the list of contacts from
your address book. Select the contacts
that you would like to add to this
distribution list.
•
After selecting contacts, click
Members > and click OK. Now, the
Distribution List window appears with
the list of selected contacts.
•
Click on Save & Close option
available under Actions. Now a
distribution list is created. Using the distribution list
To use the distribution list, do the
following:
1.
Compose a message.
2.
Click To…, and the Select Names
Contacts dialog box with the list of
contacts and distribution list appears
(shown below). Notice the icons for
Page 104 of 240
contacts and distribution lists.
To print a distribution list, do the
following:
•
Click Contacts.
•
Open the distribution list you want
to print.
•
Select File>Print.
SESSION 5: INSERT A HYPERLINK
3.
Select the distribution list from the
dialog box and click OK. 4.
Click Send. The mail is sent to all
the contacts included in the distribution
list. Modify a distribution list
If you add/remove a name in the
distribution list temporarily, •
Click on the plus sign icon
preceding the list name in the To... text
box.
•
In the Expand List message box,
click OK to replace the distribution list
with its members.
•
Add or delete the user name(s)
from the To… text box.
To modify a list permanently, double click
the list you want to modify. Edit the list,
Save and Close to update the list.
Print a distribution list
RELEVANT KNOWLEDGE
You have already learnt about hyperlinks
that are widely used in the Internet. A
hyperlink is an object, text or a graphic
that links to another web page, email
address, network etc. Email messaging
software includes a facility for sending
hyperlinks to recipients. This is very
useful when you need to send reference
links to others via email. By clicking the
hyperlink in an email, you can quickly get
to the resource.
To begin with, open emailmessaging
software. If you want to include links to
website in a mail message, do the
following:
•
•
Type the website URL in the body
text area. For example, if you want to
include a hyperlink to Wikipedia, type
www.wikipedia.org
or
http://www.wikipedia.org and press
Enter. Notice the URL is automatically
converted into a hyperlink.
•
Send the message to a contact. To insert a hyperlink manually, do the
following:
•
•
To insert a hyperlink, click the
Hyperlink option available under the
Links group in the Insert tab (shown
below).
Page 105 of 240
•
A dialog box for inserting a
hyperlink appears (shown below).
•
Type the website URL in the
Address: text box.For example,
www.google.com and click OK.
•
Now send the message to a contact.
Inserting lengthy website hyperlinks can
look odd or difficult to read. For example:
http://en.wikipedia.org/wiki/Etiquette_
%28technology%29. You can insert text to
include lengthier hyperlink. To set
hyperlinks through text, do the following:
•
•
Type Etiquette in the message
body. Select the text Etiquette, select
Hyperlink from Links group. •
Type the complete website URL,
for
example:
http://en.wikipedia.org/wiki/Etiquette_
%28technology%29 and click OK. Notice
the text is hyperlinked to the lengthy
URL.
•
Send this message to a contact.
When the contact receives the mail and
moves the mouse over the hyperlinked
text, the entire link is visible. By clicking
the link, the website can be accessed.
If you want to send a list of hyperlinks in
an email for example a list of job websites
and important email address, do the
following:
1.
2.
Type the list of website URL using
the procedure mentioned in this session.
3.
You can include the mail address
in one of the two methods:
a)
Type the email address and Press
Enter. For example: someone@web
site.com. b)
Include simple text content and
link that to an email address. For
example type job1, select the text. Select
Hyperlink in Links group under Insert
tab. Type the mail address as mailto:
someone@web site.com and click OK. 4. Send the mail to a contact.
The person you sent the mail to will
receive the websites and email addresses
as hyperlinks (embedded in the mail),
which when clicked upon, will open with
web browsers and email clients.
SESSION 6: SORT & FILTER
MESSAGES USING MULTIPLE
CRITERIA
As messages accumulate, in your mailbox
it becomes important to organize and find
messages as quickly as you can. In
addition, you would want to filter out
unnecessary mails (advertisements etc.)
rightly called Junk. The next two sessions
guide you through these options in a
email messaging software.
RELEVANT KNOWLEDGE
You have already learnt to create, send,
receive and open email messages. Over
time, searching for a particular email
messages could prove to be difficult as
your mailbox might have innumerable
mails. To help you out of this issue,
emailmessaging software has features to
sort and filter messages using single or
multiple criteria. For example, if you
want to locate a mail that has a large
Page 106 of 240
attachment, you can sort mails by size
and locate the specific mail from the
sorted list. Sorting Messages
By default, messages are listed based on
timestamp, with most recent mails at the
top. You can change the arrangement to
suit your needs. Single criteria
To sort mail messages based on size
(single criteria), do the following:
•
Click View > Current View.
•
Select Customize Current View. A
Customize View: Messages dialog box
appears. Notice the default value under
Sort… is specified as Received
(descending).
•
Click Sort.. A Sort dialog box
appears.
•
Select Size from the Sort Items by
dropdown menu (figure below)
•
Click Ok and move to the previous
dialog box. Click Ok here too.
Notice the email messages are now sorted
by Size, with the mail with the biggest
attachment, irrespective of when it was
received, being at the top.
Using multiple criteria
In the previous case, a mail, received long
ago with a huge attachment, could appear
at the top. It just might be that what you
wanted was a mail, recently sent but with
a huge attachment. In such a case, you
need to specify multiple criteria.
So, to sort emails first by date received
and then by size, do the following:
•
Click View > Current View and
select Customize Current View.
•
Select Size from Sort Items by
dropdown menu as the first criteria
(figure below).
•
Click Ok and move to the previous
dialog box. Click Ok here too. Notice now
the mails are sorted based on most recent
timestamp and size.
Page 107 of 240
Filtering mail messages
Mailboxes can be flooded within a short
span of time. Messages from friends,
colleges, subscriptions, etc. need to proper
management to avoid issues locating
important mails. However, an alternative
is to use the filtering feature available in
mail messaging software to locate mails.
To filter mails, do the following:
•
Click View > Current View and
select Customize Current View.
•
Click the Filter button (which is set
to Off by default) from the Customize
View: Messages. A Filter dialog box
appears similar to the one below:
the keyword. Since both subject field and
email content are scanned, you may see
more number of mails in the search
results than in the previous search.
•
If you remember the email address
of the person, you can specify the email
address in the From: text box and
perform the search. Note that if you are using a keyword
during this search, messaging software
will look for a combination (multiple
criteria) of the specific keyword sent from
particular email address and you may
notice a very limited number of mails as
the search output. You can filter messages using the options
in Filter dialog box i.e. recipients mail
address, time sent, time received,
expiration status, unread status, with or
without attachments, flagged, size, etc.
You can combine more than one criteria
from this list to filter messages further. SESSION 7: MANAGE JUNK EMAIL
•
To filter using a keyword (only
subject field), type the keyword in Search
for the word(s): text box. Click OK twice
to save and move to the previous dialog
box.
•
Notice the search results match the
keyword in the subject area of the mails.
Since this searches only the subject field,
you may see limited mails in your search
results. •
To filter using a keyword (subject
field and content), select subject field and
message body from In: dropdown list.
Click OK twice to save and move to the
previous dialog box.
•
Notice the list of mails matching
RELEVANT KNOWLEDGE
Junk mails, also known as Spam are the
unwanted mails you receive (sometimes
unintentionally sent to you). You can
configure the email messaging software to
filter junk mails and keep your mailbox
cleaner. Some junk mails anchor viruses
that could potentially harm a computer,
remove data, send personal information
from the computer to unknown recipients,
etc. and are considered extremely
dangerous.
Email messaging software include spam
filters that can block mails that have
potentially dangerous content such as
scripts or viruses. Email messaging software protects by
maintaining the following lists: Page 108 of 240
1.
Blocked senders: Email address
specified in this list are automatically
blocked; you can specify:
•
An individual mail address such as
[email protected]. This will block
mails from only that particular email
address.
•
A domain name such as
example.com. This will block mails from
any mail address that belongs to this
domain. 2.
Safe senders are email addresses of
individuals and domain that you always
receive mails from. 3.
Safe recipients are email addresses
that you don’t like to block such as a
subscription.
Email messages in Safe senders and safe
recipients list are never sent to the Junk
Email folder unless blocked by the ISP or
settings based on a mail server. Email
messaging software includes four junk
filters that are capable of filtering junk
emails (however, it needs to be setup
accordingly). These junk filters are:
1.
Safe Senders
2.
Safe Recipients
3.
Blocked Senders
4.
International
Managing junk mail
To manage junk email, open the email
messaging software and do the following:
•
Go to Tools > Options…, an
Options dialog box appears. •
Click on Junk Email… button. A
Junk Email Options dialog box appears
wherein you can configure Junk Emails.
Notice the tabs in this dialog box. By
default, the Options tab is selected and
level of junk email protection specified
here is selfexplanatory.
1.
To block senders, click on Block
Senders tab, a window similar to the one
below appears.
Page 109 of 240
•
To block receiving mails from a
particular address, click Add and type the
email addresses. For example,
[email protected]. •
To block receiving mails from a
particular domain name (note: all mail
address from that particular domain will
be blocked), click Add and type the
domain name. for example, example.com.
•
If you want to block a list of email
addresses and/or domain names, first
create the list in a text file. Then
•
Click Import from File, and choose
the text file that has the list.
•
Click Open and then click OK. 1.
To receive emails from email
addresses or domains from known and/or
trusted sources, you can specify them in a
safe senders list. To add entries, click on
Safe Senders tab, a window similar to the
one below appears.
•
The procedure to receive mails
from a particular address, or a particular
domain name or a list of email addresses
and/or domain names, is the same as the
procedure to block senders.
Notice that the default setting Also trust
email from my contacts is checked;
indicating that mails received from your
contacts are always on the safe list. 2.
To receive mails from mailing lists
or newsletters you have subscribed to,
you can add those addresses in the Safe
Recipients list. To add entries, do the
following:
•
Click on Safe Recipients tab, a
window similar to the one below appears.
•
The procedure to receive mails
from a particular address, or a particular
domain name or a list of email addresses
and/or domain names, is the same as the
procedure to block senders.
Page 110 of 240
3.
You use the International tab to
block email messages based on TLD
(TopLevel Domains). Some examples of
Toplevel domains are: .ca, .us, etc. To
block mails using Toplevel domains, do
the following:
•
You use the International tab to
block email messages based on TLD
(TopLevel Domains). Some examples of
Toplevel domains are: .ca, .us, etc. To
block mails using Toplevel domains, do
the following:
•
Click International Tab. (figure
below).
•
Click the button Blocked TopLevel
Domain List… The Block TopLevel
Domain List dialog box appears (figure
below) •
Select from the list the countries/
regions you want to block and click OK. •
Click Ok again.
You have successfully configured your
junk mail box!
Filter Modes
Email messaging software provides four
filter modes :
•
No Automatic Filtering
•
Low •
High
•
Safe Lists Only Note: It is recommended to keep the
default settings. However, if you want a
tighter messaging security, you can select
the Safe Lists Only option (Options tab).
By doing so, every mail other than the
one sent from the Safe Senders and
Recipients list will be considered as a
junk email. You will need to check the
junk folder manually. Junk filters need to be updated
periodically with most recent definitions
to protect new variants of junk mails. You
can download Junk filter updates from
downloads section of the mail messaging
software vendor’s website. SESSION 8: SET WORKDAYS AND
TIME IN A CALENDAR
Lesson Objectives:
Suppose your normal workday hours need
to change due to the needs of a new
project, or you have to coordinate
appointment times with someone across
Page 111 of 240
the country or the globe (different time
zones) and need to indicate your
availability. At the same time, you may
need to create a calendar group to send
mails to. How would you manage all these
activities? Additionally, you receive so
many meeting requests, can you configure
the system to automatically respond to
them? Email messaging software provides tools
and options for you as a solution to all
these issues. In the next five sessions, you
will learn about all these tools and
options.
RELEVANT KNOWLEDGE
You have learnt how to work with
calendar using email messaging software.
The default workdays and work time are
set in the email messaging software. You
can configure the workdays and time
according to your preferred schedule. Typically, workdays start on a Monday
ending Friday. However, in some
countries and even in some jobs,
workdays could be different. To modify
workdays and time in a calendar, open
the email messaging software and do the
following:
1.
Go to Tools > Options…, an
Options dialog box similar to the one
below appears. 2.
Click on the button Calendar
Options…. A dialog box with calendar
settings appears as shown below. 3.
Check/select the relevant
workweek days and change the Start time
and End time.
To view the changes, •
Click Go > Calendar. •
Select View > Work Week. Notice
the start work day and end work day
along with start time and end time
displayed in the calendar (figure below).
SESSION 9: DISPLAY
ADDITIONAL TIME ZONE
AN
RELEVANT KNOWLEDGE
Places around the world have different
time zones and calendar software is set to
match the current geographic schedule.
Calendar software include option for
adding additional time zones; this could
be beneficial to work if you are working
with colleagues from different time zone. Page 112 of 240
By default, email messaging software
displays the local time in your calendar. To add an additional time zone, do the
following:
1.
software.
2.
Go to Tools > Options…. The
Options dialog box appears. 3.
Click on Calendar Options…..A
Calendar Options dialog box appears as
shown below.
In this example, do the following 1.
Type India in the Label under
Current Windows Time zone Group
2.
Check Show an additional Time
Zone under Additional Time Zone Group
3.
Type Singapore in the Label under
Additional Time Zone Group
4.
Select (GMT+08:00) Kuala
Lumpur, Singapore from Time Zone
dropdown under Additional Time Zone
Group
5.
Click Ok to move back and save the
changes made.
6.
Now when you click the Calendar
View, you will see both India and
Singapore time zones. (figure below).
4.
Click Time Zone. Another dialog
box similar to the one below appears.
Calendar displaying multiple time zones
Now change different time zones in the
calendar software and observe the
changes in the calendar view. Page 113 of 240
SESSION 10: SET AVAILABILITY
OPTIONS
RELEVANT KNOWLEDGE
You have already learnt to share your
calendar through email. When you
schedule activities and share, the persons
who you have shared with on viewing
your calendar can see your availability as
either busy or a blank. Informing others
about your availability assists them in
fixing a meeting or requesting an
appointment with you. You can indicate
your availability by using the builtin
indicators of the calendar software. Specifying your availability
Before you share your calendar, use the
inbuilt indicators of the messaging
software to schedule tasks or meetings.
To use the indicators, do the following:
1.
Open your calendar software
2.
Select Go > Calendar
3.
Schedule appointments based on
the following guidelines:
a. Schedule 1
i.
Subject: Team Meeting
ii.
Timing – 10 AM to 11 AM
iii.
Reoccurrence: Monday to Friday
(10 occurrences)
b. Schedule 2
i. Subject: Vendor Meeting
ii. Timing – 2 PM – 3 PM
iii. Reoccurrence: Monday to Friday (10
occurrences)
To mark the entire appointment as
tentative, select Tentative from Show As
dropdown in Options group
(figure below)
Options group
a. Schedule 3
i.
Subject: Free
ii.
Timing – 3 PM – 5 PM
iii.
Reoccurrence: Monday to Friday (10 occurrences)
i.
Mark the entire appointment as
Free. Select Free from Show As dropdown
in Options Group. Notice the entries in
your calendar (weekly view).
Calendar, Weekly View
Sharing your calendar
To let others know your schedule and
availability, you need to share your
calendar. You can share your calendar by
publishing to a web server, ftp server or
to a computer in your local network. Note: Setting up Web Server or FTP
server require additional technical
expertise. Only the procedure for sharing
a calendar on LAN is included in this
session. Sharing on LAN
To share your calendar using another
computer in your local network, do the
following:
•
Set up a shared folder on another
computer that will be used for storing this
Page 114 of 240
calendar.
•
Create a New Folder. For example,
C:\CALSHARE
•
Rightclick CALSHARE, select
Properties
•
Select Sharing tab
•
Select Advanced Sharing…
•
Check Share this folder
•
Select Permissions
•
Select Full Control under
Permissions for Everyone
•
Click Apply, click OK twice and the
click Close.
•
From another computer, confirm if
you have read and write access to the
shared folder by doing the following:
◦
Click Start
◦
Click Run
◦
Type
\\COMPUTERNAME\SHARENAME.
For example, if the computer name is
DESKTOPONE and the share name is
CALSHARE,
type
\\DESKTOPONE\CALSHARE. To configure your calendar software to
store the calendar in a shared folder, do
the following:
•
Select Tools > Options
•
Select Calendar Options (figure
below)
•
Click the button Free/Busy
Options…. the shared folder using the specific
format
File://\\COMPUTERNAME\SHARENA
ME\%name%.vfb. (For example, if your
shared folder is located on a computer
named “SERVER” and the shared folder
is given the share name as “CALSHARE”,
enter
File://\\SERVER\CALSHARE\
%name%.vfb. Note the %name% is a
variable and will automatically create the
required filename based on the email
account name. If the email account is
[email protected], then the filename
will be user01.vfb.)
Your calendar will be published
periodically every 15 minutes by default.
If you want to force the update, select
Tools > Send/Receive > Free/Busy
Information. Viewing calendar published by
others
To view calendars published by others,
add their contact to your address book
and then do the following:
•
Doubleclick on the contact.
•
Select Details in Show group under
Contact tab. (figure below)
Specify the location under Address
Text box in Internet FreeBusy section.
For example to include the calendar
shared by someone@ example.com, type
the location using the following format,
•
Free/Busy Options
•
You need to specify the location of
Page 115 of 240
File://COMP UT
ERNAME/SHARENAME/someone.vfb.
For example, File://SERVER/
CALSH
ARE/ user01.vfb
.
•
Select Save & Close.
To view the schedule or availability of the
contact, do the following:
•
Schedule an appointment in the
calendar
•
Select Scheduling under Show
group
•
Select Add Others dropdown and
select Add from Address Book…. Select
the recipient’s email address and click
OK. A window similar to the one below
appears. You can view their availability
and schedule a meeting accordingly.
take few minutes. SESSION 11: CREATE CALENDAR
GROUPS
RELEVANT KNOWLEDGE
You have learnt to work with calendar
and make appointments using it. Calendar groups are useful in scenarios
when two or more individuals work
together and need to schedule meetings
in sync with each other. To schedule a meeting you need to select
the list of recipients to be invited for the
meeting. Do the following:
•
Open your calendar software.
•
Select Actions > View Group
Schedules…. The Group Schedules dialog
box appears (figure below).
•
Click the button New…
•
Type a name, for example, GS1.
Click OK. A window appears similar to
the one below.
•
You need to add list of participants.
Select Add Others dropdown and select
Add from Address Book…(figure below).
Note: Fetching the calendar details of
another user from a shared folder may
Page 116 of 240
•
The Address book appears with list
of contacts. Select the recipient, Click
To>. Add more recipients and when
done, click OK. •
Once all the recipients are added,
select Make Meeting dropdown and select
New Meeting with All… •
The Meeting dialog box appears
similar to the one below. •
Type Team Building in the Subject:
and 1st Floor in the Location:. Select a
date from the Start time: and End time:
dropdown with a schedule between 10
AM to 1 PM. Once complete, send the
invitation by clicking Send. •
Click Save and Close.
Notice the meeting scheduled is displayed
in your calendar. Recipients when they open their mail will
receive an invitation similar to the one
below.
Page 117 of 240
If they select Accept, you will receive a
mail that the recipient has accepted your
invitation. SESSION 12: MANAGE AUTOMATIC
MEETING RESPONSES
RELEVANT KNOWLEDGE
You have learnt to set up meeting
requests in the earlier sessions. You can
configure the email messaging software to
respond to meeting requests
automatically. Using automated meeting responses
could be useful in situations when you
want to accept meeting requests from
your team members or colleagues. To automate meeting responses, do the
following: 1.
Go to Tools > Options. Select
Calendar Options under Calendar Group.
2.
Click the button Resource
Scheduling… in the Advanced options
section. A window similar to the one
below appears. Resource Scheduling dialog box
1.
Check Automatically accept
meeting requests and process
cancellations to automatically accept
requests.
2.
Check
Automatically decline
conflicting meeting requests to decline
meeting requests if a conflict arises. This
is helpful when meeting requests conflict
with other scheduled meetings.
3.
Check Automatically decline
recurring meeting requests if you want to
decline meeting requests fearing that a
conflict could arise due to recurring
meetings. Generally, recurring meetings
span over a period of time and can flood
your calendar with too many schedules in
no time hence it is recommended to use
this option in this case.
SESSION 13: MANUALLY MODIFY A
JOURNAL ENTRY
RELEVANT KNOWLEDGE
In real work life, it is important to track
your time and tasks and thus document
the efforts needed to complete a project.
As you know, using the Journal feature
you have a way to track time, tasks, and
“project manage” your assignments. In an
earlier session, you learnt to set up
journal to track time automatically. You
Page 118 of 240
can also track journal entries manually
using the email messaging software. You can record time spent on a variety of
items such as meetings, phone calls, etc.
by recording journals manually. For
billing purpose (when the time spent on
an activity is billed to the client), you
want to know the amount of time spent
on an activity. This tracking can also help
in effective time management.
For example, if you want to record the
time spent on a phone call, do the
following:
1.
Open your calendar software.
2.
Select Go > Journal.
3.
Select File > New Journal Entry. A
window similar to the one below appears.
4.
Enter the following details:
a)
In the Subject: text box, type A/C
Repair Service, Maintenance Feedback
Call.
b)
Select Phone Call from the Entry
Type: dropdown menu
c)
If you plan to complete this call
within ten minutes (based on your
experience), select 10 minutes from
Duration: dropdown menu.
5.
When you are ready to dial the call,
select Start Timer. Notice the Start Timer
is grayed out and Pause timer is available
indicating the progress of this Journal.
6.
When you are ready to dial the call,
select Start Timer. Notice the Start Timer
is grayed out and Pause timer is available
indicating the progress of this Journal.
7.
You can use the text area to record
the comments of this call. Once the call is
complete, select Pause Timer.
8.
Click Save & Close. Notice the
Journal entry is created and displayed in
your calendar (figure below).
Now create manual entries for activities
such as meeting, sending letters, etc.
using the procedure outlined in this
session. SESSION 14: REPLY TO A TASK
REQUEST
RELEVANT KNOWLEDGE
When working together as a team, you
may have a list of tasks assigned to each
person in the team. For example, if you
want to organize a school annual day
function, a team is formed and tasks are
assigned to each student. This makes it
easier to complete the project on time. This is also called work delegation. The
same scenario exists in a real work life.
Tasks can be assigned to coworkers and
subordinates. Each Task has a due date,
a priority, and other settings such as
whether you want status updates, privacy
options, etc. Page 119 of 240
You have learnt to create tasks in earlier
sessions. You can create task requests for
others using the email messaging
software. Create a task
If you want to assign an existing task
from your calendar, do the following:
•
Open your calendar software
•
Select Go > Tasks
•
Create a task, for example:
•
Subject: Collect donation from all
students
•
Select a target date from Start
Date: and Due Date: dropdown
•
Use the Task body to include task
items or instructions for this task.
•
Notice the Owner: field (Currently
you are owner of this task) (figure below).
•
Select Save & Close. Notice the
task is created in your task list (image
below).
Assign a task
To assign this task to someone, do the
following:
•
Doubleclick the task to open the
task (figure below).
•
Select Assign Task from Manage
Task group. A window similar to the one
below appears.
•
Select To…, and then select the
contact (whom you want the task
assigned) from your address book. •
Select the schedule using Start
Date: and End Date: to indicate timelines
for the activity.
•
To keep track the progress of the
assigned task, select both Keep an
updated copy of this task on my task list
and Send me a status report when this
task is complete. •
Click OK. A window similar to the
one below appears.
•
You have assigned the task to the
contact. To send this task, select Send.
Page 120 of 240
The task is sent to the contact through
email.
•
Accept the request (Recipient’s
end)
The contact(s) whom you have assigned
this task to receive a notification on
opening their email (refer figure below).
The contact(s) can either Accept or Reject
the request. If they select Accept, the task
will is added and can be viewed in their
Tasks list (figure below). Once the task is accepted, the ownership
is transferred and now when you view the
task by double clicking on it, you see the
following details:
Do you notice a difference? List them out.
Sending updates
Now the assignee will send updates of the
progress and complete this task. To send
an update, you need to do the following:
•
Open the task to be updated.
•
In the task form, enter the updated
information. Any previously entered
information can be modified and new
information added.
Note: To view who will receive updates,
select Details. The Update List line
displays the user name(s) of who will
receive updates.
•
On the task request tool bar, click
Save & Close. A task update is
automatically sent to those on the update
list.
Once the task is completed, the sender
can indicate so by doing the following
1.
Select Mark Complete Mark
Complete in Manage Task group to
indicate to the sender that the task is
complete. 2.
On doing so, an email is
automatically sent to the contact who
originally assigned this task.
The sender (Original owner) receives a
mail similar to the one below:
Sender’s task list is automatically
updated with the status of this task and
can be viewed in their task list as being
struck out.(figure below):
Page 121 of 240
This method of assigning existing tasks
from your task list can also be used when
the task is originally assigned to you and
you to transfer the task to someone else. Tracking task status
Just because you delegate a task to
someone does not mean your
responsibility is over. Hence, even though
you assigned a task to someone else, you
will still need to keep track of the
progress on the task. This helps to
avoiding any last minute surprises. You
will receive a status report from the
recipient similar to the one below:
To view the status of the task, do the
following:
a)
Select Go > Tasks
b)
Doubleclick on the task. A window
similar to the one below appears:
c)
Notice the Status: displayed as In
Progress as updated by the recipient. Also
notice the highlighted message above
subject indicating the deadline and the
date & time of the last update received. IT/ITES 307: COMPUTER NETWORKS
SESSION 1: INTRODUCTION TO
NETWORKING
RELEVANT KNOWLEDGE
A computer network, often simply
referred to as a network, is a collection of
computers and other hardware
components interconnected by
communication channels that allow
sharing of resources and information.
A network may consist of one or more
computers or devices connected to provide
access to resources. Resources include a
range of devices (example, Printer,
CDROM, Hard Drives, etc.) and services
(example, web service, mail service, etc.). Networks are used widely used for web
browsing, file transfers, file & printer
sharing, etc. and has become an integral
part of our daily activities. Today,
networks are now popular across private
and business users across the globe
making it difficult to work without it.
Page 122 of 240
Networks can also help in reducing costs;
for example you can buy a single printer,
attach it to a single computer and share it
across multiple users.
Networks based on size are broadly
classified into LAN & WAN. 1.
LAN: Local Area Network refers to
group of computers networked within a
limited geographical area such as schools,
colleges, offices, etc. 2.
WAN: Wide Area Network refers to
computers networked across geographical
areas, in other words they connect LAN's
between different locations. For example,
computers or devices in a branch office
could connect to the computer networks
at the head office through telephone lines
or satellites. Ways to form a computer Network
There are several ways to form a network
as listed below:
•
Use a crossover cable (also
referred to as Peertopeer cable)
•
Use Serial and Parallel ports
•
Use Bluetooth
•
Use WiFi (for more than two
computers)
•
Use Hub or Network Switch (for
more than two computers)
•
SOHO Router or WiFi Router
(Commonly found in home & small
business networks)
Though technically it is possible to
connect computers using the above
mentioned options, practices such as
using a crossover cable, WiFi or a
network switch are most common
methods. The technology or option choice
is generally based on the number of
connections, speed and distance
constraints. Networking Models
PeertoPeer(P2P): This is usually
meant for a maximum of 1020
computers. Herein, each computer can act
both as a server as well as a client. P2P
networks are simple to setup and use,
normally home and small office networks
fall in this category. P2P networks are
also referred to as the Workgroup model
and have their own security database, i.e.
User accounts are present on each and
every computer on a network. Fig. PeertoPeer Network
Client/Server: These are large networks
with 10 to hundreds of computers and
may have dedicated servers and devices.
Office networks that require centralized
security and administration fall in this
category. Common servers on these
networks include File Servers, Print
Servers, Messaging Servers, Database
Servers, Domain controllers, etc. Fig. ClientServer Network
Note: Clients are referred to as "Service
Requestors" and Servers as "Service
Providers". Any machine that request a
service is called as the client and
machines that fulfill the requests is called
the client.
Networks can have a combination of both
Client/Server models and PeertoPeer.
For example, you may be using a
centralized mail server and/or access files
from other machines in the network.
Intranet
Intranet refers to private computer
network used by organizations for
Page 123 of 240
sharing resources; Intranets can be
simple within a building or very large
spread across the globe connected
through various networking technologies.
Intranets help employees of an
organization to locate information much
faster resulting in increased productivity.
Though popularly referred to a company’s
internal website or portal, Intranet
usually employs other protocols such as
POP3, SMTP, FTP, etc. and may even
offer a variety of services (you will read
more about these in later sessions).
Extranet
Extranet is a computer network used
outside the Intranet. For example, an
organization may allow a vendor to view
or access their resources such as their
internal website for updating a product
catalog or training material. However,
this is highly restricted to Internet users
(public). Extranets are usually accessed
using VPNs (you will read more about
this protocol later).
Internet
Referred to as network of networks, the
Internet uses TCP/IP protocol suite.
Internet consists of billions of computing
devices and is the largest network in the
world. Internet is used for various
purposes such as
browsing, email,
chatting, social
networking,
online shopping,
etc. SESSION 2: THE OSI MODEL
RELEVANT KNOWLEDGE
In 1978, Open Systems Interconnect
(OSI) model was introduced by the
International Standards Organization
(ISO) to provide a conceptual model for
networking. The OSI model describes how
data is sent and received over a network.
This model breaks down data
transmission over a series of seven layers.
Each layer has a responsibility to perform
specific tasks regarding sending and
receiving of data. All the layers are
needed for a message to reach its
destination.
The OSI model provides the standard for
communication so that different
manufacturers' computers can be used on
the same network. Though each layer in
the model performs a specific function, all
the layers have one common function to
communicate with the layers above and
below them in the model. Data flow in the OSI Model
Data sent from one computer to another on a
network flows two ways in the OSI model,
Down (data encapsulation) and Up (data
decapsulation). OSI model ensures that
everyone follows certain guidelines and
hence each computer is able to
communicate with every other computer,
regardless of whether one computer is a
Macintosh and the other is a PC.
For example when data is sent by a
network application such as a web
browser to the application layer, the
application layer adds specific
information and passes on to the
Page 124 of 240
Presentation layer. Likewise presentation
layer adds presentation layer specific
information and passes the result to
session layer. This process is repeated till
Physical layer. Process of adding layer
specific information is termed as
“encapsulation”.
On the receiving computer, the various
headers and the data trailers are stripped
off one by one by each layer and passed
on to the next upper layer till the packet
finally reaches the receiving process.
Process of removing layer specific
information is termed as “decapsulation”.
Seven layers of OSI model are:
a)
Physical Layer
•
Only layer that deals with
hardware – media, signals and binary
transmission.
•
Modulate and demodulate signals.
•
Define Electrical signals and
cabling specifications.
•
Unit of measurement (called as
Protocol Data Units, PDU) at physical layer
is bits.
•
Hubs & Repeaters Operate at this
layer.
•
Protocols include 100BASET,
1000BASESX, DSL, etc..
b)
Data Link Layer •
Delivery of frames between
stations in a network.
•
Physical addressing using MAC
Address.
•
Network Interface Cards, Bridges
and Switches operate at this layer.
•
Unit of measurement in data link
layer is frames (data packet).
•
Protocols include Ethernet, PPP,
SLIP, Token Ring, etc. •
This layer can be subdivided into
two layers:
◦
Logical Link Control (LLC).
•
Media Access Control (MAC). c)
Network Layer, is also referred to
as Layer 3. This layer:
•
Logical addressing and routing
functions.
•
Handle routing of packets.
•
Routers operate at this layer.
•
Unit of measurement in network
layer is packets or datagram. •
Protocols include IPv4, IPv6, IPX,
RIP, OSPF, ICMP, etc.
d)
Transport Layer
•
Ensures endtoend communication
and errorfree transmission.
•
Provides connection/connectionless
oriented packet delivery & Sequencing.
•
Unit of measurement in transport
layer is segments.
•
Protocols include TCP, UDP, etc.
e)
Session Layer
•
Manages user sessions and
dialogues (Logon/Logoff).
•
Controls establishing, maintaining
(synchronizing) and terminating sessions
(conversations)/logic links between users/
network applications.
•
Protocols include NetBIOS, PAP,
PPTP, L2TP, etc. f)
Presentation Layer
•
Specifies architectureindependent
data transfer format.
•
Encodes/ decodes, encrypts/
decrypts, compresses/decompresses data.
Page 125 of 240
•
Protocols in this layer include
ASCII, EBCDIC, MIDI, SSL, TLS, etc
g)
Application Layer •
Responsible for processtoprocess
communication.
•
Provides standardized services such as virtual terminal, file and job transfer and operations (provides services
to endusers such as browsing, email, file transfers, etc.).
•
Protocols include HTTP, FTP,
SMTP, POP3, DNS, DHCP, NNTP, etc.
Note: Unit of measurement at Session,
Presentation & Application layers is data.
Hint: A simple acronym that will help
you to remember the layer names is All
People Seem To Need Data Processing.
Physical layer is concerned with
hardware and the rest with software.
IEEE 802 Standards
IEEE (Institute of Electrical and
Electronics Engineers) is an international
nonprofit organization that set
standards, IEEE 802 deals with LAN and
WAN related technologies. Services and
protocols specified in IEEE 802 map to
the lower two layers (Data Link and
Physical) of the sevenlayer OSI
networking reference model. In fact,
IEEE 802 splits the OSI Data Link Layer
into two sublayers named Logical Link
Control (LLC) and Media Access Control
(MAC). Following table summarizes the
IEEE 802 standards.
Standard Description
IEEE 802.1 LAN/ MAN Management
IEEE 802.2 LLC
IEEE 802.3 Ethernet
IEEE 802.4 Token Bus
IEEE 802.5 Token Ring
IEEE 802.7 Broadband LAN
IEEE 802.8 Fiber Optic LAN / MAN
IEEE 802.9 Isochronous LAN
IEEE 802.10 LAN / MAN Security
IEEE 802.11 Wireless LAN
Wireless Personal Area
IEEE 802.15 Network
SESSION 3: TERMINOLGIES AND
TECHNOLOGIES
RELEVANT KNOWLEDGE
Signaling Methods
In a network, communication happens
between devices or computers through
electrical, optical or radiowave signals.
Methods of signaling are widely
categorized into baseband and broadband.
•
Baseband: Data is sent as digital
signals by using entire bandwidth of the
media (Single Channel), supporting single
communication at a time. Signals are
sent over coaxial, twisted pair or fiber
optic cables. Baseband supports higher
transfer rates as compared to broadband;
however, baseband is limited with
distance. Baseband uses TDM (Time
Division Multiplexing) to send multiple
signals over a single cable. Example:
Ethernet, Token Ring & FDDI.
•
Broadband: Data is send as
analog signals by using portion of a
bandwidth. Broadband supports use of
multiple signals at different frequencies
(multiple channels). Signals are split into
channels by using FDM (Frequency
Division Multiplexing). Example: xDSL,
where telephone lines are used for both
voice (telephone) calls and data (Internet
connectivity). Page 126 of 240
Fig. Baseband vs. Broadband
Channel Operation
Channel operation refers to the mode of
communication between connected
devices or computers. Channel operation
can be simplex, halfduplex or fullduplex.
Simplex is a one way communication,
similar to that of a radio. Halfduplex is a
two way communication but only one way
at a time, similar to that of a
walkietalkie. Fullduplex is two way
simultaneous communication (data can be
received and sent at the same time),
similar to that of a telephone. Multiple Signaling Methods
When multiple devices or computers are
connected in a network, they use multiple
signals that are combined at the source
and separated at the destination by use of
a technique called multiplexing. For
multiplexing, a device called the
multiplexer is used for multiplexing /
demultiplexing signals. Types of
multiplexing include:
1.
TDM
(Time
Division
Multiplexing) is a method in which
multiple signals are combined and send
over a single transmission media such as
wires or radio waves. This is achieved by
use of time sharing; multiple signals are
transmitted for a defined amount of time
in cycles. For example, a device sends and
receives signals every alternate second. 2.
FDM (Frequency Division
Multiplexing) is a method in which
multiple signals are transmitted at
different frequencies. Multiple signals
can be sent at the same time over a single
channel using this technique. For
example, a device sends multiple signals
at the same time using different
frequencies similar to that of a radio (FM)
or cable TV and the end device receives
by tuning in to a particular channel. Data Transmission methods
Data can be transferred over a network
using the following techniques:
a)
Circuit Switching: In this
method, a dedicated path is established
between the endpoints before the data is
transferred. Once a dedicated path is
established, no other devices can use the
circuit. Example: DialUp, ISDN.
b)
Packet Switching: In this
method, data is divided into blocks
referred to as packets. Multiple packets
can be sent via different paths allowing
more than two devices to communicate at
the same time. Modes of operation can be
connectionless or connection oriented. ◦
In connectionless mode, packets
have source & destination address for
routing that may take different paths.
Example: Ethernet, IP, UDP.
◦
In connectionoriented mode,
connection is defined (a virtual circuit is
created) before a packet is transferred.
Packet switching supports variable
packet sizes. Example: X.25, Frame
Relay, TCP.
c)
Cell Switching: Cell switching
method is similar to that of packet
switching but has a fixed size for the cells
transmitting data. Cell switching is
efficient when large amounts of data need
to transferred. Example: ATM.
Channel Access Methods
Channel access methods refer to how
devices communicate using a shared
medium such as bus networks, star
Page 127 of 240
networks, ring networks, hub networks &
wireless networks. When multiple devices
or computers are used in a shared
medium, a predefined method of
transmission needs to be defined.
Channel access methods in circuit
switching networks include FDM, TDM,
etc and in packet switching networks
include CSMA/CD, CSMA/CA, Token
passing, etc. Ethernet
Ethernet is a family of computer
networking technologies for local area
networks (LANs) and has largely replaced
competing wired LAN technologies.
Ethernet standard defines how
communication happens between network
interface cards, hub, switches, repeaters,
etc. Devices on Ethernet networks use
frames or Ethernet frames for
communication. IEEE 802.3 standard
defines the Media Access Control (MAC)
portion of the data link layer and the
physical layer of the OSI model. Ethernet
protocols are covered by this standard. CSMA/CD
CSMA/CD (Carrier Sense Multiple
Access/Collision Detect) as per IEEE
802.3 standard is a mechanism that
defines how transmission takes place in a
network. Only one device in the collision
domain may transmit at any one time,
and the other devices in the domain listen
to the network before sending any
packets in order to avoid data collisions.
Collisions also decrease network
efficiency on a collision domain. If two
devices transmit simultaneously, a
collision occurs, and both devices device
will wait for a random amount of time
before attempting to transmit again. Collision domains are found in a hub
environment where each host segment
connects to a hub that represents only
one collision domain and only one
broadcast domain. Modern wired
networks use a network switch to
eliminate collisions. By connecting each
device directly to a port on the switch,
either each port on a switch becomes its
own collision domain (in the case of half
duplex links) or the possibility of
collisions is eliminated entirely in the
case of full duplex links. Collision
domains are also found in wireless
networks such as WiFi.; CSMA/CA is
used in wireless networks.
CSMA/CA
Carrier sense multiple access with
collision avoidance (CSMA/CA) is a
network multiple access method in which
nodes attempt to avoid data collisions by
transmitting only when the channel is
sensed to be "idle". Token Passing
Token passing is a channel access method
where a signal called a token is passed
between nodes that authorize the node to
communicate. The most wellknown
examples are token ring and ARCNET. Addressing methods
When multiple computers or devices are
connected in a network, signals can be
addressed as: 1.
Unicast refers to onetoone
communication, for example signal is sent
from one computer to another. 2.
Multicast refers to onetomay
communication, for example signal from
one computer or device is sent to selective
set of computers or devices. 3.
Broadcast refers to onetoall
communication, for example single from
one computer or device is sent to all
devices and computers in a network.
SESSION4: NETWORK TOPOLOGIES
Page 128 of 240
& ACCESS METHODS
RELEVANT KNOWLEDGE
In communication networks, a topology shows
the layout and describes the arrangement of
a network. A graphical representation of a
physical network is best illustrated through
topology. There are two ways of showing
network geometry: the physical topology and
the logical (or signal) topology. Physical topology refers to the placement of
network components including device
(computers and network peripherals) location
& cable installation. Logical topology refers to
how data is sent or received in a network. Basic topologies include Bus, Star, Ring,
Mesh and Hybrid.
Bus or Linear Topology
In bus topology, each node (computer) is
connected through a single cable (known
as backbone or trunk) used as a common
transmission medium for communication.
Signal from the source computer travels
to all computers connected to the cable
until the destination computer accepts
the data; if not, the machines ignore the
data. troubleshooting can be difficult. Though bus topology is the simplest form
for connecting multiple computers, issues
may arise when two computers have a
need to transmit at the same time. To
handle such collisions, CSMA/CD protocol
is used in Bus (Ethernet)
implementations.
IEEE Standards
related to bus topology are 10BASE2
(Thinnet) and 10BASE5 (Thicknet). Star Topology
Star topology is the most common and
widely used topology today. Each
computer is connected to a centralized
device called the hub or switch using
dedicated cable such as the TwistedPair.
All signals need to pass through the
centralized device. Star topology is
considered to be the easiest topology to
design and implement as adding
additional nodes is simple and easy to
troubleshoot in case of single cable
failure. However, entire network is
affected if the hub or switch goes down. Hub
Switch
RJ45
Fig. Bus or Linear Topology
Nodes are interconnected using coaxial
cables through the TConnector that
splits the connection between nodes.
Terminators are used at both ends to
absorb the signal. A device called the Repeater is used to
amplify and retransmit weak signals to
cover longer distances. Advantages include
ease of installation and low cost; however,
since all the computers depend on a single
cable, a single break or loose connection can
cause the entire network to be down and
Ring Topology
In a ring topology, each node connects to
exactly two other nodes, forming a single
continuous pathway for signals through
each node. Data travels from node to
node, with each node along the way
handling every packet. Ring topology
provides only one pathway between any
two nodes, ring networks may be
disrupted by the failure of a single link. A
Page 129 of 240
node failure or cable break can isolate
every node attached to the ring. Ring
topology uses physical star topology and
logical ring for communication. Devices used in ring topology include the
Token Ring Network Interface card,
Twister pair or fiber optic cables
connected to a centralized device called
the MSAU (Multistation Access Unit).
Other topologies include the Mesh
Topology where all nodes are connected to
each other one way or the other and the
Hybrid Topology which is a combination
of one or more topologies.
Twisted Pair
TwistedPair cables are widely used in
Local Area networks and telephone
networks. In a twisted pair cable, two
conductors of a single circuit are twisted
together for canceling out electromagnetic
interference (EMI) from external sources.
Types include the UTP (Unshielded
Twisted Pair) and STP (shielded Twisted
Pair). UTP cables are found in Ethernet
networks and telephone systems. RJ45
(Registered Jack) connectors are used to
connect the twisted pair cables to
endpoints on computer networks. RJ11
is a connecter used on telephone
networks. Some of the UTP cable grades
include:
Type
CAT 1 CAT Use
Voice (Tel ephones) Data (Eth Spee
d
< 1 Mbps 10 MHz
1 MHz 16 Pairs /
Wires
TwoTwis
ted Pair/4
FourTwis
3 CAT 5 CAT 5e ernet) Data (Fast
Ethernet) Data (Gb Ethernet) Mbps 100 Mbps 1000 Mbps MHz 100 MHz 100 MHz ted Pair/8
FourTwis
ted Pair/8
FourTwis
ted Pair/8
•
CAT 1 is primarily used on telephone networks (PSTN), ISDN connections
•
CAT 2 7 is used for data transmissions (Computer Networks)
IEEE Standards related to star topology
are 10BASET, 100BASETX, 1000BASET
& 10GBASET. Maximum distance
supported by twisted pair is 100 meters. Twistedpair Ethernet cables can be
wired "straightthrough" or “Crossover”. To connect a network interface card to a
switch, hub or router, straightthrough or
patch cables are used. To connect similar devices (network
interface card on computer to another
network interface on another computer,
hub to hub or switch to switch), crossover
cables are used. Pin No.
(RJ45)
1
2
3
4
5
6
7
8
T568B
T568A
White /
Orange
Orange
White /
Green
Blue
White /
Blue
Green
White /
Brown
Brown
White /
Green
Green
White /
Orange
Blue
White /
Blue
Orange
White /
Brown
Brown
Table: Straightthrough & Crossover reference
Fiber Optic
A fiber optic cable is a cable containing
one or more optical fibers. FiberOptic
Page 130 of 240
cables are ideal for transmitting data
over very long distances at great speeds
as light is used for the medium for
transmission. Fiber optic cables are not
susceptible to any EMI, Nearend
Crosstalk(NEXT), or Farend Crosstalk
(FEXT). Note that you require special network
interface cards & network switch that
support the fiber optic interface which is
usually expensive and common only in
large enterprise networks or locations
that are susceptible to EMI such as
factories that use heavy machineries. FiberOptic cables consist of a high
quality glass or plastic strands and a
plastic jacket made of Teflon or PVC that
protects the cable. Two types of FiberOptic cable exist:
SingleMode Fiber (SMF) used for longer
distances and MultiMode Fiber (MMF)
used for shorter distances. Signals are
transmitted as light signals from source
to destination. Either LED or Laser is
used. In multimode fiber, light signals
are transmitted in numerous dispersed
path (singlemode fiber use single light
source) and making it unsuitable for long
distance transmissions.
1. Core, 2. Cladding, 3. Buffer, 4. Jacket
In some cases, plenum rated cables are
used that have a special jacket to protect
against fire and emit less smoke than
normal cables. However, this is rare and
often seen only in industrial or
manufacturing sites. SESSION 5: NETWORK HARDWARE:
NETWORK INTERFACE CARD (NIC)
RELEVANT KNOWLEDGE
TCP/IP Utilities
On computers that have support for
networking, a list of utilities is available
to configure and troubleshoot network
related issues. Often referred to as
TCP/IP utilities, these utilities are
bundled along with the operating system.
Though the names of the utilities could
vary in spelling, the underlying function
is almost the same across operating
systems. Given below is a list of utilities
(with simple description) You will learn
more about them in later sessions.
Utility Description
IPCONFIG Internet
Protocol
Configuration Utility
GETMAC
View MAC or Physical
Address of an NIC
PING
Test network connectivity
TRACERT
Trace Route from source
to destination
ARP
Resolve IP address to
MAC address
Hostname
View computer name or
hostname
NETSTAT
View TCP/IP statistics
Nbtstat
View NetBIOS over
TCP/IP statistics
Nslookup
View DNS related
information
Route
View or modify routing
table
PATHPING Trace packets and view
detailed
packet
information
Note: Use /? for additional help/syntax
for each command listed here. For
example to know more about IPCONFIG,
type IPCONFIG /?
Network devices such as NIC, hub,
bridge, switch & routers are devices that
Page 131 of 240
help computers to network and
communicate. There are a variety of
network devices equipped with a wide
range of functions. Network Interface Card (NIC)
Network cards are devices that connect
computers to the network. Network cards
are both Layer 1 (Physical) & 2 (Data
Link) devices as they provide physical
access to the medium and also provide
physical addressing through the MAC
Address. Network Interface Cards are available for
desktop, laptop and server computers. A
variety of interface such as PCI, CardBus,
USB are available today. Most desktops,
laptops, servers and motherboards have
builtin NIC. PCI Ethernet Card for use in Desktops
Cardbus Ethernet Card for use in older laptops
USB Ethernet Card (USB Ethernet converter)
administrators need to configure or
modify NIC settings to match their
network environment. Common settings
found in most NIC include settings for
controlling speed & duplex modes, WOL
settings, Power Management, VLAN
settings, etc. Network Interface Cards have one or
more LED (Light Emitting Diodes) to
indicate network conditions like Link
status, Network Speed, etc. Usually there
are Light Emitting Diodes to indicate
Link/Speed (labeled as LINK) and
activity (labeled as ACT). For example
solid green could mean the device is
properly connected to a switch auto
negotiated at 100 Mbps / full duplex,
blinking orange could mean network
activity, no light indicate a problem with
network connection, etc. Lab: View status indicators in a network
interface card. Lab: View connectivity status through an
Operating System.
Lab: View connectivity status through an
Operating System.
1.
Click Start > Run and type
NCPA.CPL Then click OK.
2.
Rightclick Local Area Connection,
and click Status.
Lab: View Network Interface card
installed on a computer
Device Manager is a utility used for
configuring & troubleshooting hardware
devices such as Network Interface card,
sound card, video card etc. Device
manager display the status of devices
along with error codes if any. It is
commonly used for updating device
drivers, disabling/reinstalling devices etc.
Ref.http://support.microsoft.com/kb/310123 NIC’s mostly work out of the box, but
there might be instances where
Page 132 of 240
1.
Lab: View settings of a Network
Interface card.
2.
Devmgmt.msc. Then click OK.
3.
Device Manager opens. Expand
Network Adapters.
4.
Doubleclick on the Network
Adapter (For example, RealTek RTL
8139 Family PCI Fast Ethernet NIC).
Network Adapter properties is displayed.
Autonegotiation
Auto negotiation is an Ethernet
procedure by which two connected devices
choose common transmission parameters,
such as speed, duplex mode, and flow
control. In this process, the connected
devices first share their capabilities
regarding these parameters and then
choose the highest performance
transmission mode they both support.
Due to affordability of high speed devices
(NIC & Switch), 100 or 1000 Mbps speed
and full duplex settings are used usually
through autonegotiation, eliminating the
need to configure this setting. interface card. MAC addresses are
integrated with the NIC and usually not
possible to change. On a network, each
station is identified by its MAC Address.
MAC Addresses are governed by IEEE
and use 48bit (248) addressing scheme
providing a total of 281,474,976,710,656
MAC addresses. GETMAC is a command line utility used
for viewing the MAC address of an NIC.
Lab: View MAC Address of a Network
Interface Card using GETMAC.
1.
Click Start > Run and type CMD
to activate the command screen. Click
OK.
2.
Type GETMAC. Notice the MAC
address displayed.
Lab: View MAC Address of a Network
Interface Card using IPCONFIG.
1.Click Start > Run and type CMD to
activate the command screen. Click OK.
2.Type IPCONFIG/ALL. Notice the MAC
address displayed under Physical
Address.
MAC Address
Also known as physical address, MAC
Addresses are unique to each network
Boot ROM
Normally operating systems are installed
Page 133 of 240
on the computer. However, if the
computer does not have an operating
system installed, you can configure the
computer to load an operating system
from another computer on its network. To
load an operating system from another
computer on the network, these
computers require a special chip called
the BOOT ROM. Boot ROM can be added
to the NIC through a special socket or in
most cases today, it is often integrated
within the NIC. Computers that are not
equipped with floppy disk drives or hard
disk drives (disk less workstations) to
save cost and to keep the network secure,
can be used by loading necessary files
from a remote computer on a network.
Some computers such as public terminals
used in libraries, schools, etc. rely on a
centralized computer for processing and
storing capabilities; referred to as Thin
Clients these computers load their
operating system and applications from a
much powerful computer. SESSION 6: NETWORK HARDWARE
HUB, SWITCH & ROUTERS
RELEVANT KNOWLEDGE
While setting up a network, you will come
across different types of hardware used.
The commonly used hardware are hubs,
switches and routers. Hub: Hubs are Layer 1 (Physical Layer)
devices that connect multiple computers.
Number of computers that can be
connected depends on the number of ports
available on a hub, typical 4 to 8
computers. Hubs broadcast data to all
devices connected to it leading to
collisions; hence they are referred to as
multiport repeaters. Bridge: Bridge is a device that can
connect network segments and separate
network traffic based on broadcasts.
Bridges examine the frames and
selectively transfer frames according to
their MAC address. Bridges operate at
Layer 2 of the OSI Model. Switch: Switch or Network Switch is
similar to hub but manage traffic based
on MAC address and are efficient in large
networks. Switches are considered
intelligent as they build a table of MAC
Addresses of devices connected to it and
when each packet is received, they are
analyzed and forwarded to the device
with matching MAC Address.
Using switches can eliminate collision as
each port in the switch acts as a collision
domain. Since switches isolate collision
domains, they are referred to as
multiport bridges. When forwarding
frames, switches use Store and forward,
cut through, Fragment free or Adaptive
switching methods. Unlike a hub that
uses halfduplex communication, a
network switch can send and receive at
the same time (fullduplex mode)
resulting in faster performance. Number
of computers that you can connect to a
switch depends on the number of ports
available (Typically 4 or 8 on SOHO
switches designed for use in home and
small business networks and 8 – 32 or 64
on switches designed for use in an
enterprise network.). The networks can
be extended by adding additional
switches usually cascaded from the
primary switch. Switches designed for
larger networks are cascaded through a
special port called the Uplink port.
Page 134 of 240
Simple Network Setup.
An Enterprise network with a variety of
networking devices. Categories of switches include:
•
Unmanaged switches are network
switches used typically for homes or small
offices requiring no administrative
configuration. •
Managed switches are widely used
in enterprise networks and ISP’s. These
need to be configured by the network
administrator before it is used in a
network.
VLAN
A single layer2 network can be
partitioned to create multiple distinct
broadcast domains, enabling data to be
exchanged only between the computers
within the domain. This is referred to as
VLAN or Virtual LANs. This is created to
reduce collisions and to implement
security.
Power over Ethernet
PoE describes a standardized system to
provide electrical power supply through
Ethernet cables; generally, UTP cables
carry only signals necessary for data
communication. Switches that have
support for PoE are generally expensive
and in some cases only limited number of
Ethernet ports are capable of supporting
PoE. Advantages of PoE include the
ability to provide power up to 25 watts
and distance factor that allows devices to
be connected up to 100 meters from the
switch. Router
Routers are Layer 3 devices that route
packets to different logical networks.
Routers can discover and transfer packets
based on routing table that are
predetermined or selfdiscovered.
Routing tables are either managed by an
administrator by manually defining the
routes or automated through special
configuration to exchange the routing
tables with other routers on a logical
network. SOHO Routers are found in
home and small business environments
and Enterprise Routers are found in ISP’s
and enterprise networks. SOHO Router
Enterprise Router
Notable manufacturers of routers include
Cisco, Nortel Networks, Avaya, HP, Dell,
Huawei, etc
SOHO Router
Also referred to as a residential gateway,
SOHO (Small Office Home Office) routers
are devices designed for use in small to
medium sized networks. Most SOHO
routers have combinations of a switch,
DSL or cable modem and an access point
Page 135 of 240
for WiFi connectivity. These devices are
used for two primary purposes:
1.
Connecting desktops & laptops
across home or office.
2.
Sharing a single Internet
connection across desktops & laptops. Some models include support for
connecting peripherals such as printers,
USB hard disk drives, etc. through USB
ports. SESSION 7: PROTOCOLS
RELEVANT KNOWLEDGE
Protocols are a set of standards that allow
network devices to communicate and
exchange information. Protocols define
how devices start, manage and end
communication; most protocols are
described by IETF (Internet Engineering
Task Force) as RFC's (Request for
Comments). Protocols are set of rules for
communication. In a computer network,
all computers need to use the same
protocol for communication. Protocols
may include signaling, authentication
and error detection and correction
capabilities. Protocols address data
formats, address formats, error detection
techniques, sequence & flow control,
routing and other requirements for
communication. In a network, multiple
protocols are used during communication.
Examples of protocols at the network
layer are NetBEUI, IPX/SPX, TCP/IP,
AppleTalk, etc. The NetBEUI protocol is used to connect
and communicate between computers
with Microsoft Windows as the operating
system. Similarly AppleTalk protocol is
used to connect and communicate among
computers with MAC OS. However, when
connecting computers with different
operating systems you need to use a
standardized protocol such as the TCP/IP
protocol. Proprietary & Open Standard
Protocols
Proprietary protocols are communications
protocol owned by a single organization or
individuals. Usually proprietors enforce
technical and licensing restrictions
through patents to keep the specification
as a trade secret. Examples include
NETBEUI from Microsoft, IPX/SPX from
Novell, AppleTalk from Apple, etc. Open Standard protocols are
communication protocols that are publicly
available, have various rights to use
associated with it, and may also have
various properties of how it was designed.
Example, TCP/IP. TCP/IP
TCP/IP (Transmission Control Protocol /
Internet Protocol) is a routable protocol
suite that is also known as the Core
Protocol of the Internet Protocol
Suite. TCP/IP has gained popularity as it
is very efficient in very large networks;
most operating systems include support
for TCP/IP. Unlike many other protocols,
TCP / IP have the following benefits: 1.
Open Standard (not tied to any
vendor unlike proprietary protocols)
2.
Enable communication between
different Operating Systems (almost
every operating system including flavors
of Unix, Windows, Mac OS support TCP /
IP)
3.
Runs on any network framework
(Ethernet, Token Ring, DialUp
connections)
4.
Routable & a common addressing
scheme.
Page 136 of 240
IANA
Internet Assigned Numbers Authority
(IANA) is the entity that oversees global
IP address allocation, autonomous system
number allocation, root zone management
in the Domain Name System (DNS),
media types, and other Internet
Protocolrelated symbols and numbers.
IANA is a department operated by the
Internet Corporation for Assigned Names
and Numbers, also known as ICANN.
IANA manage the IP Address space
through regional Internet registries
(RIRs) to allocate IP address blocks
across the globe.
Classful Network
Classful network is an addressing
schedule originally introduced in 1981
and used for several years until the
introduction of CIDR method. In this
method, the 32bit address space is
divided into five addresses classes namely
A, B, C, D and E. Each class defines a
fixed network size and number of hosts
within networks. Following table summarizes the classes of
IPv4 addressing:
Class
TCP/IP protocol suite is the most widely
used protocol today including LAN’s and
WAN’s. Internet uses TCP/IP as its
protocol.
IP
Internet Protocol is the primary
communication protocol used for relaying
data across network boundaries.
Functions include logical addressing and
routing. The first major version of IP,
Internet Protocol Version 4 (IPv4), is the
dominant protocol of the internet. Its
successor is Internet Protocol Version 6
(IPv6), which is increasingly being used.
IPv4
IPv4 is a connectionless protocol for use
on packetswitched Link Layer networks
(e.g., Ethernet). It operates on a best
effort delivery model; in that it does not
guarantee delivery, nor does it assure
proper sequencing or avoidance of
duplicate delivery. These aspects,
including data integrity, are addressed by
an upper layer transport protocol, such as
the Transmission Control Protocol (TCP).
IP (IPv4) use a 32bit address that will
provide 4,294,967,296 (232) possible
addresses and has two parts: Network ID
(Portion of the address that represents
the network that a device belongs to) and
Host ID (Portion of the address that
represents the host on a particular
network). Network & Host portion of an
IP address is decided based on an
additional value called the Subnet Mask.
Each device on an IP network must have
a unique IP address for communication. IP addresses are binary numbers (image
below), but they are usually stored in text
files and displayed in humanreadable
notations such as 10.3.5.10 (image below).
Range
Subnet
0.0.0.0
A 126.255.2 255.0.0.0
55.255
No. of Networks
126
128.0.0.0
B 191.255.2 255.255.0.0 16,384
55.255
Page 137 of 240
192.0.0.0
255.255.255
C 223.255.2
2,097,152
.0
55.255
224.0.0.0
D 239.255.2 Multicast
55.255
240.0.0.0
E 255.255.2 Reserved for future use
55.255
Examples of Class A IP Addresses:
5.2.2.1, 12.1.1.14, 72.34.23.23
Examples of Class B IP Addresses:
129.1.2.3, 160.2.3.34, 190.2.3.4
Examples of Class C IP Addresses:
200.12.3.4, 202.13.14.15, 220.3.2.3
IPv6
Internet Protocol version 6 (IPv6) is the
latest revision of the Internet Protocol
(IP), intended to replace IPv4. IPv6 was
developed by IETF to address the IPv4
issue of address exhaustion. IPv6 uses a
128bit address, allowing for 2128, or
approximately 3.4×1038 addresses, or
more than 7.9×1028 times more than IPv4.
IPv6 addresses consist of eight groups of
four hexadecimal digits separated by
colons,
for
example:
2001:0db8:85a3:0042:1000:8a2e:0370:733
4. Most operating systems support IPv4
and IPv6.
SESSION 8: IP ADDRESS
RELEVANT KNOWLEDGE
As you have learnt about IP addresses in
the previous session, you know that IP
addresses are seen as numbers or
numeric values such as 10, 192, 182, etc.
However, computers use binary language
and translate decimal to binary and vice
versa behind the scene. IP addresses assigned to a host or a
computer can be public or private. Public IP Address
Public IP addresses are IP addresses
obtained from an ISP by organizations to
provide services such as web hosting,
email, etc. This is similar to that of a cell
phone number that is required for your
make and receive phone calls. If you want
to provide a service such as free email for
users (like Gmail) or an online shopping
mall for your customers, you must have a
public IP address assigned to the
computer serving such requests. When you rent or lease an Internet
connection from an ISP such as DSL,
Cable, Dialup, etc. you are given only a
dynamic IP address that changes in most
cases every time you reconnect; ISP’s
issue the same IP address to different
customers on a rotation basis to reduce
the incurred cost. If you want to provide
an Internet based service such as free
mails or a website on your computer, you
need to get a dedicated or static IP
address which can be leased from the ISP
for a fixed fee. Private IP Address
Private IP addresses are addresses used
in private networks such as homes and
internal office networks. Private IP
addresses need not be purchased as it is
meant for private use and anyone can use
the private address without approval
from a regional Internet Registry (RIR);
private IP addresses will not connect to
public address and vice versa. This is
similar to that of extension numbers that
can be used only for calling each other
telephone numbers with an office. The Internet Engineering Task Force
(IETF) has directed the Internet Assigned
Numbers Authority (IANA) to reserve the
Page 138 of 240
following IPv4 address ranges for private
networks:
Class
IP address range
A
10.0.0.0 – 10.255.255.255
B
172.16.0.0 – 172.31.255.255
C
192.168.0.0 – 192.168.255.255
Internet service providers (ISPs) only
allocate a single public IP address to each
residential customer, but many homes
has more than one computer or other
Internet connected device, such as IP
telephones or IP televisions. In this
situation, a network address translator
(NAT/PAT) gateway is usually used to
provide Internet connectivity to multiple
hosts that translates private to public IP
address and vice versa. Private addresses
are also commonly used in corporate or
enterprise networks.
Subnet Mask
When you assign IP addresses, you need
to provide the subnet mask value. Subnet
masks are used for dividing logical
networks into one or more subnetworks,
a practice referred to as “subnetting”. Providing a subnet mask helps devices or
computers calculate and indicate portions
of network ID for a given IP address; this
in turn is used for determining if the host
belongs to the same or different logical
network. If the host is identified to be in a
different logical network, then the packet
is sent to the gateway IP address for
routing.
IPCONFIG is a command line utility used
for managing IP configuration.
IPCONFIG is used for viewing IP
configuration of a computer; however,
additional administrative tasks are also
possible using this command. Lab: Determine if the IP address is
Private or Public using IPCONFIG
Lab: Converting from Binary to Decimal
& vice versa.
Lab: Identifying Network & Host ID of
the IP Addresses.
SESSION 9:
ASSIGNMENT
IP
ADDRESS
RELEVANT KNOWLEDGE
IP addresses are assigned by
administrators either manually or
automated through DHCP servers. In this
session, you will learn about IP address
assignment. IP Address Assignment
Internet Protocol addresses is assigned to
a host either on booting (when on the OS
starts), or permanently by a fixed
configuration of its hardware or software.
Administrators can allocate and assign
unique nonchanging IP addresses to
hosts or computers. Such addresses are
called Static IP address. On large
networks, administrators automate the
IP address assignment using a special
service called the DHCP that assigns IP
addresses automatically; such
dynamically assigned addresses are
called Dynamic IP address.
Static IP provided by Administrator for
each computer or host (left) and a DHCP
Server configured to assign a dynamic IP
address through a predefined range.
If you want to host a website or provide
Page 139 of 240
email services to employees or users,
generally you should use static IP
addresses. If you want to provide Internet
access to users, you can use dynamic IP
address. Dynamic IP addresses are
assigned by a network device such as
SOHO Router or Servers that have DHCP
capability.
Lab: Assign static IP address to
computers.
1. Click Start > Run > Type
NCPA.CPL > click OK.
2. Rightclick Local Area Connection,
Click Properties.
3. Select Internet Protocol Version 4
(TCP/IPv4) and click Properties.
Lab: To view IP Configuration
(Command Prompt).
PING is a command line utility used for
testing network connectivity. PING
operates using ICMP echo request
packets for its response from another
computer and measures the time taken
by the packet (from transmission to
reception referred to as RoundTrip).
PING is widely used by administrators to
understand and troubleshoot network
related issues particularly at the network
layer of the OSI model.
Lab: Check network connectivity using
PING (LAN).
ARP or Address Resolution Protocol is
used for resolving IP addresses to MAC
address. When two computers
communicate using IP address (Layer 3)
on the same subnet, IP address will be
resolved to MAC address (Layer 2) and
they start communicating using MAC
Address through Network Switch. Thus
ARP, a layer 3 protocol serves as an
intermediate between Layer3 and Layer2
establishing connectivity between
network layer and the Ethernet. Once resolved, mapping of IP Address to
MAC addresses are stored in cache for
some time for future use. Entries resolved
automatically are referred as dynamic
entries and is used most of the time. Lab: Use ARP to view current entries
(Command Prompt).
Loopback IP Address
Loopback IP address is a special IP
address reserved for testing local
machine’s NIC or device drivers or
TCP/IP stack within the local computer.
It cannot be assigned to any computer
and is implemented at the software level.
IP address in the range of 127.0.0.1 to
Page 140 of 240
127.255.255.254 is reserved for loopback
address. However, 127.0.0.1 is most
commonly used for testing and
management purposes by administrators.
Lab: Test Loopback IP
0.0.0.0
255.255.25
5.255
127.0.0.1
CIDR
Assigning numbers based on Classful
network was easier during early stages of
networking networks were smaller. As
time evolved, due to explosive growth of
the Internet, IP addresses were getting
exhausted. An addressing scheme, CIDR
(Classless Interdomain Routing), was
introduced for efficient use of IP
addresses.
If you have noticed, a Class A IP address
can accommodate 16 million hosts.
However, in most organizations the
number of computers will be probably in
thousands and not millions. Assuming if
an organization has around 2000
computers, imagine the wastage of
number of IP addresses if Class A was
used. Similarly, a Class C IP address can
accommodate only 254 host; and in the
same situation, the IP address range is
insufficient and multiple ranges from
Class C will be needed. CIDR helps
resolve these issues.
Lab: Use CIDR Method
Lab: Use the decimal to binary
conversion to determine network ID &
Host ID by using CIDR Method. Special IPv4 Addresses
Given below is a list of special IP
addresses that cannot be assigned to any
computer as they are reserved for specific
functions.
IP Address Description
169.254.x.
x
Refers to unspecified IP
address indicating the
absence of an IP address. Refers to the broadcast
address, used for
broadcasting in a network.
IP broadcasts are used by
DHCP & BOOTP clients.
Referred to as loopback
address, it is assigned to
the internal network
adapter.
Reserved for Auto IP.
SESSION 10: TRANSPORT LAYER
PROTOCOLS – TCP & UDP
RELEVANT KNOWLEDGE
While network layer protocols are used
for logical addressing and routing,
transport layer protocols provide
endtoend communication between hosts
or computers on a TCP/IP Network.
Transport Layer Protocols
The transport layer provides convenient
services such as connectionoriented data
stream support, reliability, flow control,
and multiplexing. Wellknown protocols
at this layer are TCP & User Datagram
Protocol (UDP). User Datagram Protocol (UDP) is a
transport layer protocol that is used for
sending messages to other hosts on the
network without prior communications,
to set up special transmission channels or
data paths. UDP does not provide
reliability, ordering, or data integrity.
UDP assumes that error checking and
correction is either not necessary or
performed in the application, hence
avoiding the overhead of such processing
at the network interface level. Page 141 of 240
UDP's stateless nature is also useful for
servers answering small queries from
huge numbers of clients, such as Domain
Name System (DNS), streaming media
applications such as IPTV, Voice over IP
(VoIP), Trivial File Transfer Protocol
(TFTP), IP tunneling protocols and many
online games. Transmission Control Protocol (TCP)
provides reliable, ordered delivery of a
stream of bytes from a program on one
computer to another program on a
different computer on the network. TCP is the protocol used by major
Internet applications such as the World
Wide Web, email, remote administration
and file transfer. UDP is used either by
applications that have a builtin facility
to check reliability or when transfers
happen that do not require reliability.
UDP has less overhead than TCP.
TCP
UDP
Reliable
Unreliable
Connection
Connectionless
Oriented
Segment
No Sequencing
Sequencing
Acknowledge
No Acknowledgement
Segments
Segment
No retransmission
retransmission
and flow control
Ports & Sockets
When a network application from a client
attempts to connect to corresponding
network application to a server, the
operating system uses a combination of
the assigned IP address along with a port
number referred to as a socket for
endtoend communication.
Computers that have single IP address
can host a variety of services using
different port numbers eliminating the
need for having multiple IP address. For
example, a computer assigned with an IP
address 12.1.1.1 can run a web server
using port 80 and an FTP server using
port 21.
Port numbers range from 0 to 65,535 as it
uses a 16bit scheme (216 = 65,536). 0 is
reserved and cannot be used; actual range
is between 1 to 65535. Some network applications such as
network & Internet games, video
conferencing software, etc. may use a
range of port numbers for communication.
For example
Apple’s QuickTime
Streaming Server uses UDP as its
transport protocol in the 69709999
range.
Note: To know about the port numbers
and range for specific network
application, refer to product manual or
the vendor’s website.
Note: To know about the port numbers
and range for specific network
application, refer to product manual or
the vendor’s website.
IANA WellKnown Ports
Port numbers in the range from 0 to 1023
are referred to as wellknown ports. Look
at the following table that summarizes
the standardized port numbers for
common application layer protocols:
Port Number Transport Description
0
TCP, UDP Reserved
20
TCP
FTP (Data)
21
TCP
FTP (Control)
23
TCP
Telnet
25
TCP
SMTP
53
UDP
DNS Query
69
UDP
TFTP
Page 142 of 240
80
TCP
HTTP
110
TCP
POP3
111
UDP
RPC
119
TCP
NNTP
137
UDP
NETBIOS Name Service
143
TCP
IMAP4
161
UDP
SNMP
389
TCP
LDAP
443
TCP
HTTPS
Note: See Service Name and Transport
Protocol Port Number Registry of IANA
for complete list of assigned ports. Port numbers from 1024 to 49151 are the
registered ports and are assigned by
IANA for specific applications from
products from a variety of vendors. Port
numbers above 49151 are dynamic or
private ports.
NETSTAT
NETSTAT (i.e. Network statistics), is a
command line utility used for viewing
port numbers used by network
applications. This command is used to
understand and troubleshoot any network
or transport later issues.
Lab: Use NETSTAT to view Ports &
status.
TCP/IP model
DoD (Department of Defense) or TCP/IP
Model simplifies the 7 layer OSI Model
into a 4 layer model (figure below):
OSI (7 Layers) vs. TCP/IP Model (4
Layers)
1.
Network Interface or Link Layer
specifies how data is physically sent on a
network using electrical, optical or radio
waves. This layer includes devices such
as NIC that directly interface with a
network medium such as a UTP Cable.
2.
Internet Layer specifies IP packets
sent on a Packet Switched Network and
is same as the Network Layer.
3.
Transport Layer specifies how
communication session takes place
between computers and is the same as
the Transport Layer discussed earlier.
4.
Application Layer specifies how
applications and protocols communicate
between end points. This layer combines
Session, Presentation & Application
layers of the OSI Model. Note: Different applications use several
protocols that are a part of the TCP/IP
Protocol Suite operating at each layer of
the OSI model. Lab: Refer to common protocols TCP/IP
protocol suite.
SESSION 11: SERVER OPERATING
SYSTEMS
RELEVANT KNOWLEDGE
Server Operating Systems (SOS) are
system software that allows us to manage
Page 143 of 240
data, users, groups, security,
applications, and other networking
functions. SOS are commonly used on
medium to large networks and uses the
client/server architecture.
Advantages
Disadvantages
Centralized
Initial cost can be
Management
high
Higher Level of Requires special
Security
technical expertise
Can be accessed Requires regular
from
remote maintenance
locations
Server Operating systems include
support for a variety of functions (not
limited to):
1.
Name Server (DNS, WINS, DDNS)
2.
Database Server 3.
Communications Server
4.
Mail Server
5.
File Server
6.
Print Server
7.
Proxy Server
8.
Web Server
9.
Remote Access Server
10.
Gaming Server
11.
Terminal Server, etc.
Generally, computers serving large
number of requests and/or offering
multiple services require powerful
hardware and appropriate support from
the Operating system. Popular server
operating systems listed below are
designed to support such hardwar.:
Microsoft Windows Servers
Windows Servers refers to the brand of
Server Operating Systems released by
Microsoft. Following are the list of Server
Operating Systems till date:
•
Microsoft Windows NT 4.0 Server
•
Microsoft Windows 2000 Server,
Advanced Server & Datacenter Editions
•
Microsoft Windows 2003 Web,
Standard, Enterprise & Datacenter
Editions
•
Microsoft Windows 2008 Web,
Standard, Enterprise & Datacenter
Editions
•
Microsoft Windows 2012
Foundation, Essentials, Standard &
Datacenter Editions
UNIX
UNIX is a multitasking, multiuser
computer operating system. UNIX
operating system is widely used in
servers, workstations, and mobile devices.
Based on UNIX Kernel, there are several
variants available today. Following is a
partial list of UNIX Variants:
•
SUN Solaris
•
IBM AIX
•
BSD OS
•
Digital Unix
•
HPUX
•
MAC OS X Server, etc.
Linux
Linux is a Unixlike operating system
assembled under the model of free and
open source software development and
distribution. Linux kernel was initially
conceived and created by Finnish
computer science student Linus Torvalds
in 1991 and today, Linux kernel has
received contributions from thousands of
programmers across the globe.
It is one of the leading Operating System
used on Servers, Mainframes, Smart
Phone and Supercomputers. Users &
administrators operate a Linuxbased
system through a command line interface
(CLI) or a graphical user interface (GUI).
Linux is packaged in a format known as a
Linux distribution through which users
install Linux on their desktops or servers.
Popular distributions include:
•
Debian
Page 144 of 240
•
•
•
•
•
•
Redhat
openSUSE
Android
Ubuntu
Bharat Fedora, etc.
Router. Following is an example of
implementing DHCP using SOHO router.
•
Login to the Router.
•
Select LAN Settings (Refer to
product manual for exact details).
SESSION 12:
NETWORKING
SERVICES DYNAMIC HOST
CONFIGURATION PROTOCOL RELEVANT KNOWLEDGE
DHCP
Dynamic Host Configuration Protocol
(DHCP) is a network protocol used to
configure network devices to enable them
to communicate on an IP network. DHCP infrastructure consists of:
•
DHCP Servers
•
DHCP Clients
DHCP server maintains a database of IP
addresses and configuration information.
When it receives a request from a client,
the DHCP server allocates an IP address
from a given range and sends the
configuration information to the client.
DHCP servers are preconfigured with a
range of IP address and additional
network configuration information by the
administrator. Like other TCP/IP, DHCP
uses port numbers 67 & 68. DHCP Process
DHCP follows a basic process widely
referred to as DORA.
Lab: Configure DHCP.
You can use the DHCP Service bundled
along with server operating system such
as Windows Server, Linux or a SOHO
Specify the DHCP range from
which the IP addresses will be allocated
to the computers in a network and select
the lease duration. Click Apply
Changes.
•
Lab: Configure clients for Dynamic IP.
By default, most operating systems will
be automatically configured as a DHCP
client. If you have modified the computer
to use static IP address, you should
reconfigure the computer to act as a
DHCP Client by using the procedure
below:
•Click Start > Run > type NCPA.CPL >
click OK.
•Rightclick Local Area Connection,
select Properties.
•Select Internet Protocol Version 4
(TCP/IPv4) and Click Properties
•Select obtain an IP address
automatically and Obtain DNS server
address automatically. Click OK
twice.
Now go the command prompt, check if the
computer has received IP address from a
Page 145 of 240
DHCP Server. Use Ping to verify
connectivity with other computers in the
network. Computer Names
Computers that run Microsoft windows
use unique NetBIOS names that are 16
characters in length. (The 16th character
is reserved for NETBIOS suffix to
represent service and as a result
computer names are maximum 15
characters long.) Computer names use
alphanumeric characters for naming
convention and are assigned by the
administrator. On a Microsoft windows network that
uses IP, computers can be accessed using
computer names instead of IP addresses
as these are easier to remember and
identify. Lab: View and Change Computer Name.
•
Rightclick My Computer, select
Properties.
•
Select Computer Name tab.
•
Click Change.
Prompt).
Note: You may need to restart the
computer.
HOSTNAME
Hostname is a command line utility that
can retrieve computer name. Lab: Use HOSTNAME (Command
Note:
•
Windows XP allows maximum 10
concurrent connections; Vista and above
allows 20. •
Everyone is a special group that is
created and managed by the Operating
Workgroups Workgroup or PeertoPeer computer
network refers to decentralized model
where the user name and password is
stored on individual computers.
Workgroup model is suitable for 1015
computers or fewer numbers of users and
requires additional administration as the
number of computer or user grows. Since
the permissions are managed locally at
each computer, each user or owners of a
computer act as an administrator. File and Print Sharing
Once you have setup the computer to
work in a network, you can share files
and printers among other computers in a
network. Lab: Share files on a computer.
• Create a folder that you want to share,
for example. C:\Monthly Reports.
• Rightclick the folder, select
Properties. Select Sharing tab. Click
Advanced Sharing.
• Click OK twice.
Page 146 of 240
system; any user account that is logged
on to a network becomes a member of the
Everyone group. You cannot modify the
members of Everyone group; however,
you can remove the Everyone group from
the Share Permissions list by adding a
desired user or a group account manually.
•
Select Read under Allow column
if you don’t want to allow users to modify
contents.
•
Select Change or Full Control
under Allow column if you want to allow
user to modifying contents.
Lab: Access a shared folder from another
computer.
•
Click Start > Run.
•
Type\\COMPUTERNAME\SHA
RENAME. (example, \\LABPC\Monthly
Reports)
•
You may be prompted to enter
username and password, type them and
click OK. You should be able to access the
shared folder.
Lab: Share a printer attached to a
computer.
• Go to Control Panel > Devices and
Printer.
• Install a printer. • Rightclick the
Printer, select
Properties.
• Select Sharing tab.
• Select Share this Printer, click OK.
Lab: Access a shared printer.
•
Click Start > Run.
•
Type \\COMPUTERNAME. •
Notice the shared printer
displayed. You need to install the printer
drivers on other computers in order to use
this printer; to automatically install the
printer driver on your computer,
doubleclick on the printer. Once
installed, you can use any application
such as word processing software to open
a document, select print and choose this
printer. Notice the printing request will
be automatically forwarded to the printer
available on the other computer.
To set permissions, select Security tab. •
Select Print if you want to
allow users to just print (default
permission).
•
Select Manage this Printer if
you want to allow users to have
administrative control over the printer.
•
Select Manage Documents if
you want users to manage document
queue. This should be used when you
want to allow users to pause, rearrange
or delete documents in print queue.
AutoIP Computers configured as DHCP Clients
will not able to communicate with each
other if they don’t receive an IP address
from a DHCP Server. In such cases
AutoIP feature of operating system
selfassigns IP address from a builtin
range so that client computers can
communicate at least with each other. Internet Engineering Task Force has
reserved the address block 169.254.1.0
through 169.254.254.255 for AutoIP
reserve range in IPv4. AutoIP is a
feature found on most recent operating
systems such as Microsoft Windows, MAC
OS X & Linux. Page 147 of 240
Lab: APIPA demonstration.
1. Stop or disable the DHCP Service (on
the Router).
2. Type IPCONFIG /RELEASE on all
DHCP Clients (to release the IP address).
3. Type IPCONFIG /RENEW on all
DHCP Clients (attempt to receive an IP
address).
4. Notice the IP address assigned to each
client computer in the 169.254.x.x range. 5. Use PING to verify connectivity
between different computers.
6. Start or enable the DHCP Service (on
the Router).
7. Repeat steps 2, 3 & 5. Additional Information
Network Controllers
On medium to large sized networks, it is
a practice to have centralized security.
Network or Domain Controllers are used
for authenticating user accounts and
permissions are tightly controlled. This
helps the administrators as everything is
centralized and users can login to any of
the computer within a network using a
single username &password combination.
Domains
Domain refers to a centralized model
where a centralized database stores all
the credentials (usernames, passwords,
security policies, etc.). Domain models
assist administrators to control
Domain Model, User Accounts on Domain
Controller the computers in a network
from a single station making it easier to
administer. Permissions (or restrictions)
to change wallpaper, access control panel
items, etc. can be set across the network
keeping all the computers secure. Domain
models are suitable for small, medium to
extremely large networks and can scale to
thousands of users.
Active Directory
Active Directory is a directory service
used in Microsoft Windows Domain
networks. Here, a domain controller is
configured to authenticate and authorize
all users and computers in a network.
Active Directory enforces security policies
such as password length, password
complexity, user restriction, etc. Active
Directory or an equivalent directory
service is widely used in medium to large
corporate networks. Active Directory uses
the LDAP Protocol for directory service,
Kerberos protocol for authentication and
DDNS for name resolution.
SESSION 13:
NETWORKING
SERVICES NAME RESOLUTION
RELEVANT KNOWLEDGE
Name Resolution
Name resolution refers to the process of
converting host names or domain names
to an IP address. On an IP network,
computers communicate using the IP
address. On an IP network, computers
communicate using the IP address;
however, computers are assigned names
which are easy to remember. When a user
attempts to access a computer by using
the computer or hostname, it is
translated to the IP address assigned to it
and then, the communication takes place.
Name resolution methods include using
HOSTS file, DNS, WINS & DDNS.
HOSTS File
The hosts file is a computer file used by
Page 148 of 240
the operating system to map host names
to IP addresses. The hosts file is a plain
text file and is conventionally named
hosts.
Note: Though it’s a plain text file, this file
does not have extension as .TXT.
HOSTS use a simple mechanism of
separating hostnames and IP addresses
by white space or tabs; this is very
similar to that of a phonebook having
entries of customers and their phone
numbers. You can map friendly names
such as John, PRINTSERVER, etc. that
will be easier for users to remember;
however for the computers to identify and
connect, you need to map the name with
respective IP address. Following are the
attributes of a host name:
•
Host name can contain maximum 255 characters.
•
Multiple host names can be assigned to single host.
•
Host name need not match the
NetBIOS computer name (Microsoft
Windows).
•
Comments can be included by
including a hash character (#).
Operating System
Unix / Linux
Microsoft
Windows XP / 7
Mac OS X 10.2
Novell NetWare
Android
Location
/etc/hosts
%SystemRoot
%\system32\drive
rs\etc\hosts
/private/etc/hosts
SYS:etc\hosts
/system/etc/hosts
DNS (Domain Name System)
Since HOSTS file needs to be maintained
on each computer, this method is not
possible on large networks and the
Internet. On large networks and the
Internet, a hierarchical distributed
naming system called the DNS is used.
DNS provides centralized name
resolution and can help reduce
administrative costs and efforts. DNS
uses a method is analogous to retrieving
phone numbers from a centralized service
such as the yellow pages instead of our
personal phone books. DNS provides a
worldwide, distributed keywordbased
redirection service and serves as an
essential component for the functionality
of the Internet. Unlike HOSTS file, DNS
can be quickly updated and updates are
distributed to other DNS servers across
the globe.
Domain name space
Domain name space consists of trees of
domain names and has multiple levels.
For example, for a domain
mail.google.com, .com refers to the
toplevel domain, google refers to
secondlevel domain and mail refers to
thirdlevel domain. A single DNS zone
may consist of one or more domains and
subdomains. Domain names are not case
sensitive.
Lab: View HOSTS file
•
Click Start > Run > type
C:\Windows\system32\drivers\etc
•
Click OK. Notice the contents of
this folder. To view HOSTS file, open it
with a text editor such as Notepad.
Page 149 of 240
Address resolution mechanism
When you use an application such as web
browser or mail client, the domain names
(e.g. Wikipedia.org or mail.google.com)
are translated to an IP address enabling
your computer to communicate. Domain
name resolvers determine the appropriate
domain name servers responsible for the
domain name to be accessed, by a
sequence of queries, starting with the
rightmost (toplevel) domain label.
DNS Process
The DNS process is explained below.
1.
User opens an URL,
www.example.org. Client sends a query to
ISP’s DNS for the IP address of
www.example.org.
2.
ISP’s DNS searches its database or
cache to find matching IP address. If not
found, query is forwarded to the root
server.
DNS Server responds to ISP’s DNS
Server with the IP address of
www.example.org.
5.
Client communicates with
www.example.org using its IP address.
Lab: View DNS Settings (Command
Prompt).
DNS settings are usually pushed along
with IP address. To view, do the
following:
• Click Start > Run > Type CMD > Click
OK.
• Type IPCONFIG /ALL, press Enter.
Notice the DNS server IP address
displayed under DNS Servers.
If you receive request timed out or
extremely delayed response from your
external DNS servers, try using other
DNS Server’ IP address such as one of the
Public DNS servers. Using Public DNS
Servers can improve performance and
resolve issues related to DNS name
resolutions; for example, Google provides
free Public DNS to be used as alternate to
DNS Servers. Typically ISP’s provide
Primary and alternate DNS’s server’s IP
address pushed along with your IP
address when you subscribe; if you have
performance or name resolution issues
with your ISP’s DNS Servers, then it is
recommended to use the Public DNS
Server’s IP address. For example, to use
Google’s Public DNS Servers on a
computer, do the following:
Lab: Use Public DNS IP Address.
3.
Root server traces the IP address of
the .org DNS Server and sends it to ISP’s
DNS Server.
4.
ISP’s DNS Server contacts the .org
DNS Server by its IP Address. The .org
Page 150 of 240
Lab: Clear DNS resolver cache
(Command Prompt).
Now use IPCONFIG /ALL and notice the
DNS server IP address displayed.
NSLOOKUP (Name Server Lookup)
NSLOOKUP is a command line utility
used for querying DNS servers. Lab: Use NSLOOKUP (Command
Prompt).
Type IPCONFIG / FLUSHDNS, press
Enter. Type
IPCONFIG /
DISPLAYDNS, press Enter. Notice the
results in DNS Resolver Cache.
SESSION 14:
NETWORKING
SERVICES – NETBIOS, WINS &
DDNS
RELEVANT KNOWLEDGE
DNS Client Resolver Cache
(Microsoft Windows XP / 7)
DNS client resolver cache is a RAMbased
table that contains entries of Hosts file
and host names that Windows has tried
to resolve through DNS. The DNS client
resolver cache stores entries for both
successful and unsuccessful DNS name
resolutions. This in turn can improve
performance as Windows can locate the
destination IP address directly from
Cache (RAM) instead of initiating another
query to an internal or external DNS
server. Lab: View DNS Resolver Cache
(Command Prompt).
NetBIOS over TCP/IP
NetBIOS over TCP/IP (NBT, or
sometimes NetBT) is a networking
protocol that enables legacy computer
applications (relying on the NetBIOS
API) to run on modern TCP/IP networks.
NetBIOS was developed in the early
1980s, targeting very small networks
(about a dozen computers). NBTSTAT
NBTSTAT is a command line utility for
viewing statistics of NetBIOS over
TCP/IP. Lab: Use NBTSTAT to view registered
names (Command Prompt).
Page 151 of 240
WINS
Windows Internet Name Service (WINS)
is Microsoft's implementation of NetBIOS
Name Service (NBNS), a name server and
service for NetBIOS computer names.
WINS is to NETBIOS Names just as DNS
is to hostnames, providing name
resolution services for computers running
windows on Microsoft Windows network.
DDNS
DNS requires hosts to be assigned static
IP addresses. DNS is not suitable when
using DHCP environments; as the IP
addresses keeps changing over time and
the DNS service requires permanent IP
addresses for its records. For example if a
consumer using a DSL or cable modem
wants to host a website (accessible to the
public) on his computer, it is not
practically possible as the public IP
address changes over shorter period of
times. In such a scenario, DDNS can be
used. Similar to WINS, DDNS clients can make
use of dynamic IP address and computers
can be accessed using hostnames or
domain names. How? For example, if you
are initially assigned a dynamic public
address of 202.1.2.3 , your computer can
be configured to update its IP address
along with the hostname or domain name
to a machine with DDNS. If the public
address changes, the DDNS client will
automatically contact and update the
DDNS with the changed IP address. Today, there are a many DDNS providers
on the Internet, offering their service free
or for a small fee. Examples of service
providers include (not limited to):
•
http://www.dnsdynamic.org
•
http://www.changeip.com
•
http://www.dyndns.com
•
http://www.changeip.com
•
http://freedns.afraid.org
•
http://www.dnsmadeeasy.com
Lab: Sign up with one of the free DDNS
providers.
SESSION
15:
NETWORKING
WIRELESS
RELEVANT KNOWLEDGE
Introduction to Wireless Networking,
RF Communication
Wireless network refers to a computer
network that is not connected by any
cables. Typically Wireless networking is
used where wired connectivity is not
possible or feasible due to technology
costs or availability. Wireless
telecommunications networks are
implemented and administered using a
transmission system called radio waves.
This implementation takes place at the
physical level (layer) of the OSI model
network structure.
Types of wireless networks
• Wireless personal area network
(WPANs) interconnect devices within a
relatively small area usually within a
person's reach. For example, usage of
Bluetooth to connect a mobile phone to a
laptop. • Wireless metropolitan area network
(WMANs) is a wireless network that
connects several wireless LANs. WiMAX
is a type of Wireless MAN and is
Page 152 of 240
described by the IEEE 802.16 standard.
• Wireless wide area network
(WWANs) is a wireless network that
covers large areas, such as one between
neighboring towns and cities, or city and
its suburbs. This network can connect
branch offices of business or function as a
public internet access system. Note: Though there are a variety of
Wireless Networks, this course focuses
only on Wireless LAN.
Wireless LAN
WLAN refers to connectivity between two
or more devices within short distances
such as homes or campus. WLAN uses
spreadspectrum or OFDM technologies
that enable users to have mobility within
the coverage area. WLAN corresponds to
IEEE 802.11 standards and are marketed
commonly under the WiFi brand name. WNIC: Wireless network interface
controller (WNIC) is a network interface
controller using radio waves for
connectivity instead of wires. WNIC is
usually found integrated with mobile
devices such as laptops; however, to use
on a desktop, you may need a dedicated
card. PCI WINC
CardBus WINC
USB WINC
WAP
Range Expander
WAP (Wireless Access Points): WAP
are devices that connect WNIC to wired
networks thus acting like a bridge
between wired and wireless networks.
WAP have builtin antennas for
communicating with WNIC and other
WAP’s. WAP are generally connected to a
network switch or router providing
internet connectivity to its client over
wireless networks. Since wireless
networks use radio waves, their
transmission capability is limited. Range
extenders are devices used for extending
wireless LAN similar to that of repeaters
used in wired networks. Most SOHO
routers have integrated access point and
they are commonly referred to as WiFi or
Wireless Routers.
IEEE 802.11: IEEE 802.11 standard
defines the WiFi standard, used for
wireless networks and is Sub classified
into IEEE 802.11b, a, g and n. IEEE 802.11x Standards
Note: IEEE 802.11 b, g & n are
compatible with each other. IEEE
802.11n is compatible with IEEE 802.11a.
Types of wireless LAN include the
ADHOC & Infrastructure Network.
Stand Radio Speed Range Range
ard
Frequ
(Indoo (outdo
ency
r)
or)
IEEE 2.4
Up to Up to Up to
802.11 GHz
11
35 m
140 m
b
Mbps
IEEE 5 GHz Up to Up to Up to
802.11
54
35 m
120 m
a
Mbps
IEEE 2.4
Up to Up to Up to
802.11 GHz
54
38 m
140 m
g
Mbps
IEEE 2.4 / 5 Up to Up to Up to
802.11 GHz
600
70 m
250 m
n
Mbps
ADHOC
Page 153 of 240
A wireless adhoc network is a
decentralized type of wireless network.
Also known as peertopeer (P2P)
network, ADHOC mode allows wireless
devices to directly communicate with each
other. Wireless devices within range of
each other can discover and communicate
directly without involving central access
points.
This method is usually used by two or
more wireless computers that connect to
each other to form a network. This is
considered the quickest method as no
other devices are required other than the
WNIC and the procedure is
straightforward and simple. Infrastructure Mode
In infrastructure mode, communication
happens via a centralized device called
the access point that serves as a bridge to
a wired network infrastructure. Usually,
this is used for utilizing resources on the
wired networks. For example, you may have an existing
wired network with two desktops
connected for Internet access; to add
wireless clients such as a laptop, you can
attach an access point to the network
switch. All wireless clients will access the
desktops and the Internet through the
access point. You may also find SOHO
routers (figure above) that has integrated
access points for connecting wired and
wireless devices in home or small
business networks. Dedicated access
points are used usually in enterprise
networks. SSID
SSID or Service Set Identifier is a unique
alphanumeric name used for naming
wireless networks. SSID’s can be 32
character’s long and is casesensitive.
Wireless clients continuously scan the
wireless network for available SSID’s.
Users or administrators can connect to a
wireless network. Any wireless device can
associate with only one SSID at a time
(similar to that of cell phone associated
with a single ISP or number). Wireless Zero Configuration &
Proprietary Utility
Wireless connection management utility
refers to software provided by a vendor
that is used for managing wireless
network connections. Also referred to as
proprietary utility, this is usually
installed along with the drivers and
accessed through a program shortcut.
Mostly utilities from different vendors
have different user interface that may be
confusing to end users. Wireless Zero Configuration (WZC), also
known as Wireless Auto Configuration or
WLAN AutoConfig, is a wireless
connection management utility included
with Microsoft Windows. You can use
WZC to manage wireless network
connections. It works with all wireless
adapters. WZC is used for providing an
interface that looks similar irrespective of
the wireless card used. This is useful to
consumers who work with different
WNIC from a variety of vendors. Page 154 of 240
following:
•
Click the Wireless Network Icon
DLink WLAN Utility WLAN (Windows 7)
Linksys WLAN Utility
Setting up Wireless Networks
Lab: Set up a ADHOC network
Install WNIC
• Connect the WNIC; install the device
drivers by referring to the product
manual.
• Verify if it properly installed using
Device Manager.
Set up ADHOC Network (Vista / 7)
•
Click Start > Control Panel >
Network and Sharing Center.
•
Select Set up a new connection
or network.
•
Select Set up a wires ad hoc
(computertocomputer) network, click
Next.
•
Click Next.
•
Type a name, for example
LABWIFI in the Network Name:, select
No authentication (open) from
Security type: dropdown list, select
Save this network.
•
Click Next, click Close. Now
this computer is configured to accept
WLAN connections.
To connect to this computer, do the
in the System Tray.
•
Notice the list of connection(s)
displayed. To connect to the ADHOC
network LABWIFI created earlier,
doubleclick LABWIFI from this list. You
will be connected to the other computer. Note: You will be able to access each
other computer by its computer name or
by IP address. Since there was no IP set,
both this connection will have the
autoconfigured IP address (169.254.x.x
range) and should be able to communicate
between these two. You can also specify
an IP address. Use the procedure for
setting static IP address covered earlier.
Lab: Set up a Infrastructure Network
(Use a WAP or WiFi Router).
Lab: Set up a Infrastructure Network
•
Connect the WAP to a free
computer on the network via LAN port
(Advisable for first time setup).
•
Open the web browser, type the IP
address of the WAP.
•
Select Wireless > Channel and
SSID.
•
Select Wireless > Security.
To connect to this WAP, Click the
Wireless Network Icon in the System
Tray.
Notice the list of connection(s) displayed.
To connect, doubleclick INFRADEMO
from this list. You will be connected to the
WAP. Wireless Site Survey
Before you implement a WLAN, you need
Page 155 of 240
to understand the requirements such as
coverage, number of computers that will
connect, roaming, data rates, etc. This
process requires planning and designing,
commonly referred to as Site Survey. WLAN, since it uses radio waves they are
prone to interference and the effect range
can be determined only after a thorough
study. You can analyze the signal
strength, coverage, etc. by placing a WAP
at a fixed location, move a client device to
measure and conclude the actual
requirements. SESSION 16: WIRELESS SECURITY
RELEVANT KNOWLEDGE
Overview of Wireless Security
Wireless security is the prevention of
unauthorized access or damage to
computers using wireless networks. Due
to affordability of WiFi Routers, Internet
access through wireless means have
gained popularity. Today, almost every
laptop and Smartphone is equipped with
wireless cards enabling users to access
network or the Internet through a
wireless connection. Data transmitted
over wireless LAN using radio waves can
be trapped and unauthorized users can
gain access to internal network resources
or access to the Internet without the
consent of the owner. In most cases,
unprotected WLAN’s acts like a free
hotspot for wireless users. You can protect WLAN’s by using
wireless security such as Wired
Equivalent Privacy (WEP) and WiFi
Protected Access (WPA) to encrypt and
decrypt network traffic. Piggybacking
Piggybacking refers to the practice of
using wireless Internet connection
subscribed by others. For example, a user
can connect to his/her neighbor’s WLAN
and access the Internet without
permission. Such practices are unethical
and considered illegal in some countries. Protecting WLAN
In order to protect wireless networks,
there are a variety of methods available
listed below (not limited to):
Note: Some of these methods may not be
possible if the WAP or SOHO router with
integrated AP lacks such capabilities. 1. Use MAC address authentication /
filtration: You can add the list of MAC
addresses of computers or devices to the
WAP. Connection to the WAP will be
allowed only if the WAP finds matching
MAC address. Lab: Use MAC Address authentication /
filtration.
•
Login to the WiFi Router.
•
Select MAC Address Filtering.
•
Type the MAC Addresses of the
computers or devices that you would like
to allow. Click Add and Click Apply
Changes. Repeat to add more MAC
addresses.
2. Implement WEP
WEP (Wired Equivalent Privacy)
WEP is a widely used security algorithm
and is often the first security choice.
Although its name implies that it is as
secure as a wired connection, due to
numerous flaws and has lost out to newer
standards such as WPA2. WEP uses
64bit or 128bit encryption.
WPA (WiFi Protected Access) &
WPA2 (WiFi Protected Access II)
WPA and WPA2 are two security
protocols and security certification
programs developed by the WiFi Alliance
to secure wireless computer networks.
WPA protocol implements a lot of the
Page 156 of 240
IEEE 802.11i standard, especially the
Temporal Key Integrity Protocol (TKIP).
TKIP employs a perpacket key, i.e. it
dynamically generates a new 128bit key
for each packet thus preventing attacks
which compromised WEP.
WPA2 has replaced WPA. WPA2 uses
CCMPa new AESbased encryption mode
with strong security and is considered
most secure.
Lab: WPA / WPA2.
• Connect to the WAP, login.
• Select Wireless > Security.
• Click Apply Changes. Now attempt to
connect to this wireless network and
observe the changes.
3. Disabling SSID broadcasts: If SSID
broadcast is disabled, SSID’s will not be
displayed when computers attempt to
discover WLAN’s. Lab: Disable SSID broadcast.
•
Connect to the WAP by using the
web browser
•
Select Channel and SSID
•
Uncheck Broadcast SSID. Click
Apply Changes. Now click the Wireless
icon on a client computer and notice this
SSID is not listed anymore.
4. Implement Wireless intrusion detection
systems and monitor your network for
any intruders attempting to access your
network through WLAN. This method is
most expensive as it involves use of
special devices and requires additional
research. To summarize, it is best to use a
combination of methods to keep the
network secure. Though there is no
guarantee of 100% protection, the
discussed methods definitely make it
difficult for unauthorized users to
penetrate and access the network. Troubleshooting Wireless Networks
Given below are guidelines to optimize
and troubleshoot wireless networks based
on best practices:
•
WLAN’s use radio waves that is
limited in distance. If the end device such
as desktop or a laptop is quite far away
from the WAP, the signal would be weak.
It is advisable to either move the devices
as close as possible or to place the devices
(at least the WAP) at a higher level to
avoid interference from obstacles such as
cupboards, etc. Anything made of wood,
steel, concrete, glass, etc. absorbs signals
resulting in poor signals. Use a range
extender to increase coverage area.
•
Change channels (optional) to
move away from other consumer devices
such as cordless phones, microwave oven,
etc. that may use the same frequency.
•
Use external antennas if supported
by the WAP or WiFi Router. SESSION 17:
WIDE
NETWORKS CONCEPTS
AREA
RELEVANT KNOWLEDGE
A Wide Area Network (WAN) is a
network that covers a broad area
(metropolitan, regional, or national
boundaries) using private or public
network transports. Using WANs, data
can be transmitted over very long
distances. There are a variety of WAN technologies
available offering temporary (pay as per
usage) and permanent (24/7 availability)
connectivity. Some of the common
Page 157 of 240
connectivity includes: DialUp, ISDN,
DSL, Cable, Satellite and Wireless.
Dialup
A Dialup connection is a form of network
connectivity using telephone networks. In
the initial stages of networking, dialup
connections were used to connect to the
ISP for Internet connectivity. In this,
computers are connected over telephone
networks using a device called the
MODEM (a device used for modulating
and demodulating signals from analog
signals to digital signals and vice versa). Protocols used in dialup networking are
SLIP (Serial Line Internet Protocol) &
PPP (PointtoPoint Protocol).
Dialup is now widely replaced by DSL &
Cable modem due to increased speeds and
lower cost today. However, you may still
find people using dialup connections for
Internet Access or for connecting to
offices in remote location.
ISDN (Integrated Services Digital
Network)
ISDN is a circuit switched network that
enables digital transmission over
telephone lines. It allows data, voice;
video transmissions over a single line and
multiple devices can use the same
communication line. ISDN is widely used
for high speed Internet access in most
countries.
DSL: Digital subscriber line is a family of
technologies that provide Internet access
by transmitting digital data over
telephone network. This is achieved by
using different frequencies for voice and
data.
The service is offered by installing a
DSLAM (Digital Subscriber Line Access
Multiplexer) (at telephone exchanges)
and a DSL filter (at customer’s premises)
to split voice and data thereby enabling
simultaneous transmission of voice and
data. Since multiple signals are sent over
pairs of wires at different frequencies,
this is categorized as broadband. DSL
uses PPPoE (PointtoPoint Protocol Over
Ethernet). Following is a summary of
some of xDSL standards:
DSL is offered by vendors with a variety
of options and sometimes with usage
restrictions based on quota and/or
bandwidth. For example, an ISP may
offer a download speed of 2 Mbps and
configure it in a way that it steps down
automatically to 512 Kbps or lower once
you reach a download limit of 10 GB.
However, this depends on the plan taken
from an ISP. Lab: Set up a DSL Connection.
Note: Your facilitator can demonstrate to
set up a DSL connection only if a DSL
router and an active internet connection
is available. You need an active DSL
connection from an ISP, a DSL Modem
and a computer to use DSL. 1.
Connect the DSL Modem to the
splitter.
Page 158 of 240
2.
Turn on the DSL Modem.
3.
Open the web browser, type the IP
address of the Router and login.
4.
View DSL Connection properties
(Use the Router Product Manual).
Cable Internet Access
Cable Internet access is a form of
broadband communication that uses cable
television infrastructure. Like DSL, cable
Internet access is provided through
coaxial or fiber optic cables from the ISP
to customer’s premises. Unlike DSL that
provides dedicated bandwidth, cable
Internet users share the available
bandwidth. Depending on the provider,
varying speeds are offered in the range of
1 Mbps to over 400 Mbps.
Wireless WAN
Wireless Internet access is used where
wired connectivity is not possible or for
remote locations. Wireless WAN uses
technologies such as LTE, WiMAX, GSM,
CDMA, etc. for providing connectivity.
WiMAX
WiMAX or Worldwide Interoperability for
Microwave Access is a wireless
communication standard used for
providing Internet Access to fixed
stations. WiMAX is used where wired
Internet access such as DSL or Cable is
not possible or available. As compared to other wireless
technologies, WiMAX is preferred as it
economically viable and easier to
implement. WiMAX can provide speeds of
30 to 40 Mbps with current trend at
around 1 Gbps; however, the actual speed
offered depends on the ISP. VPN
Virtual Private Network (VPN) allows
private network (LAN) to be extended
outside the network. Users of VPNs
access resources as if they are present
locally though actually they are located
remotely. A VPN connection is created
through a WAN link such as the Internet
but appears as a private link to the
endusers hence the name Virtual Private
Network. Though accessed through the
Internet in most cases, high level of
security is maintained between the host
computer and the network through use of
tunneling protocols and encryption. VPN
uses PPTP (Point to Point Tunneling
Protocol) or L2TP (Layer 2 Tunneling
protocol).
Routing & Remote Access Server
(RRAS)
RRAS is a feature in server operating
systems used for managing remote
connections. RRAS supports a variety of
connections including Dialup & Virtual
Private Network (VPN) you will read
about this later) and usually support tens
to hundreds of incoming connections. This
is usually used by large organizations and
ISPs. Routing
Routing is the process of selecting paths
in a network when sending or receiving
packets across computers or devices.
Imagine if you are planning to send a
parcel to someone; the parcel will travel
Page 159 of 240
through different offices, change routes if
roadblocks are detected and finally be
delivered to the recipient. Similarly when
you browse the Internet or send an email,
packets take different routes (from your
computer to your ISP, from your ISP to
the next ISP etc.) until it reaches its
destination.
On packet switching networks, routers
use static or dynamic methods: 1.
In Static routing, packets are
transmitted through a fixed route as set
in the routing table defined by an
administrator. It is not faulttolerant as it
can lead to a single point failure;
however, as the route path is known to
the administrator, static route is
considered to be secure. 2.
Dynamic routing refers to the
capability where the routes are
determined by the router automatically
based on conditions. Packets may take
alternate routes in case of a change in
network condition. When you specify an IP address and a
subnet mask, you also need to specify an
IP address in the default gateway
column. Routing takes place when a
packet is identified for delivery to a
remote network. Once the packet is
determined not a part of the local
network, it is forwarded to the default
gateway. Such packets forwarded to the
default gateway, are routed and sent to
the destination network. Routing Protocols
In dynamic routing, routing tables are
created and managed by routing protocols
that automatically run on a router.
Routing protocols enable routers to
exchange the routing table between them
periodically or when there is a change in
network condition. Two categories of
dynamic routing protocols are
Distancevector
protocols and
Linkstate protocols.
1.
Distancevector protocols use
some form of distance to calculate the
route metric. Examples include RIPv1,
RIPv2 & IGRP.
2.
Linkstate routing protocols
operate by building topology table based
on links and its status from neighboring
routers. Examples include OSPF & ISIS.
Routing Commands
TRACERT
TRACERT is a command line utility used
for displaying path taken by a packet and
measuring transmit delays across an IP
network. TRACERT uses ICMP.
Lab: Use TRACERT (Command Prompt).
ROUTE
Route is a command line utility that is
used for viewing and manipulating
routing tables. Routing table on
computers is automatically built based on
the IP configuration of your computer.
Route command is also used by
administrators to make manual entries in
the routing table to define static routes.
Lab: Use Route (Command Prompt).
PATHPING PATHPING is a command line utility
Page 160 of 240
that combines the power of both PING
and TRACERT. PATHPING can provide
PINGlike statistics between each host
traced through TRACERT. Lab: Use PATHPING (Command
Prompt).
SESSION
18:
NETWORKING
SERVICES – PROXY SERVERS &
ADDRESS TRANSLATION
RELEVANT KNOWLEDGE
Proxy Server
A proxy server is an application that acts
as an intermediate between internal and
external networks for processing
requests. Proxy servers hide internal
networks and hence provide an additional
layer of security. They are used to share
internet connections across multiple
computers such as an Internet Café.
Some proxy servers’ cache resources such
as web pages, videos to prevent content
being redownloaded thus saving network
bandwidth referred to as caching proxies.
Proxy servers can also be used to restrict
or bypass Internet access. NAT
Network Address Translation or NAT is
the process of modifying a private IP
address to a public address and vice
versa. NAT is commonly used where a
single public address is used for sharing
Internet access to multiple computers
hence, multiple private IP addresses.
NAT is a feature used widely in home,
small & medium to enterprise networks
for more than a decade due to IPv4
address exhaustion. Classic example
includes the Internet Café (referred to as
browsing centers) which uses a single
public IP among multiple clients having
private IP addresses. For example, look at the illustration. ISP
has issued a Public address of
202.12.12.18 for this connection (WAN
Interface) that is connected to a NAT
device. NAT device’s internal IP address
(LAN Interface) is 192.168.1.1 and the
clients are assigned 192.168.1.2 and
192.168.1.3 which are private IP
addresses. Clients cannot send any
request directly to 73.12.34.54 as it’s a
public IP address. Listed below is the
NAT process in this case:
1.
Client 1 sends a request to
73.12.34.54.
2.
LAN interface assigned with IP
192.168.1.1 receives the request.
3.
NAT software on the Router
replaces 192.168.1.1 with 202.12.12.18
and sends the request to 73.12.34.54.
4.
73.12.34.54 replies to 202.12.12.18.
5.
NAT software replaces
202.12.12.18 with 192.168.1.1 based on
its NAT table.
6.
Reply is sent to 192.168.1.2.
The process is repeated for all other
clients in the network. Thus though they
are assigned Private IP addresses,
computers in a network can access the
Internet by using a single public IP
address.
SOHO Routers are NAT devices widely
Page 161 of 240
found in home and small business
networks. Since routing happens between
public & private IP addresses and vice
versa depicting the function of routing,
NAT devices are commonly referred to as
Routers. Note to Instructor: Lab: Work with
NAT Device (Use Product Manual)
1.
Login to SOHO Router.
2.
Select WAN. Notice the settings
and values displayed for DSL connection.
Internet Connection Sharing (ICS)
Internet Connection Sharing is a feature
in Windows Operating System that
enables you to share Internet access with
other computers on a network. ICS can be
used when there is no availability of
WiFi Routers or other NAT Devices and
also on dialup, DSL, Cable, WiMAX and
other connections. ICS uses IP addresses
in the reserved range 192.168.0.x to
192.168.0.255; however, this cannot be
changed.
Lab: Use ICS SESSION 19: NETWORK SECURITY I
RELEVANT KNOWLEDGE
Network security refers to the practice of
securing computers and devices in a
network from unauthorized users and
attacks. Network security can range from
simple procedure such as using a
username and password to using complex
network devices to protect a network. When you connect to the Internet, your
computer and/or network is exposed to a
public network where anyone could
possibly attack and gain access to
resources including data. You can
implement certain measure such as using
a firewall to protect a computer or a
network from such situations.
Firewall
Firewalls are software or hardware
devices that protect a computer and/or a
network by analyzing and controlling
both incoming and outgoing network
traffic. Firewalls act like a window
between internal and external network
allowing authorized users to access
resources. Most operating systems
include a software firewall and are
configured to keep your computer secure.
Windows Firewall
Windows Firewall is a builtin firewall
software bundled and installed by default
on most Microsoft Windows Operating
systems like Windows XP, Vista & 7. Lab: View Windows Firewall Status
FIREWALL.CPL. Click OK.
Windows Firewall protects the computer
by using the default settings (firewall
rules) that can be modified anytime. Most
commonly used network applications
such as web browsers, email client
software, etc. work without the need for
modifying the settings on the firewall.
Some network applications may not work
as intended if it is blocked by the firewall
(for example, an antivirus software may
not be able to update itself from the
Internet); in such cases, you need to add
the application to the exception list
indicating that application is permitted to
use the network or the Internet. Page 162 of 240
be corrected using by applying security
patches, a process referred to as Patch
Management. Since presence of flaws is
considered as a security risk & threat,
these vulnerabilities must be addressed
as quickly as possible. Most vendors
analyze weaknesses and provide updates
called as patches on a periodic basis. In
most cases, the updates are automatically
downloaded and updated by
corresponding applications.
Lab: View Automatic Update Settings
(Windows).
Lab: Add a program to the Exception List
in Windows Firewall.
Select Exceptions tab.
Patch Management
When you install an Operating System or
applications, they may have flaws, also
referred to as security holes. This can be
an opportunity for people who can
manipulate and gain control of a
computer or network resources using
these flaws. Operating systems and applications may
have vulnerabilities (weakness) that can
Automatic Updates
Lab: Update an Application (Firefox).
Popular applications such as Firefox
include option for checking updates
directly from within the software. 1.
Start Mozilla Firefox.
2.
Select Help > About Firefox.
3.
Click Check for Updates. If there
are any updates available, it will be
downloaded, installed and program will
be updated. You can use products such as Belarc
Page 163 of 240
Advisor & Microsoft Baseline Security
Analyzer (MBSA) to analyze the
computer for any risks or threats and
take corrective action.
AntiVirus Software
Antivirus software can help in protecting
your computer against viruses. It is
highly recommended that you use an
antivirus software and most importantly,
keep it up to date! Some of the popular
antivirus software vendor include AVG,
AVAST, McAfee, Symantec, Kaspersky,
Microsoft, etc.
SESSION 20: TROUBLESHOOTING
NETWORKS
RELEVANT KNOWLEDGE
Troubleshooting Networks
You have learnt a variety of utilities and
concepts. When you manage a network, it
is quite common to face a number of
issues related to network or Internet
connectivity. Always check for any recent
changes made to a computer or network
before starting to troubleshoot; it’s most
likely that you find a clue that will save
time. Some of the wellknown error
messages include:
• Network cable unplugged:
Indicates issue with cable; check if the
cables are properly connected to both
computer and network switch or SOHO
Router. Use alternate cables to confirm.
• Limited or No Network
Connectivity: Indicates issue with
network card or IP settings, later more
common. Check if the computer is
configured as a DHCP client and verify
its IP address, gateway and other
relevant settings. • The Network Path cannot be
found: Indicates issue with network
card, IP settings or Name resolution
problems. Use the File and Print Sharing
troubleshooting procedure. • Windows has detected an IP
address conflict: Indicates issue with IP
address; assign another static IP address
that is different than the one assigned to
other computers within the same
network.
• A duplicate name exists on the
network: Indicates two or more
computers in a network have the same
name; assign another computer name
that is different than the one assigned to
other computers.
Use the following checklist and scenarios
as a general guideline when
troubleshooting:
•
Unable to connect to a network
(LAN)
If you are unable to connect to another
computer on the same network, do the
following:
•
Verify the cables are connected
properly at both ends.
1.
Use a cable tester if required.
2.
Replace RJ45 Jacks or use
different cable if possible.
3.
Check LED indicators on the NIC
to verify connectivity status, interpret
based on NIC product manual.
•
Check if the NIC is installed and
working properly using Device Manager.
1.
Sometimes the device drivers may
be updated when operating system
downloads and installs updates
automatically. In some cases, updated
drivers may be pushed through special
software bundled along with device
drivers. Typically updated drivers work
properly as they address technical issues
caused in earlier versions. In rare cases,
Page 164 of 240
these device drivers cause problems and
need to be replaced with the drivers that
worked earlier.
2.
Use device manager to find if the
driver was updated to a most recent one
and if that’s causing the problem; if yes,
try using Rollback driver to replace the
current driver with the previous device
driver.
3.
If Rollback driver did not fix the
problem, reinstall device drivers from
the original compact disc. If original
compact disc is not available, then
download the drivers from Vendor’s
website and complete the installation.
Verify if the issue is fixed. 4.
Always use device drivers intended
for the correct version of the operating
system. Device drivers designed for 32bit
operating systems are NOT compatible
with 64bit operating systems and vice
versa. 5.
Download drivers ONLY from the
manufacturer’s website; never download
drivers from 3rd party websites that may
be modified internally and may cause
major problems. Contact the vendor for
correct or compatible device drivers.
•
Check if the NIC settings are
proper (if altered) using Device Manager.
1.
In general, settings are managed
automatically and usually not modified in
home, small business or enterprise
networks. Sometimes, network card
settings are modified to match a network
environment and incorrect settings can
lead to problems in network connectivity. 2.
Use Device Manager to verify if
settings such as duplex settings, etc. are
intact. If unsure, reset the settings to the
default value indicated as Auto; refer to
NIC’s product manual. •
Check if the computer has a Valid
IP address (Use IPCONFIG).
1.
Computers are usually configured
to receive IP address from DHCP in most
networks to ease administration. If there
are issues with the DHCP server,
computers configured as DHCP clients
will not receive any IP address resulting
in network issue. In home and small
business networks, devices such as SOHO
routers provide IP addresses to client
computers. •
Check if the DHCP Service is
functional by logging to the SOHO router.
•
If all other computers configured as
DHCP clients receive IP address from
DHCP Service, then do the following (try
each step and verify if the issue is
resolved):
•
Use IPCONFIG/RENEW.
•
Disable and enable Network
Adapter (Local Area Connection).
•
Check if any firewall or startup
program is blocking (Use MSCONFIG to
reduce startup programs and check
firewall settings).
•
Test the affected computer by
assigning a static IP address in the same
subnet. Verify if the issue is resolved. •
Unable to connect to Internet
(WAN).
Always verify if the issue is associated
with a particular program or all programs
on a computer. You can save time by
proper probing to understand the exact
issue. For an example, if you hear a
complaint like “Internet not working”, it
could actually refer to an issue when a
user is unable to use their email client, a
web browser, video conferencing software
or a game. In addition to the above mentioned
procedure (Unable to connect to a
network (LAN)), use the following
Page 165 of 240
guidelines.
1. Test if the computer is able to
communicate with the gateway (Ping
gateway’s IP address).
2. Test if the computer is able to
communicate with the DNS server (Ping
DNS Server’s IP address).
a)
If you receive request timed out or
extremely delayed response from your
external DNS servers, try using other
DNS Server’ IP address such as one of the
Public DNS servers. Using Public DNS
Servers can improve performance and
resolve issues related to DNS name
resolutions; for example, Google provides
free Public DNS to be used as alternate to
DNS Servers. Typically ISP’s provide
Primary and alternate DNS’s server’s IP
address pushed along with your IP
address when you subscribe; if you have
performance or name resolution issues
with your ISP’s DNS Servers, then it is
recommended to use the Public DNS
Server’s IP address. For example, to use
Google’s Public DNS Servers on a
computer, do the following:
•
Click Start > Run > Type
ncpa.cpl > Click OK.
•
Rightclick Local Area
Connection, select properties.
•
Select TCP/IP (TCP/IPv4),
select Properties.
•
Enter 8.8.8.8 and 8.8.4.4 as
primary and alternate DNS Servers, click
OK.
Now your computer will use the Google’s
Public DNS servers for name resolution
instead of your ISP’s DNS Server. You
can also specify the Google’s Public DNS
Server’s IP address in your SOHO
Router, if you want to use Google’s Public
DNS Servers for all computers and
devices within your network; refer to
SOHO router’s product manual to alter
this setting. •
Use NSLOOKUP to verify name
resolution functionality.
b)
You can also use OpenDNS, a
name resolution service that is offered for
free. As compared to public DNS servers,
OpenDNS offers additional facilities such
as Phishing & Botnet Protection, Web
Content Filtering, etc., refer to OpenDNS
for more information. 3. If you do not have issues with name
resolution, but a problem associated with
a specific program such as a web browser
or an email client, do the following:
a)
Try using programs of similar
nature. For example, if the issue is
related to a web browser such as Mozilla
Firefox, try using Google Chrome or
Internet Explorer. •
If it works fine with other
browsers.
•
Clear the browser’s
cache; web browsers store cached copies
of content when you visit websites that
could lead to problems. •
Check the settings of the
web browser that related to this issue.
Reset it to defaults or the value
associated with the issue. Refer to
browser’s help file for further
instructions.
•
Web browser addon’s or
pluggin’s offer additional functionality;
some addons cause problems when in use.
In such cases, you can disable the
particular addon by using the addon
settings within the web browser. If you
are not sure of the addon that is causing
the problem, try disabling all addons and
verify if the issue is resolved. If the issue
appears fixed, then try enabling each
addon to confirm the issue with an addon.
Page 166 of 240
b)
If the issue is related to a email
client such as Microsoft outlook
configured to download copies of emails
from a service provider such as Gmail,
Live or Yahoo!. Or custom email
messaging providers, do the following:
•
Check if any other
programs are using the network or
Internet bandwidth; stop or exit all other
network applications that consume
bandwidth for testing. •
Check Username &
password combinations, if you are unable
to login; some services require just the
username (SOMENAME) and some
require username along with domain
name
suffix
(SOMENAME@
EXAMPLE.COM) for login names. Verify
password as well; check if the password
was recently changed.
•
Check if this the ports are blocked
by a firewall by using TELNET
•
Verify the email client POP3/SMTP
settings of the email client by referring to
the settings as required by the ISP.
•
Some ISP’s offer complimentary
email addresses when customers avail
web hosting services; usually the
POP3/SMTP settings are different than
the conventional port numbers or
settings, contact ISP for exact details if
required. Check if the ports are accessible
using TELNET.
Tip: Most ISP’s allow email access
through a web browser pointing to
customer’s domain names, commonly
referred to as webmail such as
mail.domainame.extension.
Check
customers webmail to verify the status of
mail service and to provide alternate
access until the actual issue is resolved. c) If the issue is related to a chat
software or video conferencing software
such as Skype, do the following:
•
Verify and confirm if other
applications are working
•
Some video conferencing software
use TCP or UDP ports that may be
disallowed by default in the firewall
settings of a local computer. Open the
firewall and the application to the
exception list and verify if it is working.
•
If you are using a computer behind
a SOHO Router, you may have to open
certain port numbers or port range for the
application to work. Usually port
numbers required by such applications
are documented and labeled as “Port
Forwarding” by respective vendors. Refer
to the application software and the SOHO
router to configure.
•
In certain cases you may have to
expose all port numbers for a particular
computer in a network; for example,
multiplayer games designed for use in the
Internet or an organization providing a
range of services from set of computers or
hosts. Demilitarized Zone or DMZ, is a
perimeter network that separates a single
computer or a network from the LAN
(though it is a part of the LAN) allowing
access to a specific computer or the
network. Computers that belong to DMZ
typically used in SOHO Routers are
exposed to the Internet, prone to direct
attacks. Refer to SOHO Router manual
for further reference. •
Unable to connect to a network
share (File & Print Sharing).
1. File and Print sharing service is
widely used in most networks, especially
on Microsoft Windows Networks. On a
Microsoft Windows Network, computers
are accessed each other by computer
names. For example, a folder with a share
name “MYSHARE” on a computer named
Page 167 of 240
“DESKTOP01” is accessed through the
UNC path, \\DESKTOP01\ MYSHARE.
If you are unable to access shares, do the
following:
• Confirm the share name and computer
name.
• Check if its computer or network
specific; for example, if this share is not
accessible only a particular computer or
the entire network. • If it is across the entire network, then
do the following on the computer that is
configured to act as a server:
•
Check network adapter & IP
address settings.
•
Check if File and Printer Sharing
is allowed in Windows Firewall or 3rd
party firewall.
•
If it is only on a single computer,
then do the following on the computer
where the share is being accessed:
•
Check network adapter & IP
address settings.
•
Check if you are able to access the
computer by IP address instead of
computer name.
•
If you are able to access the
computer by IP address but not by
computer name, it indicates a problem
with name resolution. Add the remote
computer along with its IP address in the
HOSTS file for quick resolution. •
Check if NETBIOS over TCP/IP is
enabled (Advanced Settings of TCP/IP
Properties).
•
Check Firewall settings. If unsure,
disable firewall and verify.
Note: On computers running vista/7/8
additional procedures may be required,
refer to the manual for detailed
instructions.
Some operating systems include builtin
facilities for fixing issues automatically.
For example, you may use the Repair or
Diagnose option to fix network issues
automatically. This could be useful for
users who do not have sufficient
knowledge to fix network issues or even
understand their network setup. Network
troubleshooter designed to run series of
tests and present friendly messages that
is understandable by nontechnical
persons. To repair your network
connection automatically, do the
following:
1.
Troubleshooting. 2.
To troubleshoot issues related to
Internet connectivity, select Connect to
the Internet.
3.
Click Next. Follow the onscreen
instructions.
TELNET
Telnet (Terminal Emulation) is a
clientserver protocol used for established
connections to a remote host. Telnet is
also a utility used by administrators for
troubleshooting network applications.
TELNET can be used for connecting to
remote computers, switches and routers
as well. Telnet provides bidirectional
textoriented communication using a
virtual terminal connection. Telnet uses
TCP and port number 23.
Lab: Use TELNET (Command Prompt)
for troubleshooting.
Consider this situation when you want to
understand if a web or an email server is
functioning properly and you send
packets to a remote computer using the
PING utility. PING works based on
ICMP, a protocol that operates at the
network layer; whereas a web works at
the application layer listening for HTTP
requests. If you receive replies when
using the PING utility, it indicates the
Page 168 of 240
computer providing the service works, not
the service itself. Usually you will use a web browser to
connect to a web server by sending HTTP
requests. However, in this scenario you
are not sure if the web server is listening
or not. Hence, you can use the TELNET
(to emulate an HTTP request) to confirm
if the web server is listening or not. To
test if the web server is listening to
incoming requests, do the following:
communication and TCP port 3389. Lab: Remote Desktop
• On computer A, click Start > Run and
type SYSDM.CPL, click OK. • On computer B, click Start > Run and
type MSTSC.EXE, click OK.
Notice the first line displaying HTTP 400
Bad Request and rest of the screen filled
with HTML code. Typically web browsers
send HTTP requests in a format that only
a web server can understand. In this case
we have used TELNET program to send a
request and the connection was accepted.
This indicates and confirms that the web
server was listening to port 80.
Remote Desktop Remote Desktop is a feature that enables
computers to be managed remotely from
other computers. This feature is
commonly used by administrators to take
remote control of a computer for
performing administrative tasks such as
installing or removing software,
managing user accounts, troubleshoot
application issues, etc. The functions are
similar to that of normal system
administration, except these are all done
remotely. Remote Desktop uses the
Remote Desktop Protocol (RDP) for
Now you should be able to perform
administrative tasks on the remote
computer.
You can also use other 3rd party software
such as VNC, TeamViewer, GoToAssist,
Ammyy admin, GoToMyPC, LogMeIn,
Radmin, Symantec pcAnywhere, Google
Chrome Remote Desktop, etc. for taking
remote control of a computer.
Troubleshooting Model
As general practice, you need to adopt a
troubleshooting model that can help you
stay organized and troubleshoot
effectively. Following is a general
guideline:
•
Gather Information about the
Issue or Statement.
1.
Probe to differentiate if it is a
request or an issue.
Page 169 of 240
2.
Probe to find out if it is affecting
single computer or an entire network.
•
Determine if any recent changes
were made.
1.
Examples: was any software
downloaded and installed with or without
their knowledge, any settings was
changed, any hardware device added or
removed. •
Determine the most probable
cause.
•
Create an action plan.
•
Verify the result and apply
preventive measures.
•
Document the resolution.
Though this gives you a broad picture
about troubleshooting, you may have to
use additional resources in certain
situations. Use the following guidelines to
enhance your knowledge on
troubleshooting further:
a)
Most product manuals or help files
include detailed instructions for
completing most tasks. It is highly
recommended to read the product manual
to understand features and limitations
prior to troubleshooting. Sometimes, you
may also find latebreaking information
(most recent issues when the product is
about to be shipped out) usually
documented in a file labeled as
Readme.txt or Readme.htm.
b)
Vendors also provide additional
Selfhelp through community forums
setup for each product or feature at their
websites. You may submit your question
or issue that may be answered by experts
for a possible resolution. Be aware that
you may even receive an answer from a
normal registered user who may or may
not be 100% competent in the particular
area; if the answer is vague, try
validating the answer from another
expert in such cases.
c)
Paid or Free Support is offered by a
variety of vendors; some vendors offer
free support through email or chat while
charge a fee for voice support. Research
by visiting the website and find out if
there is a way to get your solution, either
for free or for a small fee.
d)
Make use of free eBooks or training
materials that are widely available on the
Internet. Use free resources such as
Wikipedia, eHow.com, about.com, etc. for
articles on networking, troubleshooting,
etc. Page 170 of 240
IT/ITES 308: WEB DESIGNING PART 1
SESSION 1: INTRODUCTION TO
WEB DESIGN AND HTML
RELEVANT KNOWLEDGE
You have surfed several websites,
exchanged emails, performed online
transactions, etc. in the previous sessions.
If you want to create websites like the
ones you have seen, you need to learn a
variety of technologies, tools and
techniques. Web designing refers to the skills that are
required to create and manage websites.
Web design as a whole refers to designing
a user interface, authoring (programing)
or a combination of both. Designing a
website requires multiple skills. However,
it is recommended to master and become
skilled in one particular technology once
you get a taste of various technologies
involved.
Following topics are covered in this
module:
•
HTML & CSS
•
Web Authoring Tools, Microsoft
Expression Web
•
Overview of Clientside &
Serverside scripting, JavaScript &
VBScript
Web Publishing
A number of markup languages such as
HTML, DHTML, XML are used to create
web based content. Apart from these,
software products such as FrontPage,
Dream Weaver etc are also used to
develop web based content. Web based
applications are built using technologies
such as ASP (Active Server Pages), JSP
(Java Server Pages), PHP (Hypertext
Preprocessor), ASP.net etc. Understanding HTML
HTML or Hypertext Markup Language is
a language used for created web pages
that can be viewed in a web browser.
Hyper – means active and all over the
place! When you use a Web browser, you
can move all over the place, without a
specified order as to how to access
pages/sites.
Text – You will be working with text files
only.
Markup – To create a Web page, you will
type in the text and then “Mark up” the
text.
Language – This is a method of creating
something or communicating and in this
case, you are creating Web pages using a
particular syntax.
HTML elements are the building blocks of
a website. Web browsers interpret the
tags written in HTML and display a web
page. Hypertext refers to the text that
can be linked to another text or page
which a user can access. Hypertext is the
underlying concept behind the World
Wide Web. HTML is developed and maintained by
World Wide Web Consortium abbreviated
as W3C. When HTML was first released,
there were a handful of tags available
and used for basic web page structures.
As time evolved, several new tags and
attributes were introduced. Popular
HTML versions include HTML 4.01 and
HTML 5.0.
Designing Web pages using HTML
All you need is a text editor such as
notepad to create a web page using
HTML. HTML files have the extension
Page 171 of 240
.htm or .html. You can open the web
pages using web browsers such as Mozilla
Firefox, Internet Explorer, Google
Chrome, etc.
Viewing Source Code
Web browsers have the ability to display
the source code used for a web page. You
can use this to enhance your knowledge
To view the code, do the following:
1.
Open the Web Browser and
rightclick anywhere in the web page
and select View Page Source from
the context menu similar to the one
below:
2.
Notice, the source code of the web
page is visible with different color
codes. The colors have no meaning in
terms of function and are only used to
differentiate different sets of code. Saving a web page
You can save web pages for future reference using
the following procedure:
1. Select File > Save
Page As…
2. Type a file name and
click Save.
SESSION 2: HTML ELEMENTS &
ATTRIBUTES THE BASICS
RELEVANT KNOWLEDGE
When you work with a document, you
create headings, subheadings, tables, etc.
to give the document a structure.
Similarly in HTML, tags or elements are
used to create a web pages’ structure. Look at an example of an online
magazine. Online magazines have
articles with text content, images, videos,
links or continuation to related articles,
advertisements, etc. They appear as a
single web page to visitors. Have you
noticed that the headings are of varying
sizes to indicating topics and subtopics
and different from the content? All this
formatting is possible using combinations
of several HTML elements. Elements & Attributes
Elements have content placed between a
start tag and an end tag. Tags act as
containers for text, images and other
types of content. Tags start an opening
tag and end with a closing tab, using
angle brackets (<>) to define the
structure. Note: To learn to use the tags,
throughout this document, you will find
examples of code displayed within dotted
boxes. Copy it in a text editor, save it in
your local computer and view using web
browsers. Writing your First HTML Code
HTML uses tags enclosed in angle
brackets; most tags are used in pairs such
as <html></html>, etc. Following is a
simple example of HTML code:
<!DOCTYPE html>
<html>
<head>
<title>Learn HTML</title>
</head>
<body>
<p>Hello World!</p>

</body> </html>
Important: Type the code in a text editor
such as Notepad, save it as
“filename.htm” or “filename.html”. To
Page 172 of 240
edit the HTML file, open the file using
notepad and save the changes. In the above mentioned code, there are a
few HTML tags used. All HTML
documents start with <html> and end
with </html>. The rest of the document
contains other elements and web page
content placed using elements.
•
Document type or DOCTYPE is an
element used for indicating the
version of HTML used in a web page.
This is used by the web browser to
apply a set of rules for understanding
the document structure. •
HTML element indicates the start and
end of an HTML document. <HTML>
indicates the beginning of this HTML
document and </HTML> indicates the
end. HTML is also the root of an
HTML document and has two parts,
Head and Body elements.
•
Head element represents the header
section of a document and contains
information about a web page. Head
elements start with <head> and end
with </head>. This element includes
all other elements that need to be
executed or understood before the
content (included in the body element)
is displayed to the user. •
Content placed within the <Title>
and </Title> element is displayed as
the title of a web page and used by
search engines to create indexes of
content. •
Body element represents the section
that contains body content and is
displayed in the web browser. Most
HTML elements are used within the
body element between <body> and
</body> tags. •
If you want to place hidden text in a
web page, you can use the comment
element (<!> and <> tags). Text
placed using comment element will not
be displayed in a web browser but can
seen when viewing the source code.
This is useful to developers or users
who would like to share their
experience in writing HTML code but
hide the text from general visitors. HTML Attributes
Attribute are used to provide additional
information about an element. Attribute
contains values and some elements use
multiple attributes. Nesting
You can nest other elements within
elements. Elements nested within
another element are referred to as a child
elements and the nesting element is
referred to as a parent element. When you nest elements, you need to
Page 173 of 240
ensure the elements are used in proper
order. Observe the correct way of using
opening and closing tags illustrated in the
adjacent figure.
ATTRIBUTES: TEXT
FORMATTING
RELEVANT KNOWLEDGE
Text formatting
You can format the text content of a web
page to make it attractive by using other
HTML elements such as Headings, Bold,
Italics, etc.
Heading: There are six levels of heading
elements from H1 to H6. H1 has the
largest text size and H6 has the smallest
heading text size.
Emphasize: To emphasize a particular
text in a sentence (for example a text that
should be pronounced different), use this
element. Text enclosed within <em> and
</em> are displayed in italics. Italics: If you want the text to be
displayed in alternate voice such as a text
translated from a foreign language,
technical words or present text in
typographic italics, enclose the text
within <i> and </i> elements.
Strong: If you want to emphasize a text
with stronger importance in a sentence,
use the strong element. Text enclosed
within <strong> and </strong> are
displayed in bold.
Bold: To make the text such as keywords
visually bold, enclose the text within <b>
and </b>, the bold element. Underline: To underline the text,
enclose the text within <u> and </u>, the
underline element. Mark: To highlight the text in a
sentence, enclose the text within mark
element : <mark> and </mark>
Big: If you want to display a particular
text in a sentence bigger than rest of the
text in a sentence, enclose the text within
the big element : <big> and </big>.
Small: To display a particular text in a
sentence as smaller than the rest of the
text in a sentence, enclose the text within
the small element: <small> and
</small>. Subscript & Superscript: Text enclosed
within <sub> and </sub> are displayed
as subscripts and Text enclosed within
<sup> and </sup> are displayed as
superscripts.
Pre: Text enclosed using <pre> and
</pre> tags are displayed as it is (in the
example below using a monospace font
such as Courier). INS & DEL: Text enclosed within <del>
and </del> are displayed as struck out
while text enclosed within <ins> and
</ins> is underlined.
Break: To separate single lines or use
multiple line spacing, use the break
element. Breaks between lines are
represented through use of <br>. No
closing tag is needed.
HR: To separate sections, use a
horizontal line to indicate distinctiveness.
Horizontal line is indicated through use
of <hr> element and requires no closing
tag. Sample Code Text Elements
<!DOCTYPE html>
<html>
<head>
Page 174 of 240
</head>
<body>
<p> HTML supports six levels of headings,
H1 to H6 with H1 being the largest.</p>
<h1>Main Heading</h1>
<h2>Sub heading, Level 1</h2>
<p> You are required to <em>agree</em>
with our terms and conditions.</p>
<p> <i>HTML</i> is simple to learn.</p>
<p>It is important to know the common
<strong>HTML
Elements
and
attributes.</strong></p>
<p>This an example of text displayed in
<b>bold</bold>.</p>
<p>This an example of text displayed
<u>underlined</u>.</p>
<p>This is an example of highlighted
<mark>text.</mark></p>
<p><big>Sun</big> is the largest of all
planets with 696,000 KM as it’s radius.</p>
<p><small>Mercury</small> is the smallest
planet in the Solar System ever since Pluto
lost its status and was reclassified as a
dwarf planet.</p>
<p>this is an example of subscript for a
formula, H<sub>2</sub>O</p>
<p>this is an example of superscript for a
formula, (A+B)<sup>2</sup></p>
<pre>
/* Hello World program */
#include<stdio.h>
main()
{
printf("Hello World");
}
</pre>
<p>this is the correct spelling of
<del>entreprenaur</del>
<ins>entrepreneur</ins></p>
</body>
</html>
Referencing Elements
Quote: To include short text such as
name of an author, publisher, etc. in
quotes, use the quote element. You can
also use the cite attribute to indicate the
source. Text included within <q> and
</q> is displayed within quotations. Blockquote: To include lengthy quotes,
include text within <blockquote> and
</blockquote> elements. Cite: To specify a tile of a work such as
title of a book, movie, painting, etc.
include text within <cite> and </cite>
elements. Abbreviation: To include abbreviations
of acronyms, include the abbreviation
between <abbr> and </abbr> elements.
Text included within this element will be
displayed when the cursor is moved over
the text.
Sample Code Referencing Elements
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>HTML Tutorial
<q>Created by Author Name</q>
<blockquote
cite="http://en.wikipedia.org/wiki/Google_A
nalytics">
Google Analytics (GA) is a service offered
by Google that generates detailed statistics
Page 175 of 240
about a website's traffic and traffic sources
and
measures
conversions
and
sales.</blockquote>
<p>You can learn more about web design
at
<cite>
http://en.wikipedia.org/wiki/Web_design</ci
te>
<p><abbr
title="
Hypertext
Markup
Language">HTML</abbr> has several
elements and attributes. </p>
</p>
</body>
</html>
ATTRIBUTES – LISTS & LINKS
RELEVANT KNOWLEDGE
You can list elements to represent
ordered, unordered or definition items.
This could be useful when you want to list
instructions, numbered sets, etc. on a web
page. A sample of what these lists look
like in a browser is given below:
UL: To create a list with no sequence, use
the Unordered List element, the tags <ul> and </ul> represent an unordered list and <li> & </li> represent items in the list. OL: To create a list with sequence, use the Ordered List element, the tags <ol> and </ol> represent an ordered list and <li> & </li> represent items in the list.
Definition: Definition lists are used
when creating lists of terminologies along
with some descriptive text. The definition
term tag is <dt> and the definitions are
paced between the <dd> and </dd>
elements. The List of definitions are
enclosed within the <dl> and </dl>
elements.
Sample Code – Unordered Lists
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>Junk food refers to food items that have
less nutritional value and considered
unhealthy. Health food provides healthy diet
and has high nutritional value.
<ul>Junk Food
<li>Potato Chips
<li>Pizza
<li>Soda
</ul>
<ul>Health Food
<li>Milk
<li>Fruits
<li>Raw or Cooked Vegetables
</ul></p></body></html>
Sample Code – Ordered Lists
<!DOCTYPE html>
<html>
Page 176 of 240
<head>
</head>
<body>
<p>To check if the HTML code works in a
variety of browsers, do the following:
<ol>Instructions to use Mozilla Firefox
<li>Go to
http://www.mozilla.org/en-US/firefox
<li>Select Mozilla Firefox Free download for
desktop
<li>Install once complete
<li>Open the web page in Mozilla Firefox
</ol>
</p>
</body>
</html>
Sample Code – Definition Lists
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>Following are examples of definition
lists. </p>
<dl>
<dt>Pizza</dt>
<dd>Pizza is an oven-baked, flat, round
bread typically topped with a tomato sauce,
cheese and various toppings. An
establishment that makes and sells pizzas
is called a "pizzeria".</dd><br>
<dt>Potato Chips</dt>
<dd> A potato chip is a thin slice of potato
that is deep fried or baked until crunchy.
</dd><br>
<dt>Fruit</dt>
<dd> A fruit is a part of a flowering plant
that derives from specific tissues of the
flower, one or more ovaries, and in some
cases accessory tissues. Fruits are also
used in manufactured foods like:
<ul><li>Cookies<li>Muffins<li>Yogurt<li>Ic
e cream<li>Cakes, and many more.
</ul></dd>
</dl> </body> </html>
Links
Links are used for interlinking to web
pages of other websites, different sections
of a web page, display email addresses,
links to websites etc. Links that are used
within a website are referred to as
Internal Links. These are used when you
want to navigate between pages or link to
text, image, etc. within a website. Links
that are outside a website are referred to
as external links. When using hyperlinks,
you need to provide a path that points to
the resource. You can use:
1. An absolute path contains complete
path details, for example:
◦ http://www.example.com/folder1 /subfolder1/filename1.htm
2. A relative path refers to a folder or
location that is shorter, for example:
◦ index.htm
◦ ../tutorials (previous folder)
◦ /foldername
Absolute paths are used when creating
external hyperlinks as you need to
provide a complete path. Relative path is
more common when you link resources
within a website.
Links are created using the <a> anchor
element and href attribute along with
link to the resource. Text enclosed within
<a href> and </a> are displayed as
clickable hyperlinks. Sample Code – Links
Page 177 of 240
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>Example of an hyperlink that points to
another <a href="page2.htm">page</a>
within a website.</p>
<p>Example of an hyperlink that points to
<a
href="http://www.google.com">Google</a>,
a popular search engine.</p>
<p>Example of an hyperlink that opens the
default email client when clicked to send a
mail to <a
href="mailto:[email protected]">w
ebmaster</a> of example.com</p>
<a href="http://www.google.com"
target="_blank">Example of link that opens
in a new window or tab.</a>
</html>
ATTRIBUTES – TABLES, IMAGES
& MULTIMEDIA
</head>
<body>
<table>
<tr><td>Name</td><td>Age</td><td>C
ity</td></tr>
<tr><td>Anand</td><td>17</td><td>De
lhi</td></tr>
<tr><td>Rohit</td><td>23</td><td>Ban
galore</td></tr>
</table></body></html>
Images
You can include images in your web page
by using the <img> image element. Use
the SRC attribute to specify the location
of the image and width and height
attributes to specify the dimensions of the
image. Also it is a recommended practice
to use the ALT attribute for displaying
text if the image is not downloaded. <!DOCTYPE html>
RELEVANT KNOWLEDGE
<html>
Tables
<head>
You can create a table using the Table
Element. Tables are made of rows and
columns similar to that of a spreadsheet.
Rows are contained within table row
element <tr> and data is stored within
row element <td>. <title>Learn HTML</title>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<img src="HTML5logo.png" alt="HTML
5 Logo, is not displayed due to an error.
Please reload this page or contact the
website administrator" width="300"
height="300"></body></html>
Working with Audio, Video & Flash
Audio: To include an audio clip, enclose
Page 178 of 240
the audio within the <audio> and
</audio> elements and point to the clip
using SRC attribute. To automatically
play the audio, use the autoplay
attribute. To display controls, use the
controls attribute.
Video: To include a video clip, enclose
the audio within the <video> and
</video> elements and point to the clip
using SRC attribute. Also use width and
height attributes to specify the
dimensions of a video clip. Flash: To embed a flash animation, use
the <embed> and </embed> elements
and point to the animation using SRC
attribute. </body>
</html>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<embed src="sample.swf" height="200"
width="320"></body></html>
You can also include videos from other
sources such as youtube.com, etc. To
include a video from youtube.com, do the
following:
Sample Code – Multimedia
1. Go to Youtube.com
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<audio src="pump_im.mp3" autoplay
controls>
Your browser does not support the audio
element.
</audio> </body></html>
2. Select a video clip
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<video src="sample_mpeg4.mp4"
height="320" width="200" controls>
Your browser does not support the Video
element.
</video>
3. Rightclick on the video and select
Copy embed html.
Write the code within <body> and
</body> section (sample below).
.<!DOCTYPE html>
<html>
<head>
</head>
<body>
<iframe width="640" height="360"
src="http://www.youtube.com/embed/v4o
Page 179 of 240
N4DuR7YU?feature=player_detailpage"
frameborder="0"
allowfullscreen></iframe></body></html
>
Radio Buttons: Used for collecting
single value from multiple values. You
should use type = radio attribute for
using radio buttons in a web page.
Now save and open this web page using a
web browser. Checkbox: Used for collecting multiple
values. You should use type = checkbox
attribute for using checkboxes in a web
page.
Note: Refer to Youtube.com FAQ’ for
detailed instructions. SESSION 7: HTML ELEMENTS &
ATTRIBUTES FORMS & FRAMES
RELEVANT KNOWLEDGE
FORMS
Forms contain input elements such as
text boxes, dropdown menus, check
boxes, radio buttons, etc. to collect
information from visitors and sent to a
web server for further processing such as
displaying search results or send to a
database for storage.
Forms are created using <form> element
along with action and method attributes.
Action attribute is used for specifying the
URL to where the data needs to be
submitted. Method attribute is used for
specifying the HTTP method, get or post.
POST attribute is used for storing or
updating a database or for sending emails
and GET attribute is used for retrieving
data. Form element uses text boxes to collect
text information and radio buttons, check
boxes and dropdown menus for collecting
information through predefined options.
Textbox: Singleline text input box is
typically used for collecting shorter text
such as usernames or passwords.
Multipleline text input boxes are used
for collecting lengthier text such as
narrative feedback, etc.
Dropdown: Used for collecting single or
multiple values from a dropdown menu.
You should use the option attribute
along with values to present multiple
options. Submit: Submit button allows visitors to
submit the value.
Reset: Reset button clears all the
selections made.
Sample Code – Forms
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>Subscribe to your weekly
Newsletter</p>
<form
action="http://www.example.com/signup.as
p" method="post">
Name <input type="name" name="Name"
size="30">
Password <input type="password"
name="Name" size="30">
<textarea rows="3" name="Comments"
cols="30"></textarea>
<p>I agree to the Terms and Conditions.
<input type="radio" value="Agree"
name="R1"> Yes
<input type="radio" value="Diagree"
checked name="R1"> No</p>
<p>10th <input type="checkbox"
Page 180 of 240
name="Class_10" value="ON"> 12th
<input type="checkbox" name="Class_12"
value="ON"> Bachelors Degree
<input type="checkbox"
name="Bachelors_Degree" value="ON">
Masters Degree
<input type="checkbox"
name="Masters_Degree" value="ON"></p>
<p>This is an example of Dropdown Menu
(Single Selection)</p>
<p>School Education Board<select
size="1" name="School">
<option>State Board</option>
<option>Matriculation</option>
<option>CBSE</option>
</select> </p>
<p>
<input type="submit" value="Submit"
name="Submit">
<input type="reset" value="Reset"
name="Reset"></p>
</form>
</body>
</html>
Frames
Frames are used to display one or more
pages within a single web page;collections
of different frames are referred to as a
frameset. Frames are used when you
want to display different pages as a single
page in a web browser.
<html>
<frameset cols="25%,50%,25%">
<frame src="sample.htm">
<noframes>
Text to be displayed in browsers that do not support frames
</noframes>
</frameset>
</html>
iframe
iframe or inline frames is an element
used for embedding another document or
an URL with a web page.
<!DOCTYPE html>
<html>
<head>
<title>Learn HTML</title></head>
<body>
<p>You can use iframe to include a web
page.</p>
src="lesson002.htm"></iframe>
<hr>
<p>You can use iframe to view another
website live.</p>
src="http://www.mozilla.org"></iframe>
<hr>
<p>You can restrict scrolling in iframe.</p>
src="http://www.wikipedia.org"
scrolling=no></iframe>
</body>
</html>
ATTRIBUTES –
METATAGS,
DOCTYPES & VALIDATION
RELEVANT KNOWLEDGE
Meta elements are used to provide
structured metadata about a webpage.
Metadata, also referred to as data about
data is used for providing internal
information i.e information that is
Page 181 of 240
understood by web browsers or web
servers. Meta tags are used by web
browsers, search engines or web services. •
Meta tags must be included within the
<head></head> sections.
•
Use name attribute and value author
to include an Author’s name.
•
Use name attribute and value
description to include descriptions.
•
keywords to include keywords.
Keywords are used by search engine to
index later which is used by search
engines to provide results to a visitor.
•
copyright to include copyright details.
Sample Code – Meta Tags
<!DOCTYPE html>
<html>
<head>
<title>Learn HTML</title><meta
name="author" content="First Name, Last
Name">
<meta name="description" content="Learn
about Meta Elements and Attributes">
<meta name="keywords" content="Meta
Element, Meta Attributes, HTML Author
Element">
<meta name="copyright"
content="COMPANY or AUTHOR NAME">
</head>
<body>
<p>Use View Source to view the code as
code placed in header section will not be
displayed in the body section.</p>
</body>
</html>
DOCTYPES
DOCTYPES are declarations used for
providing a formal definition of the
HTML version used in a web page.
Browsers sniff or use this DOCTYPE
declaration to understand the HTML tags
(elements & attributes) used in a web
page. DTD or Document Type Definition
refers to set of markup declarations that
define a standard document type.
You have learnt a variety of HTML
elements and attributes in this module.
Not all elements, attributes or
combination of both is supported by all
browsers; to ensure compatibility, it is
considered a best practice to use
compatible HTML elements and
attributes and also indicate the version of
HTML standard used by a web page
through use of a DOCTYPE. DOCTYPES must be indicated in the first
line of a document as it helps the browser
understand the format used in a web
page. Following are examples of
DOCTYPES:
<!DOCTYPE html>
<html>
<head>
<title>DOCTYPE for HTML5</title>
</head>
<body>
<p>Documents marked with !DOCTYPE
html are considered to be HTML 5
complaint</p>
</body>
</html>
HTML Validation
Though there are a variety of browsers
available, it is important that you test the
code on popular browsers before making
it available on the Internet. If it is not
checked, you cannot be sure of how it will
be displayed to a user using a different
browser than yours. Also note that all
Page 182 of 240
computers will not have the recent
versions of web browsers; some users may
still be using older versions of the web
browsers. It is the responsibility of a
developer to check, verify and confirm if a
website can be published after thorough
testing. There are a variety of tools available for
checking the HTML validity. Some of
them include:
•
Online HTML Markup Validation
Service such as:
presentation format of a web page. While
HTML focuses on structure, CSS focuses
on the presentation. Imagine that you are constructing a
house. All the rooms, windows, kitchen,
hall etc have been built to specification.
But still, it is only after the coats of paint
are given, does the finish and appeal to
the home come. CSS is like the beautiful
coat of paint that you apply to the HTML
structure to make it aesthetically
appealing.
•
http://validator.w3.org Advantages of CSS include:
•
http://browsershots.org •
http://browserlab.adobe.com •
Web Browser extensions:
1. Separate content from presentation
that is easier for developers to work
with.
•
HTML Validator for Firefox (http://
users.skynet.be/mgueury/mozilla/)
•
HTML Validator for Google
Chrome
(h
ttp://robertnyman.com/htmlvalidato/)
•
Use offline software program such
as CSE HTML Validator Lite
(http://www.freehtmlvalidator.com/)
Additional Reading
Though you have learned about basics of
HTML, use the following resources for
enhancing your knowledge on HTML:
1. http://www.w3schools.com/html/def ault.asp
2. http://www.htmlhelp.com/ 2. Use different style sheets to target
different web browsers or devices.
3. Save bandwidth by writing several
lines of presentation code in a
separate style sheet and link to it
multiple pages. 4. Provide customized web pages to users
based on their preferences. Styles can be applied to a web page just
with a click of a mouse. For example if
you have a web page with content using
different HTML elements, you can apply
different styles to all the HTML elements
at once. You can also create multiple style
sheets that can be applied to a web page
on a rotation basis. 3. http://en.wikipedia.org/wiki/HTML SESSION 10: INTRODUCTION TO
CSS
RELEVANT KNOWLEDGE
CSS or Cascading Style Sheets is a
language used for describing the
CONTENT AFTER
DIFFERENT STYLES
APPLYING
CSS Versions
Page 183 of 240
Like HTML, CSS also uses simple syntax
and is easier to learn. CSS has also
evolved over time and popular versions
include CSS 2.1 and CSS3.
<h1 style="fontfamily: Arial; fontsize: 14pt; color: #0000FF">This is heading 1 formatted with Inline Code</h1>
CSS Parts
</html>
CSS has two main parts, Selector and
Declaration that associates rules for
HTML elements. (Refer figure below)
•
Selector specifies the element that
needs to be applied (example: H1)
•
Declaration specifies the parameters
for the selector. Declaration has two
parts, Properties and Values
•
Properties specify the aspects of an
element such as font, color, size,
border, etc.
•
Values specify the value of an aspect.
(example: 14pt, blue, etc.)
Writing you first CSS Code
You can use a simple text editor such as
notepad to create CSS code. You can
integrate the CSS code in a HTML file by
one of the three following methods:
1. Using INLINE Code
<!DOCTYPE html>
<html>
<head>
<title>Inline Code</title>
</head>
<body>
<p>Use View Source to view the code as code placed in header section will not be displayed in the body section.</p><hr>
</body>
2. Referring to an external style sheet
Notice the CSS code is placed within
sections of the web page. •
Embedding CSS Code
<!DOCTYPE html>
<html>
<head>
<title>Embedded Code</title>
<style>
h1
{ font-family: Arial; font-size: 14pt;
color: #0000FF }
</style>
</head>
<body>
displayed in the body section.</p><hr>
<h1>This is heading 1 formatted with Inline
Code</h1>
</body>
</html>
Notice the CSS code is placed with
<style></style> tags. Usually it is
considered as a best practice to place the
code within the header section of a web
page i.e. the <head></head> section.
This is to enable browsers to speed up the
process of applying styles to rest of the
content. If you place the CSS code within
the body, the browser will reload the page
to apply the code resulting in a slower
display of the web page. In this case, you need to add the CSS
Code to all the web pages in a website. Page 184 of 240
<!DOCTYPE html>
<html>
<head>
<title>Embedded Code</title>
<style>
h1
{ font-family: Arial; font-size: 14pt;
color: #0000FF }
</style>
</head>
<body>
displayed in the body section.</p><hr>
<h1>This is heading 1 formatted with Inline
Code</h1>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>External CSS</title>
<link rel="stylesheet" type="text/css" href="CSSExercise001.css">
page with a single line of code. This can
help in saving time by excluding complete
CSS code in all web pages of a website.
Yu can also alter the code in the CSS file
that will automatically get executed when
the HTML page is loaded next time. Style
sheets have the file extension .CSS.
Now change the CSS code,
h1 { fontfamily: Arial; fontsize: 14pt;
color: red }
Refresh the page that include references
this style sheet and notice the results
displayed. Additional Reading
Though you have learned about basics of
CSS, use the following resources for
enhancing your knowledge on CSS:
1. http://www.w3schools.com/css/defa
ult.asp
2. http://www.caniuse.com
3. http://www.css3.info
4. http://en.wikipedia.org/wiki/Cascad ing_Style_Sheets
</head>
<body>
<p>Use View Source to view the code as code placed in header section will not be displayed in the body section.</p><hr>
<h1>This is heading 1 formatted with CSS Code from an external CSS</h1>
</body>
</html>
H1 { fontfamily: Arial; fontsize: 14pt;
color: #0000FF }
In this case there are two documents, a
.htm and a .css file. CSS code is placed
within the .CSS file is linked to a HTML
SESSION 11: OVERVIEW OF XML
& XHTML
RELEVANT KNOWLEDGE
As you learn more about web designing or
development, you need to learn some
other technologies that are used along
with HTML & CSS such as XML &
XHTML. XML
XML or Extensible Markup Language is a
markup language that defines a set of
rules for encoding formats. Unlike HTML,
apart from being used in web pages, XML
is also used for variety of purposes such
Page 185 of 240
as database storage or retrieval and data
exchange. XML is used for separating
data and document structure. people with visual disabilities and read
out the data stored in XML. For example, when you design web sites,
you may display product catalog or
shopping cart to visitors. The details of
the products can be stored locally on the
visitor’s computer in an XML file instead
of storing on the server thereby reducing
the number of trips in between. XML is written as string of characters.
XML document contains markup and
data. XML has a structure similar to
HTML but it does not have any
predefined elements like HTML. You
need to create your own tags. Like HTML
or CSS, you can use a simple text editor
such as notepad to create XML code. XML
code is case sensitive, requires closing
tags and should be properly nested
(unlike HTML). Use of XML
Imagine if you want to send hundred
records of matching products to a visitor
based on a specified keyword for example
books. Here, each record may contain
information on book title, description,
image of the cover, author, publisher,
number of pages, etc. and displaying
these records on a single webpage may
make it difficult for the visitor to scroll up
and down (a single lengthy page!). On the
other hand if you want to display only ten
records a time, you need to send the
request multiple times to the server thus
resulting in increased traffic and
bandwidth usage. In such a case, you can
store the values of all records in a single
file, write some code using HTML or
JavaScript and display ten records at a
time in the visitor’s browser! XML is also useful when you use
incompatible database management
systems. For example, if a company uses
proprietary database software which is
different from the client’s software, they
may encounter issues while sending the
data to their clients. In such cases, XML
can be used to send the data that can be
exported or imported at both ends.
Another advantage is that you can use
any other application other than HTML
to display the data. For example you can
write your own application for addressing
XML Code
1. Type the following code in a text editor
such as notepad.
<school>
<class>11th</class>
<section>A</section>
<rollnumber>01</rollnumber>
</school>
2. XML files have the extension .XML.
Now save this file as intro.xml.
3. Open this file (intro.xml) in a web
browser. Notice the results displayed
(figure below).
Since you need to write your own code,
given below are some of the rules you
should follow:
•
Names cannot start with a number
or punctuation character.
•
Names can contain letters,
numbers, and other characters.
Page 186 of 240
•
Names cannot start with the
letters xml.
•
Names cannot contain spaces
(white space is allowed in data).
•
Elements are extensible (you can
append tags in between).
•
Entity reference such should be
used instead of special characters
such as >, <, &, ‘ & “.
•
Comments can be placed between
<!—COMMENT >.
•
XML documents must have a root
element.
•
XML documents are case sensitive.
•
XML elements require proper
opening and closing tags.
•
Attributes must be used within
single or double quotes.
•
Elements can use multiple values,
attributes cannot.
•
Elements are
attributes are not.
expandable,
XML Today
Many languages are created based on
XML:
•
WAP and WML as markup
languages for handheld devices.
•
RSS languages for news feeds.
•
SMIL for describing multimedia for
the web.
Though you have gone through a
highlevel overview of XML, it is
recommended that you use the following
websites to learn more about XML and
realworld examples:
•
http://en.wikipedia.org/wiki/XML •
http://www.w3schools.com/xml/ XHTML
Extensible HyperText Markup Language
or XHTML is an extension of HTML.
XHTML follows strict rules similar to
that of XML and is used for creating
wellformed HTML documents. All
elements need to have an opening and a
closing tag; some elements that do not
require a closing tag in HTML require a
selfclosing syntax when used in XHTML.
For example, to include break <br> is
used HTML and <br/> is used in XHTML.
You can configure your HTML editor to
add necessary code automatically.
However, you need to specify the
DOCTYPE to be used by the editor. For
example to configure MEW to use
XHTML, do the following:
1. Open Expression Web.
2. Select Tools > Page Editor
Options…..
3. Select Authoring tab.
4. Select the version of XHTML from
Document Type Declaration:
dropdown menu. For example,
XHTML 1.1.
5. Click OK.
6. Select File > New > HTML.
7. Select View > Page > Code.
Notice the XHTML version of XHTML
used along with XML namespace is
automatically included in the web page.
Note: If you have already used a different
version, then you need to add the code
manually. Learn more about XHTML at: • http://en.wikipedia.org/wiki/XHTML
• http://www.w3schools.com/html/html_
xhtml.asp
SESSION 12: WEB SITE DESIGN
Page 187 of 240
SCRIPTING TOOLS
RELEVANT KNOWLEDGE
Web Site Design Scripting Tools
Web site design tools refer to tools used
for web designing and web development
that help in creating interactive and
intuitive websites. These tools save time
as they may contain ready to use,
predefined codes. Some of them help you
edit, debug or manipulate graphics. Some
of the popular tools include Aptana
Studio, Notepad++, Firebug, jEdit,
CSSED, etc.
Scripting Language
Scripting language refers to code written
manually and executed either at client
side (handled by the local browser at the
client end) or server side (handled by the
web server). Scripts help in extending the
functionality that is not possible using
standard HTML or CSS Code. For
example look at a search engine like
Google or train reservation system like
IRCTC; these are designed to cater to
thousands of visitors based on their
request like displaying search results or
seat availability for a particular train.
Though there is a variety of programming
languages used, scripting is broadly
classified into clientside and serverside
scripting. ClientSide scripting refers to scripts or
programs processed by the web browser
at the client’s end. These web browsers
interpret the script and execute them on
the client’s computer. Hence these are
referred to as Clientside scripts.
Clientside scripts are usually embedded
within the HTML code or in a separate
file referenced in HTML and downloaded
along with the HTML files. JavaScript
and VBScript are some of the popular
clientside scripting languages.
ServerSide scripting refers to scripts
or programs processed by a web server.
The script is executed on the server
before the results are sent to the visitor.
This is useful when you need to retrieve
data from a database server and send
only the results to be displayed on a client
computer. It enables the website owner to
minimize user access to source code
(which may be proprietary and also
valuable). Most popular serverside
scripting languages include PHP, ASP,
Java via Java Server Pages, Server Side
Java Script, Server Side VB Script, Perl
CGI, Ruby, Python, etc.
Overview of JavaScript
JavaScript or JS is a popular
programming language used widely on
the Internet for creating interactive web
pages and special effects. JavaScript
provides many exciting features that
cannot be provided through HTML.
Like HTML, JavaScript is understood
and executed by web browsers such as
Mozilla Firefox, Internet Explorer, Google
Chrome, etc. and is therefore referred to
as Clientside scripting.
JavaScript is very user friendly and is
used for purposes such as:
•
Providing popup text to assist
visitors in filling forms.
•
Redirecting to different web pages
or websites.
•
Displaying slideshows, attractive
animations and cool effects.
•
Providing personalized experience
to repeating visitors (by
Page 188 of 240
remembering the items in their
shopping cart, search keywords,
Jobs searched, etc.)
interactive or animated websites.
Typically DHTML uses the following
combination:
1. HTML (for document structure)
2. CSS (for presentation, used for quickly
changing styles)
3. Clientside scripting language (for
interactions or animations from
visitors)
Form with text displayed as popup
message
History
JavaScript was first created in May 1995
by Netscape, now called Mozilla. It was
first called Mocha. In December 1995, the
name JavaScript was adopted. JavaScript
was made into a standard by an
organization called ECMA. Though
ECMAScript is the name of the official
standard, JavaScript is the popular name
being used. Though you had a highlevel overview of
JavaScript, enhance your knowledge on
JavaScript using the following websites:
•
http://www.w3schools.com/js/
•
http://en.wikipedia.org/wiki/JavaScrip
t
•
https://developer.mozilla.org/enUS/do
cs/Web/JavaScript
•
http://www.javascriptsource.com
SESSION 13: OVERVIEW OF
DHTML, AJAX & JQUERY
DHTML is generally used for changing
variables which in turn affects the look
and feel of content. For example visitors
may be allowed to pick a theme for the
website by presenting a dialog box to
choose from a list of themes. Another
classic example is the website navigation
menu presented as a dropdown menu
similar to the ones used in applications
and a ticker that updates cricket scores
time to time. Use samples of navigation menus,
animation effects, tooltips, image effects,
scrolling menus, form effects, etc. from
the following websites:
•
http://www.dynamicdrive.com/
•
http://www.dhtmlgoodies.com/
•
http://www.quackit.com/dhtml/dht
ml_examples.cfm
View samples of DHTML and see the
kind of things that can enhance the look
and feel of websites. If you observe, most
of them are developed using a
combination of HTML, CSS & JavaScript.
Following is a list of URL’s that you can
use for enhancing your knowledge: •
http://en.wikipedia.org/wiki/Dynam
ic_HTML
•
http://www.htmlgoodies.com/beyon
d/dhtml
•
https://developer.mozilla.org/en/doc s/DHTML
RELEVANT KNOWLEDGE
DHTML or Dynamic HTML refers to sets
of technologies used together to create
Page 189 of 240
•
http://www.javascriptkit.com/dhtml
tutors/
DHTML Navigation Menus
You can use attractive navigation
dropdown menus using DHTML scripts or
a product such as DHTML Menu builder
lite that creates the menu for you.
•
Download DHTML Menu builder lite
from
•
http://www.xfx.net/utilities/dmbuilderl ite/download.php
•
Follow the onscreen instructions and
complete the installation.
•
Select Start > Programs > DHTML
Menu builder
XML and JavaScript. AJAX is widely
used today and is implemented through
popular Ajax frameworks such as JQuery,
MooTools, Prototype, YUI Library, Dojo
Toolkit, etc.
JQUERY
JQuery is one of the most popular web
application framework used for many web
applications. You may have noticed fancy
effects such as slideshows, collapsible
tables, etc. in few websites that look
attractive (sample below). Refer to the help file for further
instructions on creating a navigation
menu and to integrate that in your
website.
AJAX
AJAX or Asynchronous JavaScript &
XML is set of techniques used for
developing asynchronous web
applications. Usually data is downloaded
to the visitor’s computer and displayed by
the web browser; when additional data
needs to be viewed, browser sends
request and the response is again
displayed in the web browser. In such
cases, the entire web page will reload to
display the new set of data. For example
when you use an online shopping website,
you may notice the first 10 results are
displayed and when displaying the next
set of results (1120), the entire page
refreshes. In such cases you can write
code to fetch the next set in the
background without interfering with the
display of existing web page resulting in
rich experience for the visitor. AJAX uses a combination of HTML, CSS,
Slideshows
You can use JQuery to produce such
effects. Use the search engine to find
samples or demos of sliders, etc. and refer
to the website for including them in your
web page. Most of them are easy to
implement as the instructions are
straightforward.
Use the following websites to find
samples of JQUERY & AJAX framework,
refer to the website for detailed
instructions on integrating them in your
website.
•
http://jquery.com/
•
http://mootools.net
•
http://prototypejs.org/
•
http://yuilibrary.com/
•
http://dojotoolkit.org/
Page 190 of 240
Note: These website provide complete
tutorials on learning and using them. SESSION 14: INTRODUCTION TO
VBSCRIPT
RELEVANT KNOWLEDGE
Visual Basic Script or VBScript is a
popular scripting language developed by
Microsoft and modeled on Visual Basic.
You do not have to buy a copy of VBScript
from the computer store or install a
VBScript disk on your computer. All that
you do is install the Internet Explorer
(IE) browser, which will support
VBScript. The IE has the VBScript
engine built inside and has the ability to
create Web pages with VBScript. It
provides the functionality that is not
possible through HTML coding. VBScript is a lighter version of the
programming language Visual Basic and
comes with a fast interpreter. It has been
installed by default in every desktop
release of Microsoft Windows 98 and in
the Windows server since Windows NT
4.0 Option pack. Uses of VBScript VBScript is a generalpurpose scripting
language and can be used for both
Clientside and Serverside scripting. It is
widely used among system
administrators who work on the Microsoft
environment and is the scripting
language for the Quick Test Professional
which is a test automation tool. Some
embedded applications which are in use
in the industry (e.g. – industrial operator
interface) also make use of VBScript.
When used for client side web
development, it is similar in function to
JavaScript. i.e. it is used to write
executable functions which can be used in
HTML pages and which interact with the
Document Object Model (DOM) of the
page to provide functionality which
HTML alone cannot give. It is also used
for serverside processing of web pages
and is a prerequisite for Microsoft ASP.
(Active Server Pages). Using VBScript
Consider VBScript as an addon to
HTML. While HTML is used for creating
objects and CSS for presentation,
VBScript is used for manipulating DOM
objects to provide a particular function.
For example you may have designed a
feedback form including fields for First
Name, Last Name, Age, Email Address,
etc. However if you want to display popup
text to guide the visitor to fill the details
properly, you can use VBScript. VBScript is easy and fun to learn. You
can use a text editor such as notepad to
create scripts, save them with the .html
extension and run them using Microsoft
Internet Explorer web browser.
You need to add special tags to indicate
the VBScript code present within the
HTML document. To indicate the
presence of VBScript code, you need to
place the code within <script></script>
HTML tags. The script tag can be placed
in the <head> tag or the <body> tag of
the HTML. Look at the following example:
<html>
<body>
<script
type="text/vbscript">
document.write("Hello
World!")
</script>
</body>
</html>
Page 191 of 240
Notice that in the above example, the
<script> tag has a type attribute which
tells the browser that it’s a vbscript. To
print a text on the webpage use the
document.write() command. The output
on the IE Browser is as follows.
3. Select and expand
Internet
Information Services, select ASP
(figure adjacent).
4. Select OK.
5. Once it is installed, you can test by
typing the URL. For example, type
http://IPADDRESS and press Enter.
(Replace IPADDRESS with the IP
address of the computer where IIS is
installed).
Publishing Content
Though you had a highlevel overview of VBScript, enhance your knowledge on VBScript using the following websites:
•
http://www.w3schools.com/vbscript/ •
http://en.wikipedia.org/wiki/VBScri
pt
SESSION 15: OVERVIEW OF IIS &
APACHE WEB SERVER
RELEVANT KNOWLEDGE
Internet Information Services
IIS or Internet Information Services is a
suite of products for web applications. IIS
includes a web server (hence popularly
referred to as IIS), ftp server, news server
and SMTP service. IIS is included in both client and server
operating systems from Microsoft. IIS
shipped with client operating system is
meant to be used for testing or internal
development purposes. IIS is required for
processing serverside scripts included in
web pages using ASP. To install IIS, do
the following:
Once you install IIS, it creates the
following folder structure \Inetpub\www
root (typically in C:). This folder is used
as the starting point of the website hosted
on this computer. You can copy or publish
web pages into this folder and web pages
in this folder are served through the web
server. For example, if you have a web page
index.htm or index.html, copy the file in
C:\Inetpub\wwwroot (should be like
C:\Inetpub\wwwroot\index.htm). To
access this web page through a web
server, typehttp://IPADDRESS/index.
h
tm
Note: You can also create subfolders and
place content inside them. For example,
C:\Inetpub\wwwroot\SITENAME. To learn more about IIS, use the following
resources:
•
http://en.wikipedia.org/wiki/Interne t_Information_Services
•
http://windows.microsoft.com/enin/
windowsvista/installinternetinfor
mationservicesiis70 1. Select Start > Control Panel >
Programs and Features.
2. Select Turn Windows features on or
off.
Page 192 of 240
Next, Select Install, Select Finish.
Apache Web Server
Apache Web Server or Apache HTTP
Server is the most widely used web server
software hosting millions of websites
across the globe. Apache web server can
be run on Windows though Linux is the
most popular operating system used. To
use, Apache Web Server, do the following:
•
Go to https://httpd.apache.org/.
•
Download Apache HTTP Server.
•
Install Apache HTTP Server by:
•
Doubleclick
httpd2.0.64win32x86no_ssl.msi
•
Click Next.
•
Select I accept the terms in the
license agreement.
•
•
Click Next twice. Use the following
details on Server Information (figure
adjacent).
Type a domain name, for example,
example.com.
•
Type the server name, for example,
www.example.com.
•
Type the email address, for example,
[email protected].
•
Select for All users, on Port 80, as a
service – Recommended.
•
Click Next, Select Custom, Select
•
You need to test the web server once it
is installed. •
Open the web
browser and type
http://IPADDRESS. For example:
http://192.168.2.2. Default home page
should be displayed (figure adjacent).
Publishing Content
Once it is installed, you can view or
modify the path to default content folder.
Configuration for Apache HTTP Server is
stored in httpd.conf located in
C:\Program Files\Apache Group\
Apache2 \ conf folder. Open the
httpd.conf using a text editor such as
notepad and locate “DocumentRoot”
section to view the default content folder. Publish the files to the default content
folder and view through the web browser
(use http://IPADDRESS). To learn about Apache HTTP Server, use
the following resources:
http://en.wikipedia.org/wiki/Apache_HTT
P_Server
http://www.apache.org/
SESSION 16: OVERVIEW OF ASP
RELEVANT KNOWLEDGE
Active Server Pages or ASP is a server
side scripting technology introduced by
Microsoft. Learning ASP is easy as the
technology is based on VBScript. ASP
web pages contain HTML, XML or Scripts
Page 193 of 240
and have the file extension .asp. When a request is send from the browser,
an ASP page is passed to the ASP engine
of the web server such as IIS (Internet
Information Services) and once processed,
the result is returned to the browser for
display. Unlike HTML that displays only
static content (content that does not
change unless modified by the developer),
ASP allows you to add, edit or change
content dynamically on the web page.
Also ASP code is not displayed in the
browser thus making it secure. VBScript is the default scripting
language for ASP and is the most
preferred language for developers who
work with ASP. You can also JScript,
Microsoft’s version of JavaScript or
PerlScript for developing Active Server
Pages. Rightclick, select View Source. Notice the
code displayed. In this case, the web server has already
processed and returned only what is
required for the browser to display. Thus,
for any serverside scripting, the code is
executed at the server’s end and browsers
just need to display only the result (no
support is required at browser’s end for
ASP!).
Today ASP is used in most websites that
require dynamic web pages such as
search engines, online shopping portals,
recruitment portals, etc. Though you had
a highlevel overview of ASP, use the
following resources for learning ASP:
Writing your first ASP Code
•
notepad to create ASP code. To create the
code, do the following:
https://en.wikipedia.org/wiki/Active
_Server_Pages
•
http://www.w3schools.com/asp/
•
http://msdn.microsoft.com/enus/lib rary/aa286483.aspx
Open the text editor and type the
following code:
DOCTYPE html>
<html>
<body>
<%
response.write("My first ASP program")
%>
</body>
</html>
Save this as ASP file. For example,
“intro.asp”. Now open the web browser and type the
complete URL. For example:
http://192.168.2.2/intro.asp. Notice the
results displayed (figure below).
SESSION 17: OVERVIEW OF PHP
RELEVANT KNOWLEDGE
Hypertext Preprocessor (originally known
as Personal Home Page) or PHP is a
serverside scripting language designed
for web development but also used as a
generalpurpose programming language.
PHP is one of the most widely used
languages on the web today; this is due to
the fact that PHP is considered as a free,
opensource alternative to competitive
technology such as ASP (Active Server
Pages). PHP resembles the syntax of C
programming language but made simpler
Page 194 of 240
and easier than C. PHP runs on many platforms including
Windows, MAC, Unix, etc. PHP is
compatible with web servers such as IIS,
Apache, etc. PHP supports using a
variety of databases such as MySQL,
Microsoft SQL, Oracle, Microsoft Access,
ODBC compliant databases, etc. however,
you find that MySQL as the most
commonly used database in most
websites. Like any other Serverside
scripting language, requests are
processed by the web server and only the
results are sent to the browser for
display. Overview of WAMP
WAMP refers to Windows, Apache Web
Server, MySQL and PHP programs
packaged together for ease of installation.
Instead of going through strenuous
procedure for installing and configuring
each component individually, you can use
WAMP to simply the whole task. To use
WAMP, do the following:
WampServer (Notice the icon in the
system tray)
Writing your first PHP Code
notepad to create PHP code. To create the code, do the following:
1. Open the text editor and type the
following code:
<!DOCTYPE html>
<Title>PHP</Title>
<?php
echo 'Hello World';
2. Save this as PHP file (store in root
folder). For example, “intro.php”. 3. Now open the web browser and type
the complete URL. For example:
http://192.168.2.2/intro.php. Notice the
results displayed.
1. Go to www.wampserver.com
2. You will find a single package with a
file name like wampserver2.2ephp
5.3.13httpd2.2.22mysql5.5.2432b.ex
e. 3. Download WAMP.
4. Follow the on screen instructions to
complete the installation.
5. Select
Though you had a highlevel overview of
PHP, use the following resources for
learning PHP:
•
http://en.wikipedia.org/wiki/PHP
•
http://www.w3schools.com/php/
•
http://in.php.net/ Start > Programs >
Page 195 of 240
IT/ITES 308: WEB DESIGNING PART 2
SESSION 1: INTRODUCTION
RELEVANT KNOWLEDGE
Web Authoring tools are tools that simplify
your web page development tasks. HTML
editors, referred to as web authoring tools are
applications that write & check HTML code
for you and help in saving time and effort.
HTML editors are referred to as WYSIWYG
(what you see is what you get) editors. This is
due to the fact that what you see during the
design phase is what you get as an output
viewed in a web browser (or at least very
close to it). Usually, websites are first
designed offline using HTML editors, then
tested, and, later uploaded to websites. Some of the popular HTML editors include
Amaya, Adobe Dreamweaver, KompoZer,
Microsoft Expression Web, etc. Some web
hosting provides provide online tools to
design websites but this usually requires a
highspeed Internet connection. Advantages
provided by HTML editors are:
• Generate Standard Compliant Code:
The developer need not worry whether the
code written conforms to standards such as
HTML 5, CSS3, etc. The editor takes care of
standards.
• HTML & CSS Validation: Each and
every line of code is checked to ensure it is
free of errors and/or standard compliant. • Generate Compatibility Reports: The
editor generates reports based on
compatibility with multiple versions of
varying browsers. • Spell Check: The editor checks for
spelling mistakes in content similar to that of
word processing software. • Optimize HTML: The editor “cleans” out
unnecessary code resulting in smaller web
page size enabling a faster download of the
web page.
• Multiple Resolution / Browser Views:
The editor automatically checks your web
page/website across multiple screen
resolution/sizes (Smartphone, netbook etc)
and also across multiple browsers (Mozilla
Firefox, Google Chrome, etc.). • SEO (Search Engine Optimization):
The editor prepares your website in the
manner that search engines can understand
and thereby helps your website to gain a
better ranking for search results. • Support for Addons: The editors
support 3rd party addons which add
additional capabilities to the HTML editor. • Multiple Publishing Methods: Editors
have the ability to use different options such
as FTP, WebDAV, etc. to publish your
website on remote computers. Microsoft Expression Web
Microsoft Expression Web is a free HTML
editor and web design software product by
Microsoft. One great advantage of MEW is
the ability to create and manage web pages
using HTML, XML, CSS, ASP.NET, XHTML,
PHP and JavaScript. Note: This module focuses only on
Microsoft Expression Web using HTML.
Installing Microsoft Expression Web
To work with MEW, do the following:
1. Download Microsoft Expression Web 4
(recent and last version) from Microsoft.com.
2. Install by following the onscreen
instructions.
3. Click Start > Programs > Microsoft
Expression Web.
The MEW Interface
Page 196 of 240
• Select Site > New Site… (figure below,
left). A New dialog box appears (figure below,
right).
MEW User Interface explained:
1. Menu Area, displays menu items such as
File, Edit, etc.
2. Toolbar Area, displays icons to Menu
Items.
3. Toolbox, contains HTML elements and
ASP.NET items.
4. Task Pane, displays folders, images, etc.
in a website in folder list view.
5. Editing Area, displays the HTML
editing area. 6. Status bar, displays additional document
properties. 7. Style Sheet Area, to manage style
sheets.
8. Attributes & Elements Area, displays
HTML attributes & values and CSS property
and values.
SESSION 2: CREATING
WEBSITES AND WEBPAGES
RELEVANT KNOWLEDGE
Creating a Website
You can create websites with your own
design. When you work with web pages,
images, style sheets, etc., you need to store all
the related files in a single location (folder).
This helps you to:
•
Stay organized •
Upload the entire content to the
remote server when you want to publish the
website.
Note: You will learn about templates later in
this module. To create a new website, • You can create a website with a single
page by selecting One Page Site.
• You can create a website from scratch by
selecting Empty Site.
• If you already have a website created
using HTML or any other software, you can
continue to work with the website using
MEW once it is imported. To import an
existing website, use the Import Site
Wizard.
• Select Empty Site and enter a name for
the website, for example: MyFirstWebsite.
Click OK. • A website is created and you will notice a
window similar to the one adjacent:
Now you can create web pages for this
website. Navigate to the location (example:
My Documents) where you stored the
website. Notice the folder icon. Content such as images, flash animations,
web pages & style sheets, etc. will be
automatically stored in this folder. Create a Web page
Once the website is created, you need to
create web pages. To create a webpage, do the
following:
Page 197 of 240
1. Select File > New > Page…. A window
appears similar to the one adjacent.
2. You can use MEW to create web pages
using HTML or ASP code, Style Sheets (CSS),
etc. Select HTML from the list and Click OK.
Notice that a new page is created (figure
below).
3. Notice the file name Untitled_1.html.
Being the first page of the website, this page
is may be your homepage. Use a standard
naming convention such as default.htm,
index.htm or home.htm and save this page.
To save this page, select File > Save.
4. Type the file name as default and select
Save. You need not specify .htm or .html
extension as it is automatically added to the
web page. Handling File Extensions
HTML Editors such as MEW automatically
append the required file extension, .html by
default. You can configure the HTML editor
to add the extension .htm by the following
procedure: 1. Select Tools > Page Editor Options….
The Page Editor Options dialog box
appears (figure adjacent). 2. Select the Authoring Tab (figure below).
3. Notice the default document type selected
as HTML under Default Document:
dropdown menu and file extension selected as
.html in Default HTML File Extension:
option.
You can change the settings, and, it is
recommended to change Document Type
Declaration to HTML 5.
You can configure expression web to use
external programs such as notepad to open
specific file types such as a style sheet. By
default, style sheets open in expression web.
To modify, do the following: 1. Select Tools > Application Options..
The Application Options dialog box
appears (figure below).
2. Select the Configure Editors Tab (figure
below).
3. Notice the file extensions (left pane) and
application that will handle the extension
(right pane) displayed. Note: Do NOT change any settings here for
now. Working with a Web page
The biggest advantage of HTML editors such
Page 198 of 240
as MEW is that the code is written for you by
the software. • Type the following in the body area
(figure below):
• My Homepage.
• This is a website created using a HTML
Editor.
When you create content, MEW
automatically intends them as paragraphs.
You may notice the paragraph element
indicated (see figure above) as “p” with a box
above around the content. When you use
carriage return (Enter key), MEW inserts
another paragraph similar to that of the word
processing software. Now select the text “My Homepage” and do
the following:
1. Select the Style dropdown located in the
toolbar (figure adjacent)
2. Select Heading 1 <h1> from the list.
3. Now select the text “This is a website
created using a HTML Editor.” Select
Heading 3 <h3> from the style dropdown
list. 4. Once complete, select View (Menu) >
Page > Code (or select Code located above
the status bar). You will see a screen similar
to the one adjacent.
5. Notice the text is enclosed using heading
(h1 and h3) elements. Now save this page
(CTRL+S). Since the editor writes the code for you; you
can stay focused on creating the content
rather than focusing on the code!
If you have noticed, there are prebuilt
standard HTML elements that you can use in
a webpage by just selecting the element from
the style dropdown menu Now to switch back
to design view, select View > Page > Design.
The three views available in MEW are:
1. Design View: This is the default view
and displays only the content.
2. Code View: This is used either when you
want to view the source code written by the
HTML editor or, when you want to insert
elements or code that is not available within
the HTML editor. 3. Split View: This is used when you want
to use both the Design and Code View
sidebyside. Using Multiple Web Browsers
If you want to test your web page, it is a
recommended practice to test using multiple
web browsers. However
you may need to set up
the browser list. To
specify
multiple
browsers, do the
following:
• Select
File >
Preview in Browser >
Edit Browser List….
The Edit Browser List
dialog box appears.
• You may notice that some web browsers
are added to the list by default. If you want
add a web browser (for testing), select Add…,
and specify the path of the executable file of
the web browser (for example: C:\Program
Files\Google\Chrome\Application\chrome.e
xe).
• You can also use set the screen resolution
here. This could be useful when you want to
test your pages for viewing on Smartphones
or tablets that use different screen
resolutions. Page 199 of 240
SESSION 3: TEMPLATES &
IMPORTING WEBPAGES
RELEVANT KNOWLEDGE
Create a new website using templates
MEW includes many (19) builtin templates
that can be used for creating websites. To
create a website using the builtin template,
do the following:
1. Select Site > New Site…
2. Select Templates and choose a template,
for example Organization 5 from the list
3. Type a new for this website, for example:
Company01.
4. Change the location and store this website
in C:\Documents and Settings\Lab\My
Documents\Company01. Then click OK. A
website based on the template Organization 5
will be created (figure below). Notice the
folders and files in the folder list. Now to
work with the website, you can open any of
the files listed here.
• To work on the homepage, doubleclick
default.html. You can change only certain
parts of this web page, because, when you
make websites from templates, MEW uses
DWT (Dynamic Web Template). You will
learn more about DWT in later sessions. The
text is editable within this page
• You can view this website in a browser to
see how it will appear to visitors. To preview
this website in a browser, press F12 on your
keyboard. The website appears on the default
Page 200 of 240
web browser. Use the navigation links on the
left side of the homepage to view other pages. Though it takes some time to get used to an
HTML editor, you will soon be creating web
pages or sites in no time with minimal
efforts. Importing Sites
If you have used another HTML editor or
created files using a text editor, you can
import them into your website. This is useful
when you want to either use MEW HTML
editor (ease of use) or to organize different
files under one common website. You can also
import websites that are already hosted
(running live) using MEW. For example if you
have created files manually and saved in
C:\HTML and you want to import them, do
the following:
1.
Create a New Website and give it a
name, for example: IMPORTWEB.
2.
Select Site > Import > Import Site
Wizard… (figure below)
helpful as your original files are left as it is.
Click Next.
9. Click Finish. A List of files is displayed.
For importing to your new website, you can
select either individual files/folders, or the
entire content of a folder. To import entire
content, select all the items on the left pane
and select
. Notice the results displayed
(Figure below).
Now you can use the imported files. The
original files in C:\HTML are left as is. 3.
The Import Size Wizard dialog box
appears.
4.
Notice the list of values in
Connection Type: dropdown menu. 5.
Select the option File System from
the Connection Type: dropdown menu.
6.
Click the Browse… button and specify
the file path C:\HTML. Click Select.
7.
Click Next.
8. The Import Wizard creates a copy of the
original content in C:\HTML. This can be
Page 201 of 240
In the previous session, you learnt to work
with headings and paragraphs. You can also
work with HTML elements such as listings,
images, tables, etc. in MEW.
Working with Unordered lists
You can create a list using the procedure
similar to the one you used in word
processing software. To create an unordered
list, do the following:
• Create a new page, save this page as
unorderedlists.html. • Type the following text (within quotes):
“An electronic book or EBook is a book
published in digital form. It consists of text,
images, or both. EBooks are readable on
computers, netbooks and Smart phones.
EBooks are available in the following
formats:”
•
Now place the cursor on the next
paragraph.
•
Select Unordered List from the Style
dropdown menu. •
Type the following (press enter after
SESSION 4: LISTS, FORMATING
TEXT, USE SPELL CHECK AND
USE FIND AND REPLACE
RELEVANT KNOWLEDGE
Work with common HTML elements
each entry):
•
DjVu
•
EPUB
•
HTML
•
iBook (Apple)
•
KF8
•
LIT (Microsoft)
•
Check the results in web browser (use
F12 key). •
Switch to MEW and select View >
Page > Code. Notice the code written by the
HTML editor for unordered list (Figure
above). Handling Text
You can align or format the text using the
options in the common toolbar located below
the HTML Editor Menu. This is very similar
Page 202 of 240
to word processing software; however,
remember that being a web page, special code
is needed for formatting and displaying the
text. You can simply select the items from the
toolbar and work as if you work with a
regular document. HTML Editor writes the
code for you! Switch to Code View when you
use the toolbar items to view the source code. Spell Check and Thesaurus
When you focus on creating content, you may
make spelling mistakes. As a solution, HTML
Editor has an inbuilt spell check program.
To do a spell check on the current web page,
do the following:
1. Open a web page with some content.
(Create some content with spelling mistakes
if you don’t have one)
2. Select Tools > Spelling > Spelling (F7)
…. Notice the spell check utility checking
spelling mistakes just as in a word processing
software.
You can also use the builtin Thesaurus
option by selecting Tools > Thesaurus. Find and Replace (Text)
If you want to replace a misspelled author or
company name across a website, what would
you do? You can use the find and replace
dialog box to replace text either on a single
web page or across an entire website. The
functionality is very similar to a word
processor. To find a particular text, do the
following:
•
Select Edit > Find. The Find and
Replace dialog box appears (figure adjacent).
Notice the tabs one for find another for
•
To search for a particular keyword
across all pages in a website, enter a keyword
in the Find What: text box and select Find
All…. See the results. Doubleclicking on any
item in the listed result automatically opens
the corresponding web page with the keyword
highlighted for further action.
Now explore and the Replace tab to replace
an existing text. Find and Replace (HTML Tags)
If you had initially set a table background
color as blue and now want to replace it with
another color, what do you do? Use the
HTML tab of the Find and Replace feature!
Using this, you can replace attributes, values
or even a tag across a website. To use this
feature, do the following:
•
Select Edit > Replace.
•
Select the HTML Tags tab. •
Select the appropriate option from the
Replace action: dropdown menu. Note the
replace and a third for HTML tags.
list of actions that can be performed
SESSION 5: TABLES AND CELLS
Page 203 of 240
RELEVANT KNOWLEDGE
Working with Tables
MEW simplifies the tough task of creating a
table using HTML with many rows and
columns. To create a complex table, do the
following:
1. Create a new page, save this page as
tables.html. 2. Switch to Design View. Place the cursor
where you want to position the table.
3. Select Table > Insert Table…. A dialog
box appears similar to the one adjacent. 4. Here you can specify the number of rows
and columns, border size, border color etc. Do
the following:
• Type 10 in Rows under Size section.
• Type 10 in Columns under Size section.
• Type 3 in Size under Borders section.
• Select Maroon from Color dropdown
menu under Borders section.
• Click OK.
1.
Imagine how many lines of code you
would have typed to have such a result! Now
to view the HTML code, select View > Page
> Code.
2.
Switch to Design View. To create
borders for cells, select all the cells in the
table.
3.
Select Table > Table Properties >
Cell…. The Cell Properties dialog box
appears (Figure below).
4.
In
the Borders section, type 1 in Size: and
select Olive from Color: dropdown. Click OK.
5. Save the page and view in browser (F12).
MEW creates style sheet codes and placed
them within this webpage by default. Now
switch to code view, scroll to the top and see
the code available under <style> and
</style> element. Now scroll down and see
the style applied to the table and cell. So
much time and effort has been saved!
Merging and splitting cells
You have created table structures like the
one adjacent in word processors. But for a
web page, you will need to write a lot of code
to achieve the same!
Using a HTML editor, it is easy. All you need
to do is:
mergetables.html.
• Insert a table (for example, 2 rows and 2
columns). • Select the cells that you want to merge
and then select Table > Modify > Merge
Cells.
• Similarly, to split cells, select a single cell.
Select Table > Modify >
Split Cells…. The Split
Cells dialog box is
appears (figure adjacent).
• To split this cell into
five rows, select Split
into rows and type 5 in
Number of Columns:. Click OK. Note, the
entire table is auto adjusted to fit content. • Now switch to Code View and see the
code under <style> and </style>. Scroll to
see the style applied to this table. Using image background for cells or
tables
You can place images as a background for
cells or tables. To include a image
background for a cell, do the following:
•
Create a new page, save this page as
imagetables.html (You need not type the
extension). •
Insert a table (minimum 2 rows and 2
Page 204 of 240
columns). Place the cursor in the cell where
you want the background.
•
Rightclick and
select Cell Properties.
•
Under Background, click Browse…. •
Locate and select an image, click
Open and then click OK. Note the cell
includes an image background (Figure
above).
•
Save and preview this in a web
browser (F12).
Working with Cell or Table Size
Usually a table spans the entire screen and
that may not be appealing to the eye. Also,
sometimes you may want to specify a size for
a cell or table (for example, to display photos).
Using MEW, you can specify the size of a cell
or the table. To restrict the size of a cell, do
the following:
1. Place the cursor in the cell to which you
want to set a particular size. Rightclick and
select Cell Properties. You can specify the
size in pixel units or percentage. 2. Under Layout, select specify width: and
type 100 (In pixels).
3. Select specify height: and type 200 (In
pixels) and then click OK. Notice the size of
the cell. Converting Table to Text
You can also convert the contents of a table to
text using the Table to Text option in HTML
Editor. Explore and convert table to text and
observe the changes in code.
positions within a web page. HTML editors
enable you to easily place images with
formats such as GIF, JPEG, PNG and BMP.
To insert a clipart or image, do the following:
images.html. • Select Insert > Picture > Picture from
file… (figure above).
• Browse and select a picture from your
computer, Click Insert. The Accessibility
Properties dialog box appears (figure
adjacent).
• Specify the text (ALT attribute) in
Alternate Text:, for example, type Sample
Image for Demo. And then click OK. The
image is inserted in the web page!
• Click Save. A Save Embedded Files
dialog box appears. MEW saves a copy of the image within this
website folder. Remember this is the website
that may be published to a remote computer
for visitors. The image on your computer may
not be accessible to them if the HTML page
and the image are in different locations. So,
you need to save the images within your
website to ensure that the image stays along
SESSION 6: IMAGES
RELEVANT KNOWLEDGE
Inserting images
As you know, it is not an easy task when you
have multiple images to be placed in varying
with the website. HTML editor also enable you to save images
in different formats. This helps when you
Page 205 of 240
want to change the image format to one that
is suitable for websites. Also by optimizing
the image size (by optimizing quality), you
reduce file size resulting in faster downloads
of images from your website. To change image format and/or optimize
quality, click on Picture File Type…. The
Picture File Type dialog box appears. • Select GIF if you are inserting an image
with solid colors.
• Select JPEG for high quality images such
as photographs from a digital camera. The
quality can be adjusted only for JPEG
formats.
• Select PNG24 if you are using
illustrations or screenshots. • Select JPEG for this exercise. Uncheck
Use image as is: and specify a value. For
example, to retain 75% of the original quality,
type 75 in Quality: and click OK twice.
Note: If you are using image editors such as
Adobe Photoshop, JPEG images are
automatically optimized for quality and size.
In such cases, leave the image quality as it is.
Working with image formats requires special
expertise, consult an expert if required. Now this image is saved within this website.
Note the image file listed in the folder list.
Remember, what you have here is a copy of
the original image. So even if something goes
wrong with image quality, size or both, you
can rework again! Changing Image properties
If you want to change properties after
inserting the image, do the following:
1. Doubleclick on the image. You can use
the Picture Properties dialog box (Figure
below, left) to specify or change settings. • To change size of this image, select
Appearance tab (Figure above, right).
• To reduce the image to 50% of its original
size, select In Percent and type the value 50
in both width: and height: fields. Click OK.
Notice the adjusted size displayed. Preview
the change in a web browser (F12). Notice
the value in alternate text is also displayed.
Now switch to MEW and see the code written
for this image element. When you work with images that are
Page 206 of 240
relatively huge (covering the whole screen),
you can make smaller versions of the image
(thumbnails) which when clicked, displays
the image in actual size.
This helps make the website with several
images look pleasant and not crowded. HTML
editors have the ability to automatically
create thumbnails and link them to the
actual size images. To create thumbnails, do
the following:
multipleimages.html. • Select Insert > Picture > From File….
• Select multiple pictures by using Ctrl +
Click (you need at least 34 large size
pictures for this exercise).
• Select Insert. Skip providing alternate
text for now, you can add it later. Click OK
once for each image. Notice the size of the
images.
• Now select the image, rightclick and
select Auto Thumbnail. Repeat the
procedure for rest of the images.
• The thumbnails are displayed in the web
page. Click File> Save. HTML editor again
attempts to save the images and the following
dialog box appears:
• Note there is a set of images with _small
added to the original filenames. These are the
thumbnail versions created by the HTML
editor. Click OK. Now preview this web page
(F12). Notice the results. Each image is
displayed as a thumbnail which when clicked
displays the larger version of the image.
•
Switch to MEW and view code. Modifying thumbnail size
All the thumbnail images have a standard
size. This is the default setting of the HTML
Editor. You may need to increase the default
thumbnail size if it is too small for images
such as photos or if you are unable to
differentiate between the small size images.
To modify the thumbnail size, do the
following:
1. Select Tools > Page Editor Options.
2. Select AutoThumbnail tab. Note the
default values. You can change the size by
altering the values.
Once changed, thereafter, the modified size is
used when you create auto thumbnails (older
thumbnails will remain the same based on
the original thumbnail size). Handling Larger Images
If large versions of many images are
displayed in the same window, visitors may
find it unpleasant to move back and forth to
view images! As a solution, you can make the
images open up in a new window. To do so:
1. Rightclick a large image and select
Picture Properties. Page 207 of 240
2. In the Hyperlink section, select the
button next to Target Name… The
Target frame dialog box appears.
3. Select New Window from the Common
targets: list and click OK twice. Save this
web page to include the changes and preview
this in browser (F12).Now click on the first
thumbnail and observe the difference in
behavior.
4. Switch to MEW and view code. Aligning Images
You can also align images along with text
content (similar to alignments in word
processing). To align, to the following:
textwrap.html.
• Insert an image and enter some text
above or below the image. • Select Image and right click and select
Picture Properties. • Select the Appearance tab. Then select a
wrapping style to wrap text.
• Select a value from the Alignment:
dropdown (if required).
• Specify a border for the image by entering
a value in Border Thickness: field.
• Click OK. Save and preview this in your
browser (F12). Also, see the source code for
this activity.
Editing Images
You can edit images using the builtin image
toolbar when you want to crop an image,
adjusting brightness or contrast of an image,
etc. To work with an image using the image
toolbar, do the following:
editimage.html • Insert an image and Select View >
Toolbars > Pictures. The Picture Toolbar
will be displayed (Fig.below).
1. You can use a variety of functions such
as:
• Flip pictures using different flip options
.
• Increase or decrease brightness or
contrast.
• Crop (keep only the necessary portion of a
picture).
2. To crop, select the crop tool (
). Now try
and crop the image (same as in any other
software you have worked with).
3. Save and preview this in your browser
(F12). Also see the source code for this
activity.
Working with Image Formats
When you insert images, HTML editor is
configured to use GIF format for images that
have 256 colors or lower and JPEG format for
images that have more than 256 colors (it is
intelligent!). At times, you may need to
change this default behavior (to use PNG
when you are creating content with mostly
screenshots of products or images with
focused color). To view or modify this setting,
do the following:
1. Select Tools > Page Editor Options…
and select the Picture tab.
2. Notice the values in dropdown menus
(gif and jpg). You can change the format by
selecting a image format from these
Page 208 of 240
dropdown menus. For example, to force the
HTML editor to use PNG as the image format
when images with 256 color or higher are
detected, select PNG from Use the following
format when converting or pasting
images with more than 256 colors:
dropdown menu.
3. Click OK.
To test, do the following:
1.
Create a new page.
2.
Use Ctrl + Print Screen on your
keyboard to take a screenshot.
3.
Save the page.
4.
Notice the image format displayed
with the extension of PNG. Creating & Optimizing Images
If you want to create, edit or optimize images,
consider using professional photo editing
software such as Adobe Photoshop, GIMP
(Open Source), Microsoft Expression Design
(Freeware), Google Picasa or Online editors
such as Pixlr (www.pixlr.com).
SESSION 7: HYPERLINKS I
RELEVANT KNOWLEDGE
Working with Hyperlinks
It is easy to write code when you have a few
embedded links. But, when there are many
links to be included in a web page (image a
large organization having 100’s of web pages
that need to be connected), it will be difficult
to code manually. Here, you can use HTML
editors to simplify the task.
Hyperlinks to Websites
To work with hyperlinks in HTML editor, do
the following:
links.html. • Type the URL, for example
www.google.com. Press Enter. Notice the
text is automatically formatted and displayed
as a hyperlink.
• Save and preview this in your browser
(F12).View the source code for this activity.
If you want to change the text from URL, do
the following:
• Switch to MEW and place the cursor on
the text that has the hyperlink.
• Rightclick and select Hyperlink
Properties…. The Edit Hyperlink dialog
box appears.
• In the textbox Text to display:, replace
www.google.com with Google. Click OK.
Notice the text changed in the hyperlink (the
link is still available).
To insert a hyperlink manually to point to
Wikipedia, do the following:
manuallinks.html and place the cursor
where you place the hyperlink.
• Select Insert > Hyperlink…. (Or use
shortcut CTRL+K). The Insert Hyperlink
dialog box appears.
• Enter Wikipedia in Text to display:
textbox (this will be name that will be
displayed). • To include helpful tips indicating the
purpose of links which will be displayed when
the cursor is placed over the hyperlink, select
the ScreenTip… button. The Set Hyperlink
Page 209 of 240
ScreenTip dialog box appears.
• Type Use Wikipedia to learn more.
Click OK.
• Type http://www.wikipedia.org in
Address: and click OK.
Save and preview this in your browser (F12).
Observe the results (Move your mouse over
the hyperlink). Switch to MEW and view
code.
Hyperlinks to an email address
emaillink.html and place the cursor where
you place the hyperlink.
2. Select Insert > Hyperlink….. The Insert
Hyperlink dialog box appears. 3. Select Email Addresses.
4. Type Feedback in Text to display: (this
will be name that will be displayed in the
browser). 5. Type an email address in EMail
address:
(for
example,
[email protected]). Notice the mailto:
attribute is automatically added.
6. Type a value in Subject: (for example:
Feedback for website). This helps you trace
where the mail came from especially when
you are using a single email address for
multiple purposes. It is recommended that
you use a separate email address for
collecting feedback from visitors. 7. Click OK.
(F12). Notice the default email client is
opened, email address and subject is
automatically added leaving the email body
empty for visitors to send their comments or
feedback. Link to different sections within a web
page
You can link to different sections within a
webpage using HTML editor. To understand
the procedure, do the following:
sectionlinks.html. 2. Create at least two sections in the HTML
document (leave adequate space between
sections, at least 10 lines between them). For
example, Section 1 & Section 2 (Figure
below).
3. Select (highlight) the text Section
4. Select Insert > Bookmark…. The
Bookmark dialog box appears (Figure above,
right).
Note: Leave some space at the top of the
page.
Select Insert > Bookmark…. The
Bookmark dialog box appears (Fig. above).
• Notice the name in Bookmark name: list.
MEW automatically creates the bookmark for
you. Click OK. Repeat the procedure to
bookmark all sections. • Now scroll to the top where the links will
be placed.
Page 210 of 240
• Select Insert > Hyperlink…. Select
Place in this document… under Link to:.
• Now type Section 1 in Text to display:.
Select Section_1 under Bookmarks, Click OK.
(or use CTRL+G to bookmark).
•
select only web pages. Now select
tables.html from this list, type Tables in
Text to display: and click OK.
(F12). Check if the hyperlink is working by
clicking on it. Switch to MEW and view code.
SESSION 8: HYPERLINKS II
RELEVANT KNOWLEDGE
• Repeat the procedure to include hyperlink
for Section 2. Save and preview this in your
browser (F12). Check if the hyperlink is
working by clicking on it. Switch to MEW and
view code.
Note: If you notice the hyperlinks are not
functional though you are following the
proper procedure, it may be due to
insufficient space between the main text that
has hyperlinks and the sections with the page
(too close to scroll up or down). Link to another web page within a
website
You can link a web page to other web pages
within the site. This helps visitors view other
sections of your website that may have
information on products or service that you
offer. To link other pages within a website, do
the following:
Note: You will use the HTML files created
earlier. • Create a new page, save this page as
weblinks.html and place the cursor where
you want to place the hyperlink.
• Select Insert > Hyperlink…. Select
Existing File or Web Page under Link
To….
• Notice the list of files displayed in your
website. You can choose ANY file including
images. To link to other web pages, you must
Link using Images
You can also create links using images
enabling you to use attractive buttons or
images as hyperlinks.
manuallinks.html. • Insert an image. Select the image, select
Insert > Hyperlink….
• Type http://www.download.com.
• Generally hyperlinks open within the
same window which the visitor is viewing. If
you do not want the visitor to leave your
website, you can set the target frame
property to open the hyperlink in a new tab
or window. To open the hyperlink in a new
window, select Target Frame…. • Select New Window and then click OK.
browser (F12). Check if the hyperlink is
working by clicking on it. Switch to MEW and
view code.
Note: Images with hyperlinks display text
such as one below (Use Ctrl + Click if you
want the destination web page to open in
HTML editor). This helps you to identify
images with hyperlinks when you work with
HTML editors. Using interactive buttons
You can use fancy buttons to display
hyperlinks instead of mundane text or heavy
images. To insert interactive buttons, do the
following:
buttonlinks.html. 2. Select Insert > Interactive Button….
The Interactive Buttons dialog box appears.
Page 211 of 240
• You can choose a style from buttons: list.
For example, select Glass Capsule 1 from
list. • Replace Button Text in Text: with a
name. For example, Mozilla.
• Type the URL in Link:. For example,
http://www.mozilla.org.
3. Click OK. Save and preview this in your
browser (F12). Note: You need click OK every time you are
prompted, to save the images. 4. Check if the hyperlink is working by
Use Hotspots
Hyperlinks can be used on portions of a
single image thereby creating clickable
hotspots, when you want to link portions of
the image to resources such as to a web page,
website or email address. To create hotspots,
do the following:
hotspots.html. 2. Insert an image (use an image that can be
used for pointing out different portions such
as world map that has continents).
3. Select View > Toolbars > Pictures.
Picture toolbar appears (Figure below). Note: Move your cursor over each icon to
understand the purpose of each item. • Select Rectangular Hotspot from Pictures Toolbar. Place the cursor
(displayed like a pencil), drag over a
particular area to draw a square or rectangle
(this entire area will become a hyperlink).
• Once complete, the Insert Hyperlink
dialog box will be displayed. • Type the URL in the Address: and Click
OK.
(F12). Check if the hyperlink is working by
SESSION 9: AUDIO & VIDEO
RELEVANT KNOWLEDGE
Working with audio & video content
You have learnt to include audio & video
content in the HTML module. You can also
use HTML editor to include audio & video
content. Note: You can also use HTML 5 audio &
video elements. Use Code View to insert the
code. Also keep samples of audio and video
clips ready for these exercises.
To include an audio clip, do the following:
a) Create a new page, save this page as
audio.html. Place the cursor where you
place the audio player control.
b) Select Insert > Media
> Windows Media
Player…. Note: MEW by default lists
only files that are
associated with Windows
Media file types. Select All
files from Files of Type:
dropdown. a) Select the audio clip, for
example: sample.mp3.
Click Insert.
b) Click Save (Save this
audio clip with your website when prompted).
Notice the result displayed in MEW. c) Save and preview this in browser (F12).
Note: Audio clip by default plays
automatically when the page is accessed. If you want to customize the settings for this
audio clip, do the following:
a) Switch to MEW and doubleclick the
Windows Media Player Control. The
Windows Media Player Properties dialog
box appears. Note the available controls (Fig.
below). Page 212 of 240
d) Save and preview this in your browser
(F12). Switch to MEW and view code.
If you want to include videos, for example,
from Youtube.com, do the following:
a) Create a new page, save this page as
Youtube.html. b) Place the cursor where you place the
Youtube video.
Note: You need to follow the procedure before
you insert videos from Youtube. c) Go to Youtube.com.
d) Select a video clip.
b) For the content to play, CODEC (a e) Rightclick on the video and select copy
software component required for playback) embed html.
must be available on the visitor’s computer f) Select View > Page > Code. and if it is not available, you can include the g) Paste the code (example: <iframe
source using CODEBASE attribute. Visitor’s width="640" height="360" src="http://
browser will download the CODEC from the www.youtube.com/embed/ieM93xFIGCc?
URL specified in CODEBASE: attribute of feature=player_detailpage" frameborder="0"
Object element, install and play the content allowfullscreen> </iframe>)
h) Save and preview this in your browser
automatically. Note: Refer to respective website for correct (F12). Switch to MEW and view code.
URL. Some of the common URL’s are Note: You need to have an active Internet
connection for this exercise.
provided here for your reference:
Working with Silverlight Content
Silverlight is an application framework for
writing rich internet applications similar to
that the ones created using Adobe Flash. Rich
internet applications are web applications
Download Location
that look and work similar to that of
http://www.apple.com/qtactivex/qtplugin.cab
standard desktop applications such as
Time (MP4)
http://www.apple.com/qtactivex/qtplugin.cab
accounting software, word processing
(SWF)
http://fpdownload.macromedia.com/pub/shockwave/cab
software, image manipulation software, etc.
s/flash/swflash.cab#version=8,0,0,0
Silverlight content is played using Silverlight
•
Repeat the procedure for including plugin a free download. video clips. Save and preview this in your Note: Silverlight content can be played only
browser (F12). Switch to MEW and view code. on Microsoft Windows operating systems,
Working with Flash animation
MAC OS and Symbian OS. You can use
If you want to include a flash animation, do Moonlight, a free plugin to view content on
the following:
Linux based computers. a) Create a new page, save this page as
flash.html. b) Place the cursor where you place the flash
animation. Select Insert > Media > Flash
Movie….
c) Locate and select the flash animation (file
with .swf extensions), select Insert.
Page 213 of 240
If you want to include Silverlight content on
your page, do the following:
silverlight.html. • Place the cursor on the Silverlight
content. Select Insert> Media> Silverlight.
The Select Silverlight XAP file dialog box
appears.
• Silverlight files have the extension .XAP.
Browse, select & Open the file.
• Save and preview this in browser(F12).
Notice the Silverlight content displayed in
the browser (if the plugin is available).
Switch to MEW and view code.
• You can use Powerlight Converter,
PPTX2Silver Light Converter, etc. to convert
a presentation to simple Silverlight content. the HTML pages created in earlier activities
and click OK.
• If you want the HTML editor to create a
new page for rest of the frames, select New
Page…. • Select File > Save (CTRL+S). You will
have to save each new page that is a part of
this frame. Preview this in your browser
(F12). Switch to MEW and view code. If you want to edit or work with individual
web page in a frame, it is recommended to
open each file separately (open by the file
name from the folder list). Once complete,
open the frames.html in the HTML editor or
web browser. iframe
You have learnt to use iframes using HTML
code. You can also create iframes using MEW
with minimum efforts. To insert an iframe, do
the following:
SESSION 10: FRAMES, INLINE
FRAMES AND LAYERS
RELEVANT KNOWLEDGE
Frames
You have learnt to use frames using HTML
code. MEW includes few frame styles that
you can use right out of the box. To create a web page using builtin frames,
do the following:
• Select File > New > Page….
• Select Frames Pages. A list of frames
with different styles is displayed.
• Select Header, Footer and Contents
from the list and Click OK. Notice the results
displayed.
• If you want to use the existing HTML
files, select Set Initial Page…. Select any of
Page 214 of 240
Address: and click OK.
(F12). Switch to MEW and view code. To modify the appearance of an iframe, select
the iframe and doubleclick on it. The Inline
Frame Properties dialog box appears
wherein you can modify the size, include
margins, align text, disable scrollbar or
provide alternate text.
Layers
Layers are advanced techniques that you use
to float content on top of other content in a
web page. You use this when you want to
include a popup registration form or menus
when a visitor views a web page. Layers can
also help in keep content such as image or
dropdown menus fixed in a particular
position in a web page. Layers are managed
using a special element called DIV. To insert
layers, do the following:
layers.html.
• Select Format >
Layers. The Layer
Toolbar appears.
• From the toolbar,
select Insert Layer
. A new layer is
inserted similar to
the one below.
iframe.html. • Place the cursor where you want the new
iframe to be placed. Select Insert > HTML >
Inline Frame. Notice a new frame is
inserted within this page.
• Select Set Initial Page…. Type
http://en.wikipedia.org/wiki/Iframe in
• this elsewhere, simply drag the entire
layer box. • You can increase or decrease the size of
this layer by selecting the layer box and drag
around the corner. To place
• Now insert an image in this layer:
a)
Place the cursor inside the layer.
Select Insert > Picture > From File…
b)
Locate and Insert the image. Notice
the picture is within the layer. • Now type some content in the web page.
Now type some content in the web page.
Notice the image present in the layer does
not move along with the content and stays in
the position that you fixed. Page 215 of 240
Note: Layers are an advanced concept and
require additional practice to understand. You can place
multiple layers on
top of each other
(Figure below).
This is done by
inserting and
positioning
additional layers. Use
the Layer toolbar to
insert
additional
layers. To use the toolbar to position layers, do the
following:
1. Select View > Toolbar > Positioning. 1. Insert an HTML element in the body, for
example: a table with 2 rows and 3 columns
and select the Table.
2. Select position: fixed from the
dropdown.
3. Notice the values in positioning toolbar
indicated in pixels. 4. Now try typing content in this web page.
Notice the table is in a fixed position.
Note: It will take a while to work with
positioning and particularly CSS. Use help
file and search engines for more examples. SESSION 11: HOVER EFFECT,
META
ELEMENTS
&
WATERMARK
RELEVANT KNOWLEDGE
You have learnt to use HTML elements and
attributes such as Title, Description,
keywords, etc. using HTML code. You can
also use the HTML editor to include such
elements easily. Note that the settings
modified here apply only to the current page. • Create a new page, save this page as
meta.html. • Rightclick on the body, select Page
Properties. The Page Properties dialog box
appears.
• You can specify the Title in the Title: text
box. Enter details about the website in Page
Description: textbox and use keywords for
this website using the Keywords: textbox.
Now type:
• Webpage created using HTML editor in
Title:
• We offer great web designs in Page
Description:
• Type Web Page Development, Web Design,
Website Development in Keywords: • Click OK.
• Save and preview
this in your browser
(F12). Switch to MEW
and view code.
Notice the HTML
elements and content
inside elements have been created
automatically by MEW! Modifying background
You can also specify a color or image
background for a web page. To set a
background color, do the following:
1. Select View > Page > Design.
2. Rightclick on the body and select Page
Properties.
3. Select the Formatting tab.
4. In the Colors section, select Silver from
the Background: dropdown menu.
5. Click OK. 6. Save and preview this in your browser
Page 216 of 240
Modifying appearance of links
You can also modify how links appear in a
web page. To apply hover effects, do the
following:
hover.html. Insert at least two or three
hyperlinks.
• Rightclick on the body, select Page
Properties. Select Formatting tab.
• Select the following values in the Colors:
section:
◦ Green for Hyperlink:.
◦ Silver for Visited Hyperlink:.
◦ Maroon for Active Hyperlink:.
◦ Teal for Hovered Hyperlink:.
browser (F12). Switch to MEW and view code.
Inserting a watermark
You can include a watermark for a web page
when you want to inform visitors that you are
still testing the website or it is under
development. To include a watermark, do the
following:
watermark.html. 2. Rightclick on the body, select Page
Properties. Select the Formatting tab.
3. Select Background Picture under
Background. Click browse:, select the
image you want as a watermark and then
click OK.
4. Check Make it a Watermark and click
OK.
5. Type some content in the webpage (at
least one or two pages in length).
(F12). Now scroll down the page and notice
the background is in fixed position and does
not move along with content. Switch to MEW
and view code.
Changing the margins
You can also adjust the margins of a web
page while designing the page. Doing so
leaves some space on either sides of a
webpage where you may want to place
advertisements later on. To adjust the
margin, do the following:
margin.html. 2. Rightclick on the body, select Page
Properties. Select Advanced tab.
3. To specify the margin size (in pixel units),
type:
1.
30 in Top Margin:.
2.
60 in Left Margin:.
3.
60 in Right Margin:.
4.
30 in bottom Margin:.
4. Type some content. Save and preview this
in your browser (F12). Switch to MEW and
view code.
Specifying the language
You can also specify the language the web
page is created with. This information is used
by search engines to index and display
language specific results to visitors, by screen
reader software to understand the language
of the content used in a web page, by
automated translation tools that translate
web pages from one language to another and
so on. To specify a language, do the following:
lang.html. 2. Rightclick on the body, select Page
Properties. Select Language tab.
3. Select English (India) under Mark
current document as: dropdown menu.
4. Click OK. Save and preview this in your
Page 217 of 240
browser (F12). Switch to MEW and view code.
Note: You may not notice any visual
difference in web page as this is used only by
search engines, screen readers or browsers
for internal use. SESSION 12: FORMS
RELEVANT KNOWLEDGE
Creating forms
You have learnt to create forms using HTML
code. As you are aware, forms are used for
collecting information from visitors or for
displaying relevant results to visitor. You can
include forms in a website using the HTML
editor. To create a simple
HTML form, do the
following:
1. Create a new
page, save this page
as form.html. 2. Select Insert >
HTML > More HTML Tags…. The HTML
Toolbox is displayed, scroll down and expand
Form Controls (Figure adjacent). 3. To create a form, first you need to add the
form control. To add the form control, select
Form from the Form Controls list. 4. Click and drag from the toolbox to
the web page where you want to place the
form. You need to add elements to make this form
functional. There are a variety of form
controls available with this HTML Editor.
For example you can use textbox element to
collect a visitor’s email address. • Select Input (Text) from Form Control
List. Drag and drop it inside the form area
(Figure below, left).
• You need to indicate the user the purpose
of this field. You can do that by
doubleclicking on an element. Doubleclick
the Input (Text) field that you just inserted.
Text Box Properties dialog box appears
(Figure above, right).
• If you have multiple fields in a form, they
will be easy to locate and understand if you
have friendly names assigned to it. To add a
name, type Email in Name:.
• To indicate the purpose of this field, type
a value in Initial Value: field. This will be
displayed initially but can be replaced by
visitor’s email address. Type Enter your
email address in Initial Value: field.
• Click OK.
• Press Enter to move to the next line.
• You need to add a control for this form to
be submitted. You should use the Input
(Submit) control from the Form Control
List. Select Input (Submit) from the list,
drag and place it below the Input (Text)
field inserted earlier. Now your form will
start to look like the one adjacent.
• Now this form needs to be configured. To
send the form details for further processing,
after the visitor enters the email address, you
need to specify the URL where the details
should be sent. Now right click the form,
select Form Properties. The Form
Properties dialog box will be displayed
(Figure adjacent).
• Select Options…. The Options for
Page 218 of 240
Custom Form Handler dialog box appears.
• You need to specify the URL in the text
box Action: for the details to be sent to a
script that will take care of further execution.
Type a URL, for example:
http://www.example.com/submit.asp or
submit.asp.
• You need to specify a method. Since we
are sending data, select
POST. • Click OK.
• Give a relevant name
to this form that helps
track different forms used in a website. In
this activity, type Newsletter and click OK.
Note: You need to point to the URL that has
the script to process this form further. If you
have provided values just for demo, your form
will NOT work. However, you can understand
the concept behind HTML form. SESSION 13: CSS
RELEVANT KNOWLEDGE
Managing Style Sheets (CSS)
If you have noticed HTML code is
complimented using CSS. HTML Editor uses
CSS for presentation to align your website to
certain standards as set by W3C. Create a style sheet to be used across a
website
You can also create style sheets that could be
applied across an entire website. You have
learnt to create style sheets manually in CSS
Module. You can use MEW to create style
sheets using the following procedure:
1. Select File > New > CSS.
2. You can use the Style toolbox (Figure
adjacent) to create styles in the style sheet.
(If it is not visible, select Panels > Apply
Styles….).
6. Select body from Selector: dropdown
menu.
3.
Select New Style…. The New Style
dialog box appears (Figure adjacent).
7.
Select Verdana from fontfamily:
dropdown menu.
4.
You can define styles for each HTML
element using the Selector: dropdown menu.
8.
Select small from fontsize: dropdown
menu.
9. Select Gray from Color: dropdown menu.
10. Click OK.
11. Notice the CSS
code
written
automatically
(figure above)
12. To apply a
particular setting
for Table element,
select New Style….
13. Select
Table
from
Selector:
dropdown menu.
Page 219 of 240
14. Select
Courier from fontfamily:
dropdown menu.
15. Select xsmall from fontsize: dropdown
menu.
16. Select Gray from Color: dropdown menu.
17. Click OK. Notice the CSS code written automatically
(Figure above)
Note that the code is appended to the existing
code. This is helpful when you want to modify
an existing style sheet.
Save this file with a file name, for example,
mystyle.css (You need not type the file
extension).
Apply a style sheet across a website
Now you need to link all the web pages in the
website to this style sheet. This is usually
done by including this style between <style>
and </style> elements in each page. HTML
Editor can add that code for you. To apply
this style sheet to all the web pages in a
website, do the following:
1. Select Attach Style Sheet… under
Apply Styles. The Attach Style Sheet
dialog box is displayed (Figure adjacent).
2. Select All HTML Pages in Attach to:
option. You can either include the CSS code
to all the pages or link all the pages to use
the CSS code in this style sheet. It is highly
recommended and considered best practice to
link style sheet as:
a)
You have a better control of the whole
site via a single style sheet.
b)
Change of the settings in one style
sheet is automatically applied to all the web
pages linked to the style sheet.
3. Select Link.
4. Select browse….
Select the style sheet
you created earlier (mystyle.css) and click
OK.
Note: Linking all the web pages may take a
while depending on the number of web pages
in the website. Notice the popup message
once complete.
To verify if the link is added, open any HTML
page in this website. Select View > Page >
Code. Notice the link to mystyle.css within
the <head> and </head> elements. Removing Style Sheet Links
To remove style sheet links from a single web
page, remove the line that contains code for
linking to a style sheet. To remove style sheet
links for all web pages, open any web page
that has the link to a style sheet and do the
following:
• Select Panels > Manage Styles….
• Select the Style Sheet listed under CSS
Styles:. • Rightclick and Select Manage Style
Sheet Links…. The Link Style Sheet dialog
box appears (Figure adjacent).
• Select All Pages.
• Select the Style Sheet from the URL: list.
• Select Remove.
• Click OK. • Click Continue.
Now the links will be automatically removed
from all the web pages. Use CSS code for a single page
You can also use CSS for a specific web page
when you want to use a separate style for
that particular web page only. To specific
CSS for a specific page, do the following:
1. Create a new page, name it single.html.
2. Select Format > New Style…. The New
Style dialog box appears.
3. Select Paragraph element from
Selector: dropdown list.
4. Select Book Antiqua from fontfamily:
dropdown menu.
5. Select medium from fontsize: dropdown
menu.
6. Select Lime from
Page 220 of 240
Color: dropdown menu.
7. Click OK.
8. Select View > Page > Code. Notice the
CSS code included only for this web page. 9. Create some content using paragraph
element. Save and preview this in your
browser (F12).
SESSION 14: BEHAVIORS
RELEVANT KNOWLEDGE
Using Behaviors
You have learnt to use JavaScript code
earlier to showcase a behavior. You can also
create behaviors without writing any
JavaScript code and get a limited level of
functionality. You need to use JavaScript for
advanced functions; however, you can use the
builtin Behavior functions to achieve most
simple tasks such as:
1. Do something when an object is clicked.
2. Do something when an object is
doubleclicked.
3. Do something when the cursor is over an
object.
4. And so on….
Onclick
If you want to display a popup message box
when a visitor clicks on an image, do the
following:
popup.html. • Insert an image,
ensure the image is
selected.
Select
Format > Behaviors.
The
Behaviors
toolbar is displayed.
• Select
Popup
message from the
Insert dropdown
menu (Figure adjacent).
• The Popup Message dialog box appears.
Type the message to be displayed when the
visitor clicks on the image you inserted
earlier (step 2), for example, Image Popup
using behavior.
browser (F12). Click on the image and notice
the popup displayed (Figure adjacent). Switch
to MEW and view the code.
Mouseover
If you want to display a popup when the
visitor moves the mouse over an image
instead of clicking on it, do the following:
1. Select View > Page > Design.
2. Select the image.
3. From the Behavior toolbar, under
Events dropdown, select onmouseover.
(F12). Move the cursor over the image and
notice the popup displayed without clicking.
5. Switch to MEW and view code.
Redirect You can also redirect visitors to another web
page or website when they click or move their
cursor over an image. To redirect a visitor, do
the following:
redirect.html. 2. Insert an image, ensure the image is
selected. 3. Select Go To URL from the Insert
dropdown menu. The Go To URL dialog box
appears.
4. Enter an URL. For example,
http://www.youtube.com and click OK.
(F12). Click on the image and notice the page
is redirected to YouTube. Now try using other
behaviors available with MEW. SESSION 15: COMPATIBILITY
RELEVANT KNOWLEDGE
Page 221 of 240
Checking Compatibility with other
browsers
Once you complete designing your website,
you need to ensure that your website works
and looks as expected. You can use the
compatibility checker to check all pages of a
website are compatible with different
browsers. This helps save time and you need
not worry about checking each and every web
page or item on your website. To check for compatibility, do the following:
• Open the website that you want to check.
• Select Tools > Compatibility Reports….
The Compatibility Checker dialog box
appears.
• A big advantage is that compatibility
checker can be run across the entire website
as it checks page by page automatically. You
need to specify the HTML and CSS standards
that need to be verified for compatibility. For
example,
• Select
HTML 5 from
Check
HTML/XHTML compatibility with:
dropdown menu. • Select CSS 2.1 from the Check CSS
Compatibility with: dropdown menu. Click
Check.
Notice the results displayed. Review each
element and correct as required; remember to
rerun the checker till you have an error free
website. As you may have some visitors using older
browsers (which is most likely on the
Internet), you need to check for compatibility
with older standards too. Now to test this
website, for older standards such as HTML
4.01 and CSS 1.0, do the following:
1. Select Tools > Compatibility Reports….
2. Select HTML 4.01 Strict from Check
HTML/XHTML compatibility with:
dropdown menu. 3. Select CSS 1.0 from the Check CSS
Compatibility with: dropdown menu.
4. Select Check.
5. Notice the results displayed (figure
below).
Notice the compatibility problems as the code
in Style sheet is found incompatible with
CSS 1.0. This indicates that this page
may display properly on browsers that
support only CSS 1.0. Note: In such cases where you need to
target older browsers or standards,
configure the HTML editor to use older
CSS standards. However, for existing
code you need to modify the code
manually.
You can also check for issues with CSS code
by:
• Select Tools > CSS Reports…. The CSS
Reports dialog box appears.
• Click the button Check. Notice the
results displayed. SESSION 16: CODE VIEW,
Page 222 of 240
ADDINS, SNIPPETS AND PAGE
TRANSITIONS
RELEVANT KNOWLEDGE
Working with CODE View
Though most tasks can be completed using
GUI, at times you may have to insert code
manually (for example when you want to
integrate with your website, a third party
web application, provided as code).
IntelliSense is a feature that automatically
provides you a list of codes and attributes as
a popup when you work in the code view
mode. To understand how to use it, do the
following:
• Create a new HTML page.
• Select Code View.
• Place the cursor after the <body> tag.
• Type angle bracket < to open the tag.
Notice the list of elements displayed (Figure
below).
• Select a element from the list, for
example: h1 . • Now place the cursor after the element
and press spacebar. Notice the list of
attribute related to this element is displayed.
Select align, (notice the attribute added),
select = on your keyboard. Notice the value
corresponding to this attribute is selected.
Select Center. • Close the tag using >. Notice the end tag
is automatically added.
Though code view can be difficult to use in
the beginning, once you have adequate
practice, you will gain total control of the
coding environment! To view IntelliSense settings, do the
following:
1. Select Tools > Page Editor Options….
2. Select the tab IntelliSense (Figure
above).
3. Notice the settings. Note that you need
additional technical expertise to work with
this area. Important: Do NOT change any setting
here. Addins
Addins extends the capability of the
main program by adding enhanced
custom commands and specialized
features. You can download a variety of
Addins from:
http://msdn.microsoft.com/en-us/expression/j
j873995.aspx
http://www.webassist.com/go/xweb-add-ins
http://www.expressionextras.com/products/li
ghtbox.htm
http://www.dotnetcurry.com/ShowArticle.asp
x?ID=534
Of Course, you can use Google to find
more Addins! Once you have downloaded
an Addin, use the following procedure to
install the Addin:
• Select Tools > Addins. The Manage
Addins dialog box appears.
• Select Install…. Browse and select
the Addin and then click Open. • Select Yes. • Repeat the procedure to include more
Addins. Note: Addins may need to be installed
through a special procedure. Refer to
Page 223 of 240
Addins help file
for
detailed
instructions. Using Snippets
Snippets are pieces
of programs reused
by most developers.
Snippets are useful
as you can keep
reusing the code
created many times
across multiple web
pages or web sites
saving enormous amount of time and effort.
To view and insert the available snippets, do
the following:
1. Select Panels > Snippets. Notice the list
of snippets available separated into
categories such as CSS, HTML, JavaScript,
JQuery, etc. 2. To insert a snippet, do the following:
• Create a new page. Place the cursor
where you want the snippet to be placed.
• Select View > Page > Code. (Snippets
can be inserted only in Split or Code View).
• Expand HTML, expand Hyperlink
folder. • Doubleclick on a snippet, for example:
Add to favorites. Notice the code is added to
the web page. • Save and preview this page in browser
(F12). Switch to MEW to view code.
Note: You may require following additional
instructions for some of the snippets listed
here. Refer to the help file for detailed
instructions. PSD Templates
As a web designer, you need to create pages
that are attractive and simple. Remember
that along with showcasing content to a
visitor and the design also needs to be
pleasant, encouraging them to repeat their
visit to the website. When it comes to Web design, you need to
maintain a balance between visual design
and code. Though it is possible to create
simple web designs using standard HTML, it
is always a good practice to research on good
designs. Components of some of the attractive
websites are usually created using Adobe
Photoshop and later integrated into the web
site for additional functionality such as text
content, forms, etc. You can import certain parts (or layers) or
entire images into your website using MEW.
Given here is a list of websites where you can
find Photoshop templates (some of them are
free!):
http://www.psdtemplates.com/templates/
http://www.freepik.com/free-psd/web-templates
You can browse, select, download and use
these files. Refer to website terms and
conditions for license information. Link PSD & MEW
Also there is a special feature that can be
used for updating an image whenever the
original (.PSD) Photoshop image is modified.
To understand how to use this feature, do the
following:
Import a .PSD (Photoshop files use this
extension) file and do the following:
• Create a new web page, save the file as
psd.html.
• Select File > Import > Adobe
Photoshop (.psd)…. • Browse and select the file. Click Open.
Import Adobe Photoshop File dialog box
appears (Figure adjacent).
• You can select the layers you want to
import using the options in the left pane.
Select Compatibility Image located at right
bottom and click OK.
• Click Save when prompted. Page 224 of 240
•
Rightclick on the image, notice the menu
item Adobe Photoshop (.psd) (Figure below).
• You can update this image whenever the
original image is updated by selecting
Update from Source…. This is possible
because MEW maintains a link between the
image and the original source. This is one
feature that is useful for both web developers
(who write code) and web designers (who
design sites)!
Page Transitions
You can apply special effects to web pages
just as in presentation software. This helps
present special effects to visitors. To add
transitions, do the following:
1. Create a new page, save the file as
trans.html.
2. Select Format > Page Transition….
The Page Transitions dialog box appears
(Figure adjacent).
3. You need to select an event to which the
effect should be applied. Select Site Enter
from Event: dropdown and select Circle In
from Transition effect: list.
4. Type 5 in Duration (seconds): box and
click OK.
5. Save and preview this page in browser
Note: Page Transitions will work only on
Internet Explorer 5.5 or above. SESSION 17: DYNAMIC WEB
TEMPLATES
RELEVANT KNOWLEDGE
Templates help you organize the entire
website to have a consistent look and feel.
This is very helpful when you work with
large number of web pages.
On your website, you may have some
common items displayed on all pages
such as the logo, copyright & organization
details, navigation menu, etc. but the
content may vary on each page. Here, you
can create a dynamic web template
(DWT) with fixed positions for common
elements and modifiable designated
portions on each web page.
Unlike standard templates, Dynamic Web
templates have the following features:
• When you update the DWT, all web
pages in the website are automatically
updated to changes.
• You can create multiple DWT and
keep changing just the template that
affects the entire website.
• You can allow only specific portions of
the pages to be edited instead of whole
web page resulting in better control and
reduced chances of mistakes. This feature
is very useful when multiple developers
work on the same website.
Creating a dynamic web template To create a dynamic web template, do the
following:
1. Create a new web page (to be used as
template).
2. Add common elements such as a logo
(picture), company name, copyright notice
at the bottom of the web page, etc.
3. You need to add editable regions and
that will be the only area in which the
content can be modified. To create an
editable region, do the following:
Page 225 of 240
Place the cursor where you need to
place content (remember, this will be the
only area where the content can be placed
or changed). Rightclick and select
Manage Editable Regions…. The
Editable Regions dialog box appears
(figure below).
b)
Type a name, for example:
Content. Click Add.
c)
Click Close.
a)
Dynamic Web Template…. (Figure
adjacent).
Notice the template displayed in the
list. Select the template, for example:
MyTemplate and click Open. A web page
based on this template will be created
and displayed.
•
4. Select File > Save. Select Dynamic
Web Template from the Save as type:
dropdown menu (Figure above, right).
Type a file name, for example:
MyTemplate and click Save.
Using a dynamic web template You have created a DWT template. If you
want to
create web
page based on
this template,
do
the
following:
• Select File > New > Create from
Template List Web Page
1. Notice that you are able to type
content only in the editable region
specified earlier and rest of the area are
not editable. Now type some content in
the “Content” area. Save this page as a
normal web page. For example,
Page01.html.
2. Create at least 23 pages based on this
DWT. Save the files.
Editing a dynamic web template When you edit the DWT, it automatically
updates the changed layout to all the
pages created using the DWT (for
example, when you want to change to a
different layout or update the company
logo without affecting the content). To
edit a DWT, do the following:
1. Locate the Dynamic Web Template
you created earlier (it will be displayed
with the file extension .dwt) and
doubleclick on it. Page 226 of 240
2. Now add another editable region by
placing the cursor elsewhere in the web
page. Name the region as “Photos”.
3. Now save this DWT (CTRL+S). Notice
the message displayed (figure adjacent).
4. Select Yes. Automatically all the web
pages created using this template are
updated. 5. Open any of the web pages created
using this template and notice the
changes. 6. Insert an image in the “Photo” region.
Save the web page. Sometimes you may have to use a
completely different layout for entire
website. In such cases you can create a
new dynamic web template and associate
all the web pages to this new DWT. This
in turn will (in no time) apply the new
structure to all the web page eliminating
the need for making layout changes to
each web page!
To create a new DWT and associate all
web pages (or selected web pages), do the
following:
1. Create a new DWT by swapping the
“Content” and “Photos” regions: 2. Create a region for “Photos” (at the
top)
3. Create a region for “Content” (below
Photo)
4. Save this as DWT with a new file
name, example: MyTemplate02.
Note: You need to include the region
names as the content has to be retained
but placed according to the new layout.
Use the same region names when you
want to work with different DWTs.
Otherwise content may not swap properly
leading to issues.
Now, to use this new DWT, associate the
web pages to the new template.
1. Select all the web pages (Page0x.html)
using the folder view (left pane). Use
CTRL + Click to select multiple pages.
2. Select Format > Dynamic Web
Template > Attach Dynamic Web
Template… (Figure below, left).
1. Attach Dynamic Web Template
dialog box appears (Figure above, right).
2. Select the second template, for
example: MyTemplate02 and click Open.
3. Notice the results displayed. Content
from “Photos” and “Content” are
automatically swapped based on the new
template.
Remove DWT association with
selected or all web pages
When you no longer need to use DWT or
are using a HTML editor that may not
have support for DWT, you can detach
the DWT linked with selected or all web
pages. Note this procedure only removes the
relationship and is a oneway process.
Content and the layout are left
Page 227 of 240
undisturbed. However if you want to
associate with a DWT you need to start
all over again! If you decide at some point
to remove the relationship of DWT and
selected or all web pages, do the
following:
• Select all the web pages (Page0x.html)
using the folder view (left pane).
• Select Format > Dynamic Web
Template > Detach from Dynamic
Web Template.
• Notice the message displayed, select
Close.
6.
7.
8.
Strong text (bold)
Phrases
ALT Text in images ………………..
And many more.
Note: You need to learn more about SEO
before taking decisions on optimizing a
website. You need to refer to the SEO process
of each search engine at their respective
websites. However, you can use the SEO
Checker to understand what needs to be
SESSION 18: SEARCH ENGINE
OPTIMIZATION
RELEVANT KNOWLEDGE
Search Engine Optimization or SEO refers to
the process that affects the website visibility
or ranking when displaying search results.
Search Engines search contents of a web page
and create indexes to display results. As a
web developer, you need to understand how
search engines work and how to get better
search ranking. SEO Checker builtin with
the HTML Editor gives detailed reports that
help you optimize the website for better
ranking.
Anatomy of a Search Engine
Search engines crawl a website (and hence
referred to as Spiders) to create index of
content. This index helps find a matching
web page or link based on keywords entered
by visitors.
Search engines index the following
components of a web page:
1.
Page Title (only the first 70 characters
are displayed in search results!)
2.
Page Description (at least first 156
characters are displayed in search results!)
3.
Page Keywords
4.
Page headers (H1)
5.
Links to other pages
optimized for a better ranking.
1.
Select Tools > SEO Reports…. SEO
Checker dialog box appears (Figure above).
2.
Select All Pages, and the select
Check. Notice the results (Figure below).
You can click on each message displayed in
the list to find out and fix related issues. For
example for a message as “The Description is
missing”, you can add a description using the
META tags to correct it. Once errors are
identified and fixed, run the SEO Checker
again to confirm if the website is optimized.
SESSION
ADVANCED
19:
FORMS:
RELEVANT KNOWLEDGE
So far, you have been using HTML and CSS
Page 228 of 240
for creating simple web pages. These are
referred to as Static Web pages. While static
web pages are good enough for creating basic
web sites, you need to learn and use
technologies such as ASP, PHP, etc. for
creating dynamic websites. Dynamic
Websites allow visitors to search and locate
information (such as a search feature of
search engines or database listing), submit
information (such as feedback, rating, voting)
etc. Advanced Forms
You can create a fully functional form using
MEW. Data filled using a form can be stored
in a database or sent to a specific email
address. But these features require proper
support from the web hosting provider,
primarily the support for FrontPage Server
Extensions.
available in Vista / Windows 7 & Windows
2008. You may download an evaluation copy
of FrontPage Server Extensions (FPSE) from
www.iis.net. Some web hosting providers still
give support for FPSE and you will be able to
publish using FPSE. Creating forms
You can create forms and use additional
functionalities of MEW. To create a form and
store the details in a database, do the
following:
1. Select File > New > ASP and save this
page as dform.asp. 2. Insert a form and add the following:
a) Insert Input (Text), for visitor’s name. b) Insert Input (Text), for visitor’s email
address.
c) Insert DropDown Box, for collecting
visitor’s favorite color.
Special Note:
d) Insert Input (Submit).
FrontPage Server Extensions is a technology that provides special functionalities
Now your form should look similar to the one
on web servers created using Microsoft FrontPage or Microsoft Expression Web.
Though this technology was used for over a decade, it is considered obsolete due
to the evolution of other equivalent or better technologies. You may still find a
few web hosting providers extending their support to this almost obsolete
technology. Microsoft Expression Web replaced Microsoft FrontPage. Most of the activities in
this module can also be done using Microsoft FrontPage. However, Microsoft
FrontPage has a limited support for recent developments in web technologies
such as CSS3, HTML5, etc. Yet, you can use form functionalities outlined in this
module if your web hosting provider supports only FrontPage Server Extension. If you want to create a form for your Intranet or if your web hosting provider
supports FrontPage Server Extensions, you can use procedure in this session to
adjacent.
You need to customize this form before it is
create the form, configure it to save the data in a database and later publish it to
displayed to the visitor. Now to customize the
the remote computer.
Web Server
You can use the web server inbuilt with the
operating system. Windows includes IIS
(Internet Information Services) in both client
and server operating systems. IIS inbuilt
with client operating system such as
Windows XP, Vista & 7 is usually sufficient
for websites having few visitors. You can
install IIS on Windows Vista & 7. Use the
help file for detailed instructions. Note: FrontPage Server Extensions is not
fields, do the following:
1. Doubleclick on the first Input (Text)
field. Type Name in Name:, click OK.
2. Doubleclick on the second Input (Text)
field. Type Email in Name:, click OK.
3. Doubleclick on the dropdown box.
Dropdown Box Properties dialog box
appears.
4. Since you are collecting details of visitor’s
favorite color, you need to add dropdown
Page 229 of 240
values for visitor to
select. a)
Notice there
is a default
dropdown with null
value (no value); you
can remove that by
selecting Remove. b)
Click Add…,
Type Red in Choice:, Click OK.
c)
Click Add…, Type Blue in Choice:,
Click OK.
d)
Click Add…, Type Green in Choice:,
Click OK.
e)
Now change the Name: (Select1) by
replacing the text to Color.
f)
Click OK.
Creating a database
To save the details collected from the form,
you need to have a database with
corresponding fields ready. MEW can create a
database for you and link these fields to the
database automatically. To create and link
the database automatically, do the following:
1. Rightclick on the form, select Form
Properties. The Form Properties dialog box
appears (figure above).
c)
To create the database, select Create
Database…. MEW automatically creates an
Access database (only format supported for
automatic creation). Click OK to close the
popup.
d)
Select Saved Fields tab. Note the
fields are mapped from form to database
automatically. Click OK twice.
is displayed.
a)
Select Send to database (Note:
Requires FrontPage Server Extensions).
b)
Select Options…. The Options for
Saving Results to Database dialog box
Now the form is ready but you need to
publish the form to a server that supports
FrontPage Server Extensions; otherwise this
form will not work. Once publishing is
complete, you can use the published URL to
view the webpage. Publish the form to a website
Note: Forms are published automatically
along with other files in a website. 1. Select Site > Publishing Settings…. 2. Select Add…
a)
Type a friendly name in Name:
b)
Select
FrontPage Server
Extensions from Connection Type:
dropdown menu
c)
Type the remote location, for example:
Page 230 of 240
www.example.com
d)
Type the credentials (Username and
password) provided by the hosting provider.
e)
Click Add.
3. Click OK.
4. Select Site > Publish All Files to…
NAME (IP address of the server or
computer that supports FPSE).
Note: Publishing may take some time. Viewing the webpage
Visitors can now view the website or
webpage. When they click on the URL that
takes them to the form, the form will appear. Visitors can fill the form by entering the
details and when they click submit, they will
see a confirmation page similar to the one
below: The database is stored in a special folder with
the name fbdb; this folder is hidden for
security purposes and is not accessible to
visitors. You can open this database using your
database software to view or modify
information within this database. This could
be useful when you want to collect all the
email addresses and send a newsletter to
visitors.
Note: Use Windows Explorer to navigate to
the folder that contains this website if you
are using a web server within LAN; Access
database is stored in a special folder named
fpdb. If you are using MEW, then the access
database can be retrieved from the fpdb
folder in folder list view. SESSION 20: PUBLISHING
WEBPAGES OR WEBSITES I
RELEVANT KNOWLEDGE
Preparing for publishing
Before you publish a website, you need to
verify the website’s functionality. Hyperlinks
(internal & external) should be checked and
replaced if necessary. Given here is a list of
standard procedures to be followed prior to
site publishing.
Examining
Structure of a
website
Create a visual
diagram of
hyperlinks of a website. This helps you
understand the navigation structure or to
trap any broken links. To view the structure
of a website,
do
the
following:
1. Open the
websiteSelect
View > Site >
Hyperlinks.
Notice the
visual diagram (Figure above).
2. You can further expand and understand
the links to other pages. Select the plus
symbol next to the link (
).
Notice the results displayed (Figure
adjacent).
Estimating Size of a website
If you know the size occupied by files in a
website, you can determine if you have
sufficient web space (as allocated by an ISP)
or even determine the time taken to
download before visitor can view the web
page. 1. Select View > Site > Site Summary
(Figure above).
2. Notice the results displayed (Figure
below). Look at the list of items analyzed and
given below Name, Count, Size and
Page 231 of 240
Description.
Removing slow pages You can now decide to remove items that may
possibly slow down a page.
1. Select Site > Problems > Slow Pages
(Figure adjacent)
2. By default, HTML editor assumes and
displays only the pages that take more than
30 seconds to load. You can change the value
to 3 seconds to list web pages that take more
than 3 seconds to download. Select 3 Seconds
from the dropdown (Figure below).
Notice the
results
displayed (Fig. below).
HTML calculates based on two parameters;
the amount of bandwidth and time taken to
download within the set bandwidth. To
modify this setting, do the following:
1. Select Tools > Application Options….
Application Options dialog box will be
displayed (Figure adjacent).
2. Select Reports View tab (figure
adjacent, below).
3. Notice the values of “Slow Pages” take
at least and Assume connection speed of
(indicated in kilobits per second).
Note: This is not YOUR connection speed.
This refers to the connection speed available
at the web hosting end. DWT
If you have used Dynamic Web Template to
create the website, check for updates made to
the template. Also you can update all the
pages by selecting the Format > Dynamic
Web Template > Update All Pages option
to ensure all page layouts are up to date. Code Optimization
Before you publish, you need to cleanup your
web page for any unnecessary code that can
result in reducing page size. This in turn will
Page 232 of 240
help in faster downloads. You can use the
inbuilt optimizer tool to remove unnecessary
code by:
1. Select Tools > Optimize HTML…. The
Optimize HTML dialog box appears. 2. During development you may have left
behind some code such as comments. These
might have to be removed before you present
the website to an audience. To do so, select
All HTML Comments in Remove
Comments section and then select OK. All
the comments will be removed automatically. To optimize a web page, do the following:
1. Open an existing page (at least 510 KB
in size, record the size for comparison).
2. Select all the items under Remove
Components list.
3. Click OK. Notice the difference in file
size.
Fixing Errors
Before you publish the website, you need to
verify if there are any pending issues. This
helps you save time and unnecessary
problems that may arise post publishing the
website. To verify and fix (if there are any
errors), do the following:
• Open the Website.
• Select Tools > Recalculate Hyperlinks.
The Recalculate Hyperlink dialog box is
displayed (Figure adjacent).
• Click Yes. If there are any issues, they
will be automatically fixed.
Page 233 of 240
SESSION 21: PUBLISHING
WEBPAGES OR WEBSITES II
RELEVANT KNOWLEDGE
Web Hosting
When you want others to see your content
designed using HTML, you need to host the
content in a web server to be viewed by the
public. There are several free web hosting
providers that provide free web space for your
content. Though there may be restrictions on
the total web space or advertisements posted
within your website, the web space is usually
sufficient for hosting small websites or
practicing HTML! Use Google or other search
engines to find a free web hosting provider. Web hosting providers usually allow
publishing through FTP. Some web hosting
providers allow other methods such as SFTP,
WebDAV, etc. which you can use to upload
your website. Some of them allow other
methods such as SFTP (secure FTP),
WebDAV, FrontPage Server Extensions, etc.
and these are detailed usually in the page
that displays various plans for comparison. For web pages created using HTML, you can
use any provider that supports FTP. Publishing your website
Once you have created the website, you need
to publish it to computers that will be
available 24x7 for visitors to view. When you
sign up with a hosting provider, generally,
you will be given multiple options to publish
the content such as FTP, WebDAV,
FrontPage Server Extensions, etc. To publish a website using FTP, do the
following:
1. Open the website that you need to
publish.
2. Select Site > Publishing Settings….
The Site Settings dialog box appears.
3. Prior to publishing, you need to add
details such as the destination computer’s IP
addresses or domain name, settings and
credentials. For example if you have signed
up with a web hosting provider who has given
you an IP address 192.168.1.200 and FTP as
the method for publishing, do the following:
• Click Add…. The Connection Settings
dialog box is displayed.
• Enter the following details:
• Type a name in the Name: textbox
(usually your domain name or destination
computer name or IP address of the
destination). • Select FTP from the Connection Type:
dropdown menu.
• Hosting providers will provide a path for
publishing,
for
example:
ftp.domainame.ext. Type the path in
Location: textbox.
• Specify the folder where the content will
be stored (Usually directory is autoselected
for websites, use this only if required).
• Enter the username and password in
Credentials: section. This will be used when
you publish from the HTML editor. Generally
multiple files are transferred simultaneously
between HTML editor and destination
resulting in faster transfers. Leave this
setting as it is or contact hosting provider for
this detail only if required. • Click Add. • Notice the change in the Publishing tab
(Figure below) indicating the remote site is
added to the list. • Click OK.
Page 234 of 240
3. Export Web Package dialog box
Now MEW is ready with the remote site
settings for publishing content. Whenever
you want to publish (first time or periodic
updates), do the following:
• Select Site > Publish All files to
[NAME]. Once published, use the web
browser to view the website.
Web Packages
Another method to take your website to a
remote computer is by using the Web
Package feature. You can use the Web
Package feature to transfer contents of your
entire website (preserving the structure) to a
remote computer. This is useful when you
want to send your website (including the
complete structure) for being hosted from a
remote computer or, if the existing structure
is to be used for creating another website.
To export existing website to a web package,
do the following:
1. Open the website.
2. Select Site > Export to Web Package….
(Figure adjacent).
appears.
4. You can select individual files or folders
or, package the entire website. To package
the entire website, • Place the cursor at the root folder (C:\ in
the image adjacent). Click Add>>. Notice the
entire website is added to the right pane. • You can use a friendly name for this
package. Select Properties…, and the Web
Package Properties dialog box appears.
• You can enter company name, author, a
suitable title for this package. External
dependencies: has a list of external
resources that this website uses. This is
helpful when you are using any files, folder or
links that need to be verified before sending
the package to someone. • Enter a title in Title: textbox, for
example: WEBPACKAGE.
Page 235 of 240
• Enter a description in Description:
textbox, for example: created using MEW.
• Enter your name in the Author: textbox
• Click OK. • When prompted to save this Web
Package, type a filename for example:
MyFirstWebsite_DATE. Click Save. Notice
the result displayed (Figure adjacent).
• Click OK.
Navigate to the folder where you saved this
web package and notice the entire website
packed as a single file.
Note: To easily identify the package, replace
the date by specifying current date or a
version number. Importing Web Package
If you want to import this web package on
another computer, do the following:
• Create a New Site (Empty Site), name
this website for example: MySecondWebsite.
• Select Site > Import > Import from Web
Package… (Figure above).
• Browse and select the Web Package,
select Open. The Import Web Package
Page 236 of 240
dialog box appears (Figure adjacent).
• You can either select individual files
or folders, or the entire website. Click
Import.
• Select Yes to All. Click OK.
Now you can edit web pages within this
website. Also you can keep a copy of the
Web package as a backup for future use. Backup Websites
It is a highly recommended practice to take
periodic (daily, weekly, etc.) backups of
websites either using special backup tools or
publishing it to another internal source.
Whenever you attempt to perform an update
on a website, ensure you take a backup of the
current site before touching it. If you only have HTML content (static web
pages), use the following procedure to take a
backup of the website:
•
Go the location where your website is
stored (default location is My Documents).
•
Select the folder that has the complete
website.
•
Copy and paste it in another location
such as a pen drive or to a folder on another
computer. SESSION22:
TOOLS
AUTHORING
RELEVANT KNOWLEDGE
You have learnt to work with Expression
Web in earlier sessions. There are a
variety of other web authoring tools
available for use and most of them have
similar functionality. Some of the popular
authoring tools are discussed in this
module. KompoZer
KompoZer is an open source WYSIWYG
HTML editor. KompoZer complies with
the W3C's web standards.
• Download
KompoZer from
www.kompozer.com.
• Follow the onscreen instructions and
complete installing the software.
• Select Start > Programs >
KompoZer.
Note: Screen grabs are from
kompozer0.8b3.enUS.win32 (Version).
Now you have installed, create & save
pages and view them using different web
browsers.
To create a page using KompoZer, do the
following:
Select File > New…. The Create a
new document or template dialog box
is displayed (Figure above).
• Select A blank template, select
Create.
• Type some content, select Source to
view the source code. • Use the help file (F1) to learn about
using KompoZer.
•
Dreamweaver
Page 237 of 240
Adobe Dreamweaver is another popular
authoring tool used widely. Adobe
Dreamweaver supports a variety of
scripting languages such as JavaScript,
VBScript, ASP.NET, PHP, etc. apart from
standard support for HTML & CSS. 1.
Download Trial edition of
Dreamweaver from adobe.com.
2.
Follow the onscreen instructions
and complete installing the software.
3.
Select Start > Adobe >
Dreamweaver.
Use the help file (F1) to learn about using
Adobe Dreamweaver.
SESSION 23: CSS TEMPLATES
RELEVANT KNOWLEDGE
Designing a good looking interface can be
quite difficult at times as it requires
creativity. Also you need to learn
additional software to create such designs
while focusing on delivering websites that
are standard complaint. When you design websites, you don’t have
to design a web page from scratch. You
can use templates that are available for
free or a free to save time and efforts.
Though you have learnt to create
templates using HTML editors, you can
still find and use creative designs for your
websites.
CSS Templates
Instead of creating dull and boring
websites, you can use templates that are
available on the Internet. Popularly
referred to as CSS Templates or
XHTML/CSS Templates these
templates look attractive while meeting
certain standards. Following is a list of
websites that offer such templates for
your reference:
http://html5up.net
http://www.cssportal.com/css-templates/
www.freecsstemplates.org
www.free-css.com
www.templatemo.com
www.oswd.org
www.openwebdesign.org
and many more….
To use a CSS template, do the following:
• Visit any of the website mentioned
above (or use a search engine to locate
one).
• Browse and select a template.
• Most website provides an entire site
structure consisting of web page(s), style
sheets and accompanying images as a
single compressed package. Download the
compressed file and unzip them to a
folder. Also you may notice a link for live
Page 238 of 240
preview that allows you to view the
template in action before downloading.
Always check the design before you
download.
• Once the download is over, open the
homepage. Homepage is usually titled
with names as index.htm, default.htm or
home.htm.
Note: Some website may require you to
sign up and even have certain terms and
conditions. Check the website for
requirements.
Customizing Templates
You can use a simple text editor to modify
the template. However, if you find it
difficult, you can use an HTML editor
such as MEW. Also note that if the
template is of a recent standard and if the
HTML editor does not support that
standard, entire template will appear
distorted. Confirm if the HTML editor
support the standard used in a template.
To work with a template using MEW, do
the following:
• Launch MEW.
• Create a New Site (always test the
template in a new website).
• Copy all the files from the template
folder (or use import wizard).
• Paste in within the HTML editor (You
may receive prompt for files to be
overwritten, click Yes). • Open the Homepage (index or
default.htm) (Figure above).
• Customize the website.
• To view the source code, select View >
Page > Code.
Following is provided as a courtesy:
CSS can also be used for developing
attractive navigation menus (Figures
below).
You can use CSS Tab designer
(http://www.highdots.com/products/cssta
bdesigner/) to create navigation menus
such as the ones above. Page 239 of 240
LIST OF CONTRIBUTORS
Advisors:
1
Mr. Ajay Mohan Goel, Director Skills College, Wadhwani Foundation.
2
Mr. Austin Thomas, Director – Skills College Initiative, Wadhwani Foundation.
3
Prof. R.B. Shivagunde, Joint Director, PSSCIVE, Bhopal.
4
Mr. Deepak Shudhalwar, Faculty in CSE, Engineering & Technology Department PSSCIVE, Bhopal.
Subject Matter Experts:
1
Ms. Sonia Kakkar. Wadhwani Foundation.
2
Mr. Karthik Chandru, Wadhwani Foundation.
3
Ms. Toral Veecumsee, Wadhwani Foundation.
4
Mr. Ajay Goel, Wadhwani Foundation.
5
Mr. Austin Thomas, Wadhwani Foundation.
Editing:
1
Ms. Sonia Kakkar, Wadhwani Foundation.
2
Deepak Shudhalwar, Faculty in CSE, Engineering & Technology Department PSSCIVE, Bhopal.
Coordination:
1
Ms. Rekha Menon, Wadhwani Foundation.
2
Mr. Ajay Goel, Wadhwani Foundation.
3
Mr. Austin Thomas, Wadhwani Foundation.
Page 240 of 240

(ITES) NVEQ Level 3

Transcription

Similar documents

dental fear? - Sedation Dentist Ocean City

STEP-1 >> GO TO https://www.onlinesbi.com

ONE COAST ONE FUTURE - Kinmel Bay Community Flood Plan

Destroyinator XL60

TruPay HR Forum.cdr

Faculty Finds - Cypress College Library

Setting up Accounting information from PrintNet

Dynamic Desander

l references to it are owned by nickelodeon, a