Hypertext and the World Wide Web

Recognizing Potential Hypertext Projects

• A large body of information exists and is organized into several fragments
• Fragments are interrelated
• User only needs to access to small # of fragments at a time

Dangers of Hypertext

• Project content inappropriate for hypertext
• Poor hypertext design (e.g. too many links, long chains, dull articles, inadequate overviews)

Hypertext Authoring Tool Actions

• Import
• Edit
• Export
• Print
• Search

Web Authoring Tool Requirements

• Full set of direct manipulation editing functions
• Link list management tools
• Link verification
• Range of display formatting
• Availability of search and replace
• Control of color
• Capability to switch between authoring and editing
• Availability of graphics and video embedding or editing tools
• Collaboration possible
• Data compression
• Security control
• Encryption
• Reliability
• Import and export of standard interchange formats

Hypertext Design Considerations

• Know users and their tasks
• Ensure meaningful structure comes first
• Multidisciplinary design team
• Respect chunking
• Show interrelationships within and between documents explicitly
• Be consistent in creating document names
• Work form master reference lists
• Ensure simplicity in traversal
• Design each screen carefully
• Require low cognitive load

Introductory Article Details

• Executive overview
• Top down (TOC like)
• Menu
• Search strategy

Web Site Organization

• Originator's identity
• Originator's goals interpreted by designer (sales, advertising, information, access, services, discussion, nurture community)
• Number of pages or amount of accessible information

Web Site Knowledge Structures

• Unstructured lists
• Linear structures
• Arrays or tables
• Hierarchies or trees
• Multi-trees or faceted retrieval
• Networks

Web Actions

• Formulation
• Action
• Results
• Refinement

Web Interface Metaphors

• File cabinet
• Books with chapters
• Encyclopedia with articles
• Television with channels
• Shopping mall with stores
• Museum with exhibits

Handles and Widgets

• Labels
• Icons
• Buttons
• Image maps
• Navigation handles on page borders

Planning and Design of Effective Web Sites

Design Challenges - content must be:

• Understandable
• Interesting and valuable
• Capable of converting web surfers into site users
• Consistent and engaging
• Skilled integration of text, graphics, audio, video, and information
• Easily navigated
• Unified in look and feel

Essential Design Criteria

• Effectiveness (complete, organized presentation)
• Affectiveness (captures user attention)
• Navigational efficiency

First Generation Web Sites

• Content focused
• Ignores flash
• Few links

Second Generation Web Sites

• Flashy features added for their own sake
• Lots of hyperlinks

Third Generation Web Sites

• Balances 3 design components
• Requires deeper under standing of intended audience, purpose of web presentation, design challenges, media opportunities, and information presented

Fourth Generation Web Sites

• Increased interactivity
• Providing live access to current content
• Multimedia
• Smart links and knowledge engineering

Mutual Understandings Between Designers and Users

• Designer must execute a design that reflects user knowledge, capabilities, and information needs
• User must have accurate perception of web site purpose and the information being presented

Users form then initial impression of a web site within the first 7 seconds of access.

While at a web site, users continuously evaluate their progress toward accomplishing their goals.

Web Site Purposes

• Entertainment
• Enable information exchange
• Information (what, where, when, who, how, cost)

Web Creator Roles

• Presenter (client)
• Information steward
• Designer

Designers must:

• Understand information (semantics)
• Translate information to structure
• Translate structure to web pages
• Have artistic sense
• Have capacity for language selection and use
• Be able to work with multimedia technology
• Be able to work with client/server technology (database, web access, security)

Research and Idea Generation

• Define information for each group of expected users
• Statement of what web presentation is to do
• List of information resources

Available Idea Generation Techniques

• Brainstorming
• Interviews
• Virtual value chain analysis (business process analysis and value added benefits to customers)
• Web research

Defining Information Domain

• User-centered approach (identify each user group and determine information needs)
• Information-centered approach (each type of information is classified and the clustered according to potential user group needs)

Questions which might be asked:

• What do potential users want to know about the company?
• What do users want to know about the people?
• What do users want to know about company business?
• How might users want to interact with our company?

Information Decomposition and Information Structuring

Decomposition - process of separating information into component objects or chunks

Each chunk needs to be tracked.

Tracking Techniques

• List or outline
• Group of index cards
• Database
• CASE tool

Information Structuring Guidelines

• Chunks organized into a directed graph
• Add cardinality information to each graph node
• Add volatility information to each graph node
• Consider redrawing the diagram as a summary diagram
• Create object relationship matrix
• Examine matrix for critical objects
• Revise summary diagram as needed

Object Relationship Types

• General to specific
• Isa
• Associative

Web Design Process

• Establish content and location of each information object using text analysis and composition
• Identify and implement hyperlink targets
• Identify and implement multimedia options
• Test and revise

Text analysis - develop best prose statements to convey intended message for each information object

Text composition - all objects are organized, rearranged, and regrouped until best web site placement is found (relies on storyboarding techniques)

Web Page Composition

• Layout
• Typography
• Color

Once a complete set of web pages is storyboarded the storyboard are arranged in predicted thread order.

Each thread needs to be analyzed for gaps and sequencing problems.

Testing of final threads is done by walking through each one using the appropriate user viewpoint.

Hyperlink Types

• Intra-page (simply access in long complex pages)
• Intranet (used to create threads for users, show business relationships, breakup long web pages)
• Intersit (value added stuff when another site is complete, accurate, compatible with your site, appeals to audience, supports page goals)

Linkage evaluation is done by building a linkage diagram and examining ratios of actual links to total possible for each page.

Ratio of links should be 40-60%.

7 plus or minus 2 is another good rule of thumb for links from given page.