1. Web Development A Visual-Spatial Approach
Chapter 1
Process of Web Development

2. Learning Objectives A basic overview of Web development
Roles and skills involved in Web development
Unique characteristics of Web sites
The visual-spatial approach to Web development
An overview of the Web development process
Suggested methods of improving Web development skills
Baehr
Web Development: A Visual-Spatial Approach
Copyright © 2007 by Pearson Education, Inc. All rights reserved.

3. Web Development
The development and increasing use of the World Wide Web for business, education, and entertainment has contributed to the evolution of Web development as an important discipline in online publishing and communication
Baehr
Web Development: A Visual-Spatial Approach
Copyright © 2007 by Pearson Education, Inc. All rights reserved.

4. Web Development Requires a wide range of skills, including: writing
editing
graphic design
usability testing
project management
scripting
programming
computer software use
Baehr
Web Development: A Visual-Spatial Approach
Copyright © 2007 by Pearson Education, Inc. All rights reserved.

5. Web Development While a designer may not need to master every skill,
there are a wide variety of online resources, software tools, and specialists that can be of assistance to the designer.
Web development teams often include a wide range of roles, including:
project manager
programmer
graphic artist
writer/editor
content provider
usability tester
server administrator
Web development skills can be developed with formal training, self-study, and practice
Baehr
Web Development: A Visual-Spatial Approach
Copyright © 2007 by Pearson Education, Inc. All rights reserved.

6. Team Roles Summary Project Manager Programmer Graphic Artist
Writer/Editor
Content Provider
Usability Tester
Server Administrator
ITIS /24/2003 7:57 PM 6

7. Web Development Terms Home page Hyperlink Hypertext Interface
The first page, or starting page, in a Web site.
Hyperlink
Clickable text or visuals that link two related elements, such as pages, content chunks, or headers.
Hypertext
Chunks of textual and/or graphic content linked together by hyperlinks.
Interface
The whole screen or page a user sees, including the textual, graphic, and interactive content.
Navigation tools
Any hyperlinks or buttons used to search, browse, and interact with the site, excluding browser controls.
Baehr
Web Development: A Visual-Spatial Approach
Copyright © 2007 by Pearson Education, Inc. All rights reserved.

8. Web Development Terms Node Site architecture User-centered design
A single page that acts as a gateway and leads to related pages.
Site architecture
The overall site structure and arrangement of individual pages that comprise a whole site.
User-centered design
A design approach that places users needs at the center of the design process.
Visual-spatial thinking
A method in which users conceptualize the whole Web site, by focusing and discerning the function and meaning of visual and spatial objects and their unique characteristics.
Web page
A single page of Web content from a Web site.
Baehr
Web Development: A Visual-Spatial Approach
Copyright © 2007 by Pearson Education, Inc. All rights reserved.

9. Visual-Spatial Thinking
Web sites have unique characteristics that distinguish them from print-based documents
interactivity
use of visuals and media
complex structures
rapid evolution
Have unique visual and spatial characteristics
A visual-spatial approach is important to the Web development process because it considers the ways in which users perceive and conceptualize visual and spatial aspects of Web sites.
Baehr
Web Development: A Visual-Spatial Approach
Copyright © 2007 by Pearson Education, Inc. All rights reserved.

10. Visual-Spatial Thinking
Five principles of visual thinking that apply well to our understanding of Web sites are:
vision is selective
fixation solves a problem
discernment in depth
shapes are concepts
complete the incomplete
Five concepts that incorporate this approach are:
visual focus
problem solving
contextual
conceptual
wholeness
Baehr
Web Development: A Visual-Spatial Approach
Copyright © 2007 by Pearson Education, Inc. All rights reserved.

11. Visual-Spatial Approach
Table 1-2
Page 8

12. Web Development Process
The process of Web development is both a holistic and iterative one, which involves five major phases:
Planning
Conceptual phase that involves identifying the subject, audience, purpose, context, scope, and functionality of the site.
Content
Researching, writing, and adapting content for individual Web pages, including markup and scripting.
Structure
Developing the overall site structure, arrangement of pages, and site navigation tools.
Design
Designing the visual content, page layouts, and interface elements.
Usability
Formal comprehensive testing of the site for usability and accessibility prior to publishing the site.
Baehr
Web Development: A Visual-Spatial Approach
Copyright © 2007 by Pearson Education, Inc. All rights reserved.

13. Improving Web Development Skills
Courses
Self Study
Practice!
Study existing Web Sites
What works for the site?
What does not work?

14. Last page of the Internet

15. Summary
ITIS /24/2003 7:57 PM 15

16. Assignment See Assignments web page for details
ITIS /24/2003 7:57 PM 16