Multimedia for the Web: Creating Digital Excitement Planning the Multimedia Web Site

Multimedia for the Web: Creating Digital Excitement

Planning the Multimedia Web Site

2Multimedia for the Web Chapter 2

Understand the Design Strategy

Identify Web Site Categories

Define the Planning Documents

Explore Organizational Structure

Investigate Navigational Structure

Discuss Additional Web Site Tasks

Chapter Concepts


Web site development is project-based processWell-developed plan for site will– Save time– Money– Multiple modifications

Rule of thumb for development is 80% planning and 20% production

Introduction


Plan provides structure

Web architecture is blueprint for site:– State purpose

– Target audience

– Organizational/navigational structures

– Multimedia elements

– User interface

– Layout and design

Introduction


Introduction


Develop a Design StrategyEnsures your Web site effectively achieves purpose for intended audienceShared vision; client and multimedia team clarify the purpose and identify target audience

Understand theDesign Strategy


Succinct purpose defined by goals and objectivesGoals support the purposeObjectives must be clear, measurable, and obtainableWriting goals and objectives is critical as they guide the development process

Purpose


To determine purpose:– How will users be using this Web site?

– Why visit this site?

– What will users gain from Web site?

– Which browser/platform will users use to access this Web site?

– What types of features will be most useful to the users?

Purpose


Imperative to determine what your client wants in advanceAsk client site specifics:– How to handle secured transactions– What action should user take after

visiting site?– Is there a specific budget?– What is the domain name?

Purpose


Part of planning is educating client about what is practical, possible and eye-catchingClient is the visionary of the Web siteImportant for multimedia team to articulate that vision

Purpose


Consider the audienceFocus on the userTailor Web site to meet user’s needs and wantsUser profile: picture about the people using the site — their online and offline habits

Target Audience


Ways to determine user profile include– In-person interviews– Online surveys– Focus groups

Users like to feel in control; give users opportunity to choose of create their own experience

Target Audience


Determine technology available to view your Web siteMany users require adaptive technologiesAlternate text used by screen readers for blind users

Target Audience


Audience sets the tone, approach, metaphor and emphasis of siteTone: makes a statementApproach: direction to userMetaphor: a theme to aid userEmphasis: whether site will utilize multimedia elements

Target Audience


Playback system:– Operating system, bandwidth,

browser

Multimedia elements to be included:– Style sheets for comparable quality

Functionality– How program reacts to an action

User Interface

Technology Specifications


Creative brief provides summary of the design strategy and process including:– Objectives

– Purpose

– Target Audience

Creative Brief


Static Sites– Serve the purpose of self-branding

– Passive, require few design or technology changes

Dynamic Sites– Provide information and offer some

form of interactivity





Documents used to establish the scope and feel of the siteFlowchartsWireframesStoryboards



Visual guide of the Web siteGraphical representation of how info in site is organized and flowsFlowchart is a flexible documentUsed to illustrate interactivity

Flowcharts


Wireframes created to answer “what” questions related to site– Text-only skeletal structure of every

click-through possibility

Storyboards answer “how” questions related to the site– Diagrams of the layout of each page

Wireframes and Storyboards


Describe the content and sequence of each page

Specify how text, graphics, animation, multimedia elements are positioned on each screen

Design changes here save money on development



Wireframes


Storyboards


Organizational structure: the way in which information is organized

Hierarchical

Nonlinear

Linear

Data-base driven



Top-down approach

Sets and subsets of information form a hierarchy

Information is chunked down

Can be ‘broad and shallow’ or ‘deep and narrow’

Hierarchical Organizational Structure




No prescribed or sequential path

Links fromone discretepiece of informationto another

Nonlinear Organizational Structure


Organizes information sequentially

Traditional method of navigation with a set sequence

Examples include training sites, online slide show

Linear Organizational Structure


Increasingly popular

Large volume of short bits of information

Sites that use internal search engine use databases

Common examples are library, research, and e-commerce sites

Database-Driven Organizational Structure


Site map– Overview of the organizational

structure of site

– Graphical or text-based menu format

Link map– Schematic illustrating

interconnectivity with site as well as external links

Site and Link Maps


Means through which users know where they are, where they have been, and where they want to goLimit the amount of data the user must keep in short-term memory



Use small, discrete units of information, not long, undifferentiated unitsOffer simple, consistent navigation available from every page



Frames divide screen into multiple pagesOne region of screen remains constantGood for navigationCon: Cannot bookmark specific page

Frames


Found on almost every Web site in one form or anotherText-only navigation bar is practical for vision-impaired users who rely on screen readersText often used with images/icons

Navigation Bar


Position consistently on every pageDrawback to image-based navigation bars: – Larger file size makes page slower to

download– Not accessible to screen readers

unless alternative text is present

Navigation Bar


Navigation Bar


Cumbersome navigation methodRelies too heavily on browser’s Back buttonUsers must returnto the home pageto go to the otherpages of Web site

Hub and Spokes


Users navigate directly to content of interestEnter specific search termsFollows standard search guidelinesProvides interface for more complicated searches

Search


Efficient: tailoring site to userUser asked to provide information when entering site – zip code, for example

Based on information entered,user directed to a specific page

Directed Navigational Structure


Domain Name SelectionWeb Site HostingSearch Engine Registration

Discuss Additional Multimedia Web Site Tasks


Numeric address called IP Address(Internet Protocol)Points to a specific location or Web page on the InternetDomain names uses easy-to-remember names instead of numeric string

Domain Name Selection


Domain name is a pointer to a numeric Web addressOrganized according to DNS naming hierarchy:– Structured arrangement of

ascending authority– Root is referred to as “.” (dot) and

directly beneath are top-level domains



Powerful marketing toolSelect a name easy to useName must be registered with registry authority to issue and license domain names





Once designed, site must be uploaded to Web server accessible to Internet communityCan buy a Web server and host site in-house, or outsource to Web-hosting company

Web Site Hosting


Web-host maintains server, network connections, and security of your site on 24-hour basisDifferent prices for different servicesFree sites available, but have limitations

Web Site Hosting


Storage space for Web site

Bandwidth for connection speed

Peering: host has multiple Internet connections to route traffic in and out

Performance

Technical support

Web Site Hosting Considerations


E-commerce

Scripts and software to use to add features to the site

Co-location facilities offer a secure place to physically house hardware

Site administration



Security keeps data secure from hackers

Customer Services

Price: cheaper is not always better

Compare features to effectively compare prices



Register with search engines in order for users to find your multimedia siteUse a business who specializes in registering, or use online servicesBasic information about your site will need to be supplied

Search Engine Registration


Understand the Design Strategy

Purpose

Target Audience

Technology Specifications

Creative Brief


Summary



Flowcharts




Nonlinear Organizational Structure

Summary


Linear Organizational Structure

Data-base Driven Organizational Structure

Site and Link Maps

Frames

Navigation Bar

Hub and Spokes

Summary


Search

Directed Navigational Structure


Web Site Hosting


Search Engine Registration

Summary