Introduction

Terminologies:
 Internet – worldwide collection of networks that links together millions of
businesses, the government, educational institutions, and individuals using
modem, telephone lines, and other communication devices and media.
 Network – consists of 2 or more computers connected for the purpose of
sharing information and resources.
 World Wide Web (WWW or Web) – is the part of the internet that supports
multimedia and consists of a collection of linked documents.
 Web Pages or Web Document – documents or pages of information linked in
the Web.
Different types of information
- text
- graphics
- sound
- animation
- video
 Web Site or Web Presentation – is a collection of Web pages that are created
and maintained by any institutions or even an individual.
 Web Server or Host – a computer where the web pages are stored and
connected to internet.
 Publishing – copying files or web pages into a web server
 Hyperlink or Link – is used to connect a Web page to another Web page on the
same, or a different Web server located anywhere in the world.
- an address identifying a computer file path name or URL in a Web
page
- clickable to access another location on the same page, another Web
page stored on that Web site or Web Page stored somewhere else on the
internet.
 Hyperlink documents – files containing hyperlinks.
 HTML (Hypertext Markup Language) – is a set of special instructions to
create Web pages.
 Hypertext – system of linked information
 URL (Uniform Resource Locator) – a unique address that identifies Web pages
 http (Hypertext Transfer Protocol) – standard for communication that governs
transfer of several types of Web objects.
 ftp (File Transfer Protocol) – allow files to be downloaded from a particular
site to another computer.
 Domain – identifies the computer where the document is stored.
Samples:
.fi - country
.org - organization
.edu - educational institution or school
.gov - government agency
.com - commercial enterprise
.net - Internet service provider
 Markup or Tags – codes that specify links to other documents as well as how
the page is displayed.
 Subdirectories or Path – identifies the exact location on the computer
 HTML document – last URL entry
 Web browser or browser – is a software program that enables access, view and
navigate all the documents on the web.
Some examples of Web Browser:
- Netscape Navigator
- Microsoft Internet Explorer
- Mosaic
- Mozilla Firefox
- Safari (Apple)
 Viewers – individuals who access and look at Web pages
Two Kinds of Viewer:
Surfers – people who simply access pages and look at them
Users - people with a decided interest in the pages
 Homepage – the first page the viewer sees on reaching the site.
 Intranet – an Internet-like network that is internal to an organization
  Extranets – an Internet-like network joining business organizations with
common interests.
 W3C – World Wide Web Consortium, regulates and sets standard on published
web pages.

Parts of a Web Page:

 Web Page Title – the first element that can be seen, it identifies the subject
or purpose of the page.
 Web Page Body – contains the information that displays in the browser
window
 Background – the Web pages’ wallpaper familiar to Windows
 Normal Text - is the text that makes up the main content of a Web page.
 Headings – are larger or bolder text used to set off different paragraphs of
text or different sections of a page.
 Image, graphic or inline images – is an important element of a Web page,
represents objects such as icons, bullet, line, photo, illustration or other
picture.
 Horizontal rules – are inline images that display lines across the page to
separate different sections.
 Hyperlink or link – is one of the most important elements of a Web page,
they not only serves as the primary way to navigate between pages, they
distinguish the Web page as a unique repository of information. Usually it
has a given color different from the normal text for easy distinction.

Communication Models and the World Wide Web

1. One-to-many – one source speaker at one time to many people who comprise
a homogenous mass audience.
Media Used: broadcast, cable, satellite television, radio, print media, books,
magazines, and theatrical films.
2. One-to-one – one source speaker and one receiver.
Media Used: Telephone, e-mail, letters and video streamers.
 3. Many-to-one – combination of computer system and the internet; it a cross
between mass broadcasting and interpersonal communication. Information
through different sources is stored into one until retrieved by individual.
Media Used: Large mainframe computers, local or wide area networks.
Characteristics of a Web Page
1. Understandable
2. Interesting and valuable
3. Capable of converting surfers to users
4. Consistent and engaging
5. A skilful integration of text, graphics, audio, video and information extracted
6. Easily navigated
7. Unified in look and feel
8. Artistic

