Download T.1.1.PP - compSciToday

LESSON
1
Module 1: The History and the Future of the Web
The Evolution of Web
Design
L E S S O N
1
Module 1: The History and the Future of the Web
Lesson Overview
In this lesson, we will:

Discuss the history and impact of the Web

Understand and discuss the evolution of Web design

Discuss the history and impact of Web technologies

Use Web technologies to increase productivity and enjoyment
L E S S O N
1
Module 1: The History and the Future of the Web
Guiding Questions

How has the Web transformed your life?

What technologies make using the Web more engaging and exciting on
your computer or a hand-held device?

Why do you think there is a need for the W3C (World Wide Web
Consortium)?
L E S S O N
1
Module 1: The History and the Future of the Web
Development of the WWW

Tim Berners-Lee

Web developed at CERN (European Organization for Nuclear Research)

Web popularized the Internet
L E S S O N
1
Module 1: The History and the Future of the Web
W3C (World Wide Web Consortium)
 Established in 1994
 Tim Berners-Lee has served as the director
 Based at MIT
L E S S O N
1
Module 1: The History and the Future of the Web
Browsers
 Allow users to view content on the Web
 Mosaic early cross-platform graphical browsers
 Other early browsers include WorldWideWeb, ViolaWWW, Midas, and
Samba
 Today’s browsers include Internet Explorer, Firefox, Opera, Flock,
Mozilla, and Safari
L E S S O N
1
Module 1: The History and the Future of the Web
Browser Wars Market Share Percentage
1995
1997
1999
2001
80.1
57.6
30.7
9.8
2.9
39.4
67.5
89.9
17.0
3.0
1.8
.3
Based on figures from OnStat.com
2003
3.7 Netscape
95.9 IE
.4 Other
L E S S O N
1
Module 1: The History and the Future of the Web
Web Site Design

Plan

Analyze

Design

Test and Refine
L E S S O N
1
Module 1: The History and the Future of the Web
The First Generation of Web Design

Static pages

Navigation hyperlinks

Guest books

Forms sent via e-mail

Early examples
http://www.dejavu.org/1994win.htm
http://www.slac.stanford.edu/history/earlyweb/firstpages.shtml
L E S S O N
1
Module 1: The History and the Future of the Web
The First Generation of Web Design

Non-compliance with standards by browsers

Limited by technology

Small monochrome monitors

Dial-up connectivity

Slow Internet connection
L E S S O N
1
Module 1: The History and the Future of the Web
Second Generation of Web Design

Online presence for businesses was essential

Interactivity of the Web

24-hour access

Global reach

Ability to present product information
L E S S O N
1
Module 1: The History and the Future of the Web
Second Generation of Web Design

Intuitive, user-friendly navigation system

Use of forms

Focus on content

Banners, frames, and tables

Blinking text, hit counters, marquees

“This site is best viewed in …”
L E S S O N
1
Module 1: The History and the Future of the Web
Third Generation of Web Design

Sites designed to target specific audience

Focus on content

Intuitive, user-friendly navigation systems

Use of forms, splash page, CSS, and portals
L E S S O N
1
Module 1: The History and the Future of the Web
Fourth Generation of Web Design – Web 2.0

Participatory, interactive, and personalized

Compliance with Web standards

Consistent design for professional look

Usability and accessibility issues

Careful selection of typography
L E S S O N
1
Module 1: The History and the Future of the Web
Fourth Generation of Web Design

Dynamically-generated content by the user

Content-authoring tools for editing

Internet privacy

Social networking, video sharing

Rounded corners, subtle 3D effects

Larger text
L E S S O N
1
Module 1: The History and the Future of the Web
Fourth Generation of Web Design

Open Source

File Sharing

Freemium Business Model

RSS Feeds

Web Services
L E S S O N
1
Module 1: The History and the Future of the Web
New Tools of Web 2.0

Wikis

Blogs

Podcast (derived from iPod and broadcast)
L E S S O N
1
Module 1: The History and the Future of the Web
Practice

Using http://www.dejavu.org/1994win.htm, a first-generation Web
site, compare its characteristics to those of today’s sites.

Using http://slac.stanford.edu/history/earlyweb/firstpages.shtml, a
first-generation Web site, compare its characteristics to those of
today’s sites.

How would you enhance their functionality?
L E S S O N
1
Module 1: The History and the Future of the Web
Practice


Usability and Accessibility Scavenger Hunt

Refines search techniques

Reinforces classroom instruction about the Web design process
Evolution of Well-known Corporate Web Sites

Using http://www.wakeuplater.com, select three sites and note
how they have evolved.
L E S S O N
1
Module 1: The History and the Future of the Web
Lesson Review
During this lesson, you learned:

The History and Impact of the Web

The Evolution of Web Design

The History and Impact of Web Technologies