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

2. Chapter 2 2 Multimedia for the Web 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

3. Chapter 2 3 Multimedia for the Web Web site development is project- based process Well-developed plan for site will –Save time –Money –Multiple modifications Rule of thumb for development is 80% planning and 20% production Introduction

4. Chapter 2 4 Multimedia for the Web Plan provides structure Web architecture is blueprint for site: –State purpose –Target audience –Organizational/navigational structures –Multimedia elements –User interface –Layout and design Introduction

5. Chapter 2 5 Multimedia for the Web Introduction

6. Chapter 2 6 Multimedia for the Web Develop a Design Strategy Ensures your Web site effectively achieves purpose for intended audience Shared vision; client and multimedia team clarify the purpose and identify target audience Understand the Design Strategy

7. Chapter 2 7 Multimedia for the Web Succinct purpose defined by goals and objectives Goals support the purpose Objectives must be clear, measurable, and obtainable Writing goals and objectives is critical as they guide the development process Purpose

8. Chapter 2 8 Multimedia for the Web 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

9. Chapter 2 9 Multimedia for the Web Imperative to determine what your client wants in advance Ask 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

10. Chapter 2 10 Multimedia for the Web Part of planning is educating client about what is practical, possible and eye-catching Client is the visionary of the Web site Important for multimedia team to articulate that vision Purpose

11. Chapter 2 11 Multimedia for the Web Consider the audience Focus on the user Tailor Web site to meet user’s needs and wants User profile: picture about the people using the site — their online and offline habits Target Audience

12. Chapter 2 12 Multimedia for the Web 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

13. Chapter 2 13 Multimedia for the Web Determine technology available to view your Web site Many users require adaptive technologies Alternate text used by screen readers for blind users Target Audience

14. Chapter 2 14 Multimedia for the Web Audience sets the tone, approach, metaphor and emphasis of site Tone: makes a statement Approach: direction to user Metaphor: a theme to aid user Emphasis: whether site will utilize multimedia elements Target Audience

15. Chapter 2 15 Multimedia for the Web 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

16. Chapter 2 16 Multimedia for the Web Creative brief provides summary of the design strategy and process including: –Objectives –Purpose –Target Audience Creative Brief

17. Chapter 2 17 Multimedia for the Web 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 Identify Web Site Categories

18. Chapter 2 18 Multimedia for the Web Identify Web Site Categories

19. Chapter 2 19 Multimedia for the Web Documents used to establish the scope and feel of the site Flowcharts Wireframes Storyboards Define the Planning Documents

20. Chapter 2 20 Multimedia for the Web Visual guide of the Web site Graphical representation of how info in site is organized and flows Flowchart is a flexible document Used to illustrate interactivity Flowcharts

21. Chapter 2 21 Multimedia for the Web 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

22. Chapter 2 22 Multimedia for the Web 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 and Storyboards

23. Chapter 2 23 Multimedia for the Web Wireframes

24. Chapter 2 24 Multimedia for the Web Storyboards

25. Chapter 2 25 Multimedia for the Web Organizational structure: the way in which information is organized Hierarchical Nonlinear Linear Data-base driven Explore Organizational Structure

26. Chapter 2 26 Multimedia for the Web 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

27. Chapter 2 27 Multimedia for the Web Hierarchical Organizational Structure

28. Chapter 2 28 Multimedia for the Web No prescribed or sequential path Links from one discrete piece of information to another Nonlinear Organizational Structure

29. Chapter 2 29 Multimedia for the Web Organizes information sequentially Traditional method of navigation with a set sequence Examples include training sites, online slide show Linear Organizational Structure

30. Chapter 2 30 Multimedia for the Web 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

31. Chapter 2 31 Multimedia for the Web 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

32. Chapter 2 32 Multimedia for the Web Means through which users know where they are, where they have been, and where they want to go Limit the amount of data the user must keep in short-term memory Investigate Navigational Structure

33. Chapter 2 33 Multimedia for the Web Use small, discrete units of information, not long, undifferentiated units Offer simple, consistent navigation available from every page Investigate Navigational Structure

34. Chapter 2 34 Multimedia for the Web Frames divide screen into multiple pages One region of screen remains constant Good for navigation Con: Cannot bookmark specific page Frames

35. Chapter 2 35 Multimedia for the Web Found on almost every Web site in one form or another Text-only navigation bar is practical for vision-impaired users who rely on screen readers Text often used with images/icons Navigation Bar

36. Chapter 2 36 Multimedia for the Web Position consistently on every page Drawback 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

37. Chapter 2 37 Multimedia for the Web Navigation Bar

38. Chapter 2 38 Multimedia for the Web Cumbersome navigation method Relies too heavily on browser’s Back button Users must return to the home page to go to the other pages of Web site Hub and Spokes

39. Chapter 2 39 Multimedia for the Web Users navigate directly to content of interest Enter specific search terms Follows standard search guidelines Provides interface for more complicated searches Search

40. Chapter 2 40 Multimedia for the Web Efficient: tailoring site to user User asked to provide information when entering site –zip code, for example Based on information entered, user directed to a specific page Directed Navigational Structure

41. Chapter 2 41 Multimedia for the Web Domain Name Selection Web Site Hosting Search Engine Registration Discuss Additional Multimedia Web Site Tasks

42. Chapter 2 42 Multimedia for the Web Numeric address called IP Address (Internet Protocol) Points to a specific location or Web page on the Internet Domain names uses easy-to- remember names instead of numeric string Domain Name Selection

43. Chapter 2 43 Multimedia for the Web Domain name is a pointer to a numeric Web address Organized according to DNS naming hierarchy: –Structured arrangement of ascending authority –Root is referred to as “.” (dot) and directly beneath are top-level domains Domain Name Selection

44. Chapter 2 44 Multimedia for the Web Powerful marketing tool Select a name easy to use Name must be registered with registry authority to issue and license domain names Domain Name Selection

45. Chapter 2 45 Multimedia for the Web Domain Name Selection

46. Chapter 2 46 Multimedia for the Web Once designed, site must be uploaded to Web server accessible to Internet community Can buy a Web server and host site in-house, or outsource to Web-hosting company Web Site Hosting

47. Chapter 2 47 Multimedia for the Web Web-host maintains server, network connections, and security of your site on 24-hour basis Different prices for different services Free sites available, but have limitations Web Site Hosting

48. Chapter 2 48 Multimedia for the Web 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

49. Chapter 2 49 Multimedia for the Web 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 Web Site Hosting Considerations

50. Chapter 2 50 Multimedia for the Web Security keeps data secure from hackers Customer Services Price: cheaper is not always better Compare features to effectively compare prices Web Site Hosting Considerations

51. Chapter 2 51 Multimedia for the Web Register with search engines in order for users to find your multimedia site Use a business who specializes in registering, or use online services Basic information about your site will need to be supplied Search Engine Registration

52. Chapter 2 52 Multimedia for the Web Understand the Design Strategy Purpose Target Audience Technology Specifications Creative Brief Identify Web Site Categories Summary

53. Chapter 2 53 Multimedia for the Web Define the Planning Documents Flowcharts Wireframes and Storyboards Explore Organizational Structure Hierarchical Organizational Structure Nonlinear Organizational Structure Summary

54. Chapter 2 54 Multimedia for the Web Linear Organizational Structure Data-base Driven Organizational Structure Site and Link Maps Frames Navigation Bar Hub and Spokes Summary

55. Chapter 2 55 Multimedia for the Web Search Directed Navigational Structure Domain Name Selection Web Site Hosting Web Site Hosting Considerations Search Engine Registration Summary