Three Criteria in Designing Web Presentation

1. Effectiveness – rational criterion (complete, sensibly organized, and accurate)
2. Affectiveness – emotional criterion (interesting, stimulating and enjoyable)
3. Navigational Efficiency – users can easily use, locate the information they
want

Generations in Web Designing

First-Generation Web Presentation

 High effect typically results from formatting paper-based text as Web pages
 It reflects a print-based design that does not translate well to the new media
 Tracking web site’s usage statistics through server software for storage
Example: visitor’s identification, pages visited and duration of visit for each
page
Problem: A low number of page visits and visits of short duration are the key
indicators of first-generation design problems.

Second-Generation Web Presentation

  As the problem arises in first-generation problems, resulted to create an effort
to spruce up the presentation by using flashy designs.
 Usually improves the site’s affective properties because the test is redesigned
and formatted according to guidelines for page layout.
 Graphics and decorative visuals are added.
 Some content are removed to provide more “white space on each page
Problems:
1. Such content removal may result in a drop of the overall effectiveness
of the pages.
2. Web sites have an excessive number of hyperlinks, this adds confusion
and results in overall drop in navigational efficiency.

Third-Generation Web Presentations

 Usually the most difficult to produce successfully, because its goal is to avoid
drop-offs between three main criteria.
 It is designed for presentation effect, affect and efficiency
Problems:
It requires a deeper understanding of the following
1. the intended user audience
2. the purpose of the Web presentation
3. the design demand, opportunities and challenges of the media being
used
4. the information presented and the way it can be hyperlinked.

Fourth-Generation Web Presentation and Beyond

Effect, affect and efficiency improved in the succeeding generations of the
presentation as individual pieces of information are redesigned for multimedia,
interactivity, or connection to other useful Web pages.
How can we achieve understanding?
Understanding is achieved when users use the page and targeted surfers
become users.

Mutual Understanding of user and presenter

The intent of a Web presentation is for sponsoring organization, or presenter, and the
user to reach a mutual understanding by means of their electronic connection.

Two criteria must be met:

1. The presenter must execute a design that reflects an accurate reading of the
mental state of potential users, including their current knowledge, needs,
preferences, and information-handling capabilities.
2. The user must have an accurate reading of the nature of the site, that is,
understand why this particular information is being presented.

How can we achieve a mutual understanding?

Mutual understanding can be achieved when a user’s interpretation of a Web
site matches the company’s intentions for developing the site.

Three Basic Purpose of Designing Web Presentations

1. To Inform (Informational Page) – to provide the user with information that
he/she wants and currently doesn’t have. The user wants to obtain facts, learn
something, or better understand something.

Informational pages should answer questions such as:

 What is it?
 Where is it?
 When does it take place?
 Who does it?
 How does it work?
 How much does it cost?
 How do I buy it?
Information Objects: Maps, tables, charts, graphs, simulations, animated illustrations
and audio/video clips.

Criteria: Effectiveness such clarity, simplicity, directness and reinforcements

2. To entertain (Entertainment Page) – to provide amusement, relaxation or

diversion. User’s want to have fun, play a game or engage in a new experience.

Entertainment pages should have the following emphasis:

 Whimsical
 In variety of attractions and other forms of amusements
 Tent to surprise the user
 Action packed
Criteria: Affectiveness criteria

3. To enable exchange (Exchange page) – allow users to perform some useful

action – buy, submit information, request information, answer questions, or otherwise
interact with the site.
Exchange pages should have the following emphasis:
 Advertisements
 Persuasion
 Fact access
 Search engine equipped
Information is in the forms of
 Interactive order forms
 E-mail addresses
 Registration forms
 Toll-free phone numbers

Threads between Web pages – is composed of the information on a series of Web

pages, with hyperlinks identifying the location of the information and providing
access to it. Primary purpose is to exchange, but in a complete Web presentation
should contain the three elements.