Creating a Winning E-Business Second Edition

1. MIS/ENTR 375 Global E-Commerce Creating a Winning E-BusinessSecond Edition Designing Your Web Site Chapter 8

2. Learning Objectives • Explain the Web site planning process • Analyze Web site organization • Plan useful and attractive Web pages • List advantages and disadvantages of outsourcing Web design

3. Web Site Planning Process • Identify the site’s business objectives • Selling products or services • Educating consumers • Providing technical support • Collecting information from visitors • Offering a virtual community to customers • Directing consumers to other useful sites • Recruiting talented employees

4. Web Site Planning Process (continued) • Understand who will visit the site • Understand what visitors will do at the site • Primary audience consists of the targeted customers identified in business plan • Secondary audiences • Vendors • Strategic partners • Investors • General public

5. Web Site Planning Process (continued) • Design the site to accommodate the most common technological constraints • Experienced or novice users • Browser and version commonly used • Internet connection speeds • Screen resolutions used • Fixed-width pages • Pages that resize with the browser window

6. Web Site Organization • Home page should answer basic visitor questions: • Who are you? • What do you do? • Where can I find what I want or need? • Why should I be interested in your products or services?

7. Web Site Organization (continued) • Secondary pages • Customer login page • Products or services pages • “Shopping cart” page • Shipping and return policy pages • Customer support pages • Contact information pages • “About Us” pages

8. Web Site Organization (continued) • Secondary pages (continued) • Privacy policy and acceptable use pages • Frequently asked questions (FAQ) pages • Employment opportunities pages • “What’s New?” pages • Customer stories or case studies pages • Affiliate program pages • Help pages

9. Web Site Organization (continued) • Linear structure • A series of pages linked in sequential order

10. Web Site Organization (continued) • Webbed structure • Pages are linked together without regard for how the content fits logically

11. Web Site Organization (continued) • Pure hierarchical structure • Similar to business organizational chart • Information is organized in levels • Home page at Level 1 (top-level) • Main topic pages at Level 2 • Additional details about main topics at remaining levels

12. Web Site Organization (continued)

13. Web Site Organization (continued) • Mixed hierarchical structure • Combines structured organization with cross-linked pages

14. Web Site Organization (continued) • Site organization • Should enable visitors to find actionable content quickly and easily • Be neither too flat nor too deep • Logical and intuitive • Avoid a structure that is either too flat or too deep • Structure that is too flat is uninteresting • Structure that is too deep is difficult to navigate

15. Web Site Organization (continued) • Web site storyboard • Used to test a Web site organizational plan • Manual mock-up of site’s organization • Index cards, sticky notes, sheets of paper represent individual Web pages • Use push pins or tape to fasten cards, notes, of sheets of paper to white board or corkboard • Create connecting lines indicating links • Look for illogical links, orphan pages, missing pages

16. Web Site Organization (continued)

17. Useful and AttractiveWeb Pages • Web accessibility – Designing Web pages so that Web resources are available to people with disabilities • W3C guidelines for accessibility • Visual or auditory content is supported by alternative content • Color alone should not indicate a link • Adequate contrast for background/foreground colors

18. Useful and AttractiveWeb Pages (continued) • W3C guidelines for accessibility (continued) • Simply worded text • Movement, scrolling, and blinks can be turned off without loss of information or navigation • Navigational links are clear and consistent • Page content is consistent across all pages

19. Useful and AttractiveWeb Pages (continued) • Web usability • Designing Web pages to help all visitors accomplish their goals at a site quickly and easily • Consistency across all pages • All pages should have a common “look and feel” • Elements in same position • Standard color scheme

20. Useful and AttractiveWeb Pages (continued)

21. Useful and AttractiveWeb Pages (continued) • Navigational elements (internal links) • Embedded text links • Clickable table of contents and top-of-page links • Navigation bars • Navigation menus • Navigation tabs • Breadcrumb trail • Site map

22. Useful and AttractiveWeb Pages (continued) • Embedded text links • Link positioned inside a paragraph • Text in link should clearly describe what page visitors will see • Use Zax Phones • Do not use Click here • Clickable table of contents and top-of-page links • Use to navigate topics on a long Web page • Allow visitors to read subtopics and return to the top of the page without scrolling

23. Useful and AttractiveWeb Pages (continued) • Navigation bars, menus, and tabs • Navigation bar is a series of graphic or text-based internal links • Often found at the top or bottom of Web page • Navigation menu is a list of internal links • Navigation tabs are similar to file folder tabs • Both are used to conserve space on a page

24. Useful and AttractiveWeb Pages (continued) • Breadcrumb trail • Hierarchical navigational outline • Provides visitor with feedback on path taken to current page • Use in conjunction with other navigational elements

25. Useful and AttractiveWeb Pages (continued) • Site map • Web page that shows a summary of all the linked pages at the site • Rollover links • Hidden links that appear when mouse is “rolled over” an animated image • Avoid rollover links

26. Useful and AttractiveWeb Pages (continued) • Page layout • Fixed-width pages fit in a maximized browser window for a specific screen resolution • Liquid design creates pages that size with the browser window • Use tables (arrangement of columns and rows) • Use CSS (cascading style sheets)

27. Useful and AttractiveWeb Pages (continued) • Page length • Keep pages short to avoid vertical scrolling • Splash pages and frames • Avoid them • Search function and forms • Add access to search function on all relevant pages • Use forms to collect information

28. Useful and AttractiveWeb Pages (continued) • Writing for the Web • Use simple, direct language • Avoid industry jargon • Use bulleted and numbered lists • Use dark text color on light background • Use a familiar font • Use at least a 12-point equivalent font • Check spelling and grammar, and proofread

29. Useful and AttractiveWeb Pages (continued) • Choose color scheme carefully • Use images, audio, and video sparingly and only when they support the Web site message • Avoid background images • Add alternative text to image links • Add related text links to support image links

30. Web Design Outsourcing • Carefully assess costs of in-house Web design and development compared to outsourcing costs • Outsourcing benefits • May save time and money • Provides greater access to experienced specialists familiar with current best practices and trends • May provide access to usability analysis