Chapter 8 Designing Web Sites

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 2 OBJECTIVES Why a Web site? Life Cycle of Site Building Ways to Build a Web site Web Navigation Design Design Criteria

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 3 WHY A WEB SITE? Reach Customers Quickly and Reliably Establish a Presence in Cyberspace Leverage Advertising Costs Reduce Customer Service Cost Promote Public Relations Penetrate International Markets Test-market New Products and Services

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 4 LIFE CYCLE OF SITE BUILDING Plan the Site Define Audience and Connection Build Site Content Define Site Structure Visual Design

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 5 PLAN THE SITE Define the Site’s Goals –Determine Who Will Be Involved –Understand the Time and Need Constraints Ask Questions Deciding on Site’s Mission and Purpose for the Organization

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 6 PLANNING OBJECTIVES Speed up Interactive Process Reduce Human Intervention to a Minimum Save Time Save Buying and Selling Costs

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 7 DEFINE AUDIENCE AND COMEPETITION Generate a List of Intended Audience Identify What Prospective Customers Want

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 8 HOW CUSTOMERS JUDGE WEB SITES Product Prices Product Representation Product Selection Shipping and Handling Delivery Ordering Privacy Policy Web Navigation

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 9 WEB DESIGN Focus on Speed and Responsiveness Create Scenarios and Test Cases Select a Set of Users for Trial

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 10 COMPETITVE ANALYSIS Make a List of Competitors Evaluate Criteria: –Personalization –Consistency –Ease of Navigation

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 11 BUILD SITE CONTENT Create Content Inventory Determine Priority of Each Department Analyze Feasibility of Each Function

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 12 DEFINE SITE STRUCTURE Create Good Site Structure Explore Various Metaphors Define Architectural Blueprints Decide User Navigation

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 13 VISUAL DESIGN Use Layout Grid –Show icons, buttons, banners, etc. Establish Look and Feel of Site via Page Mock-ups Develop Web Personalization

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 14 WAYS TO BUILD A WEB SITE Storefront Building Service ISP (Web Hosting) Service Do It Yourself

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 15 STOREFRONT BUILDING SERVICE Offers Customized Online Store –Provide Web Address –Manage Web Traffic –Maintain Store on Web Servers Drawbacks – Lack of Personalization

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 16 ISP SERVICES Provide E-Commerce Software Offer Well-Versed in Store-building Technology Advantage – Good Customer Support

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 17 DO IT YOURSELF Requires Experience –Security –Web Traffic Management –Responsive Support –Full-Time Web Administration Benefits – Unlimited Upgrades and Customization

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 18 WEB NAVIGATION DESIGN Create User Profiles –Keep Human Factor as Part of the Design Use Scenarios –Help View Navigation Process

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 19 DESIGN TIPS Keep the Site Simple Address the Problem the Web site Needs to Solve Enhance Response Time Raise Transmission Speed Focus on Content Ensure Company’s Name Visible Emphasize on Appearance Allow Easy Return to Homepage

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 20 DESIGN CRITERIA Appearance Public Exposure Consistency Scalability Security Performance Navigation and Interactivity

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 21 APPEARANCE Is the Site Aesthetically Pleasing? Conduct Quality Assurance –Check the readiness of a Web site –Examine how easy it passes under the stress of a Web production schedule Use a Style Guide –Ensure consistency within the site

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 22 PUBLIC EXPOSURE Site Availability –Networking and Technology Infrastructure –Network Administrators and Web Designers

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 23 CONSISTENCY Will the Web site and Contents Appear the Same on Visitors’ Screens? Usage of HTML Provide Choice of Browser

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 24 SCALABILITY Does the Site Provide a Seamless Growth Path? Capable of Being Expanded Protection of Initial Investment

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 25 SECURITY Protect from Hackers Critical – Web site Access Knowledge of Developers

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 26 PERFORMANCE How Long Does It Take for the Page to Appear? Depend on Local Networking, Traffic Volume, Web Connection 45-second Timer

Awad –Electronic Commerce 2/e © 2004 Pearson Prentice Hall 27 NAVIGATION & INTERACTIVITY How a Visitor Gets from One Page to Another Format Icons and Buttons Give out Function Descriptions of Each Icon

Chapter 8 Designing Web Sites