Text, Text for Webpages Message- System Messages, Instructional Messages Message Box Icons, Characteristic of Icons

1. WindowsComponents
Text, Message and Icons
PRESENTATION BY • SANJAY SINGH

2. Agendas
o Text
o Text for Webpages
o Message
o System Messages
o Instructional Messages
o Message Box
o Icons
o Characteristic of Icons

3. Text
• Text is any textual element that appears on a screen,
including field, captions, headings, words, sentences,
messages, and instructions.

4. How to
present a text ?
 Fonts:
• Use plain and simple fonts.
• Choose a minimum point size of 12 to 14.
• Use proportional fonts.
 Width:
• Include not more than 40 to 60 characters on each line.
• Do not right-justify.
 Content:
• Use headings to introduce a new topic.
• Separate paragraphs by at least one blank line.
• Start a fresh topic on a new page.

5. How to write a
text ?
 Sentences:
• Try to keep the no. of words in a sentence to 20 or less.
• Short sentences composed of familiar, personal words.
• Use separate sentences for separate ideas.
 Paragraphs:
• Try to keep no of sentences is less.
• Restrict a paragraph to only one idea.
 Style:
• Use active and personal writing style.
• Write as you talk.

6.  Words:
• Avoid using words that are specific to the web like:
"this web site", "click here" and "follow this link”.
 Error messages:
Provide helpful error messages for:
• Incomplete or incorrectly entered data
• Requests for documents that cannot be found
 Instructions:
Make sure instruction are detailed enough.
• Describe where an "up" button leads.
• Don't use "return to“
Text for
Webpages

7. Messages
• Messages are communications provided on the screen to
the screen viewer.
• Screen messages is classified into two categories:
1. System messages:
Generated by the system to keep the user informed
of the system's state and activities.
2. Instructional messages(prompting message):
Tell the user how to work with, or complete the screen
displayed.

8. System
Messages
1. Status messages:
• Providing information about the progress.
• Usually contains a progress indicator.
• Include cancel/pause/resume buttons.
2. Question messages:
• Asks a question and offers a choice of options.
• Identified by a "?" icon proceeding the message text.
3. Informational message:
• Identified by an "i" icon to the left of the message.
• Notification messages like "completed/failed“.
• No user actions needed.

9. System
Messages
4. Warning messages
• Identified by an "!" exclamation mark.
• User may be asked to advise the system whether or
not to proceed.
5. Critical messages(action messages):
• Call attention to conditions that require a user action
before the system can proceed
• Some products use a "Do Not" symbol while others
use a "Stop" sign.
• An X in a circle used by MicrosoftWindows

10. Examples

11. Instructional
Messages
• Provide instructional information at the depth of detail
needed by the user.
• Accessing instruction through a Help function is the best
solution.
• Display it in a manner that visually differentiates it from
other screen elements.
Example:
The search field did not contain an entry.
Please hit back button and enter a value.

12. Writing
Message
BoxText
 Title bar:
• Clearly identify the source of the message the name
of the application to which it refers.
 Message box:
• Provide a clear and concise description of the condition
causing the message box to be displayed.
• Use complete sentences with ending punctuation.
• Show only message box about the cause of condition in
single message.
• Do not exceed two or three lines
• Centre the message text in window

13. Message Box
Controls
 Command buttons:
1. OK
2. OK and Cancel
3. Yes and No
4. Stop
5. Help
 Close box

14. Icons
 Icons are graphical representative of something, used to
represent objects/actions with which users can interact
 Icons may stand alone, or grouped together in a toolbar.

15. Characteristics
of Icons
 Syntactic:
• Refers to a icon's physical structure shape, colour, size.
 Semantics:
• Semantic is icon's meaning.
• What does it refer - a file, or some other objects?
 Pragmatics:
• Pragmatic means how the icons are physically produce.
• Is the screen resolution sufficient to illustrate
Syntactic, semantics and Pragmatics determine an icon's
effectiveness and usability

16. Choosing Icons
 Use a bold colour or gradient for icon background.
 Avoid detailed images or illustration.
 Size:
• 16x16, 24x24, 26x26, 32x32 pixels
• With mouse: 20 pixel square,With finger: 40 pixels square
A successful icon looks different from all other icons looks as
good in black and white as in colour.

17. Thank You