planning an effective web presence web interface design l.
Skip this Video
Loading SlideShow in 5 Seconds..
Planning an effective web presence: web interface design PowerPoint Presentation
Download Presentation
Planning an effective web presence: web interface design

Loading in 2 Seconds...

play fullscreen
1 / 30

Planning an effective web presence: web interface design - PowerPoint PPT Presentation

  • Uploaded on

Planning an effective web presence: web interface design. MGMT 230 Week 5. This week we will cover:. Elements of web visual, interface, and functional design: website usability Designing web sites for global audiences. Steps in planning an effective web presence. Determine site goals

I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
Download Presentation

Planning an effective web presence: web interface design

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.

- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
this week we will cover
This week we will cover:
  • Elements of web visual, interface, and functional design: website usability
  • Designing web sites for global audiences
steps in planning an effective web presence
Steps in planning an effective web presence
  • Determine site goals
  • Identify the target audience and create user profiles of audience members
  • Conduct market research and competitive analysis
  • Design the site for audience, functionality, and usability
customer centric web site design and usability
Customer-Centric Web Site Design and Usability
  • Ecommerce sites are encouraged to focus on the CUSTOMER’S buying process and goals rather than the company’s perspective and organization.
  • Usability doesn’t always mean “easy to use” - it means usable by the site’s target audience for their purpose in using the site (the “use case” or “usage occasion”)
  • Jonathan Yuen’s site has a very different audience and purpose than Cheap CDs
  • Think about
    • Function (what can the user DO)
    • Aesthetics (look and feel, graphic design)
    • Content (text and media; freshness; UGC)
aims of design for usability
Aims of design for usability
  • Understand user’s goals
  • Anticipate them
  • Make it easy to accomplish them
some best practices in web design
Some best practices in web design:

Q: What’s the most important thing I should do if I want to make sure my web site is easy to use?

A: “Don’t make me think!”

Steve Krug. Don’t make me think: a common sense approach to web usability. New Riders. 2005


From: Steve Krug. Don’t make me think: a common sense approach to web usability. New Riders. 2005

managing layout and whitespace
Managing Layout and Whitespace
  • Put content that is important to the user “above the fold”
  • How do you know what is important? Use server logs
  • Think about screen resolution (1920 x1080, 1024 x 768, 960 x 640 or what?)
  • Fixed or liquid layout?
  • Avoid horizontal scrolling (unless it is a deliberate part of the design)
  • Use whitespace
navigation labels and functionality
Navigation labels and functionality
  • Use the language of the user to label your content, not the language of the organization
    • what is appropriate depends on your primary target audience – eg. on a gardening site
      • scientific name for diseases or common names?
      • Latin or English names of plants for a gardening site?
  • Avoid ambiguities in labeling
  • Think about how people want to access your content (example from Non-Linear Creations)
  • Use breadcrumbs
  • Make sure that the navigation of the site is consistent
    • Use colour / graphics to help user keep a sense of where they are
  • Follow web conventions (where audience appropriate)
    • eg. making the logo (top left?) clickable back to home page
    • Left hand navigation bar?
write for the web
Write for the web?
  • It depends on your audience, and the nature of the content
  • People tend to scan rather than read on a screen
  • More white space, bullets, shorter paragraphs, are often recommended for content that is likely only to be read onscreen
  • Longer or more dense material should be “print-ready”
contact us
Contact us?
  • Email addresses
  • Phone and fax numbers - for customer groups / product groups
  • Physical address
  • Names are nice
  • Not just fill-out forms
    • A good example of a contact page (Impact Visual)
  • Make sure you answer - and fast
things that really really annoy potential customers
Things that really, really annoy potential customers
  • No shipping cost information until I get to the end of the checkout procedure
  • Asking for personal information too early in the process. Peapod (use 06415 as zip code) versus Quality Foods
  • Not telling me an item is out of stock until I get to the checkout (don’t waste my time)
  • Clunky navigation and selection process (one click too many)
using media adobe flash
Using media: Adobe Flash
  • Skip intro: avoid the Flash entry page
  • Problems with Flash-only sites
      • Browser or device incompatibility/plug-in needed
      • slow loading pages
      • difficult navigation (Yuen)
      • may not be accessible to visually impaired or on handhelds
    • Some good uses for Flash
      • Rich media advertisements – examples
      • Embedded video
simple usability tips
Simple usability tips
  • Video from
  • This video summarizes some of the things we have been talking about with respect to usability
usability testing
Usability testing
  • Can be done with html prototypes, paper prototypes, or with a fully-functioning version of the interface
  • Testers selected from target audience
  • Usually task oriented
  • Overt or covert observers
  • Types
    • Diagnostic - to spot problems early on
    • Comparative - select among alternate designs
    • Verification - have goals been met?
  • Example video from Steve Krug (watch from 8:12-13:30 minutes while the user tries to figure out the cost of using ZipCar)
the global internet issues of web site design we will look at
The Global Internet: Issues of Web site design – we will look at
  • The difference between globalization and localization
  • Issues related to an “English only” site
  • Strategies for “localization”
  • Challenges in operating in the international marketplace
the big picture
The big picture
  • English used to be the number one language of web users
  • By 2000 web users who were non-native English speakers outnumbered English speakers
  • CIA World Factbook Statistics: Internet Users – Country comparison
going global 2 basic choices
Going global: 2 basic choices
  • Globalization versus localization
    • Globalization: One website fits all
    • Localization: different website for each country or locale
globalization one website fits all

Globalized web site

Globalization - one website fits all
  • Often the only choice for small / medium businesses
    • substantial cost to localized sites
  • Identify target markets
  • Find out as much as possible about those markets
one site fits all some things you can do to help users

Globalized web site

One site fits all: some things you can do to help users
  • Keep the site as simple and non-specific to one culture as possible
    • make clear what currency your prices are in
      • add a link to a currency converter?
    • tell customers which international markets you will serve
    • give international shipping information
    • tell people what time zone you are in if you give a phone number and service hours
    • language issues (next....)
language issues on a globalized site
Language issues on a globalized site

Globalized web site

  • Majority of web users do not have English as a first language
  • If your site is ONLY in English
    • keep it simple
    • avoid slang, figures of speech, swear words
    • watch out for different meanings of words
      • Jumper/sweater
      • Braces/suspenders
      • Shopping cart / trolley
      • Sedan/saloon
      • Football/soccer
designing input forms on globalized one site for everyone sites

Globalized web site

Designing input forms on globalized (one site for everyone) sites
  • The following can cause problems:
    • Postal code/Zip code
    • Date formats
    • Pick a province or state from a drop-down menu
    • Pick a country from a drop-down menu
    • Name forms differ in different cultures
      • last name/first name
      • family name / Christian name
localization website is tailor made for each market

Localized web site

Localization – website is tailor-made for each market
  • Means building a different site for each different target country (or locale)
  • Very challenging – Firms need lots of research and expert advice
  • Very expensive to do well
  • Only the largest eCommerce companies will localize
how does the international customer get to the right site

Localized web site

How does the international customer get to the right site?
  • The .com may be the “main” site
  • How does the customer get to their “own” site
  • Do you want them
    • to choose eg. and
      • multiple links to other country sites
        • language of country label?
        • flags?
    • to be automatically redirected eg.
      • detecting the language setting of the browser (try it with Google)
      • IP address of the computer
    • Can they keep that preference? (eg. with a cookie)
on a localized site all these factors will influence design

Localized web site

On a localized site: all these factors will influence design
  • The only way to do business with other cultures is to adapt to those cultures, including:
    • Language
    • Customs and culture
    • Value differences
    • Holidays and celebrations
    • Uses of colours, graphics, fonts, icons
    • Time zones
    • Shipping
    • Weights and measures
    • Currency for payment
    • Pricing
the best marketing will always takes place in the language of the target country

Localized web site

The best marketing will always takes place in the language of the target country

"If I'm selling to you, I speak your language. If I'm buying, dann müssen Sie Deutsch sprechen [then you must speak German].“

Willy Brandt, the former German chancellor

  • Even if people speak English they prefer to buy in their own language
  • Language localization involves much more than simply translating English into another language
    • Nike football (the language tunnel)
web futures

Localized web site

Web futures
  • These are just a few of the issues to deal with in a global marketplace
  • As more and more people go on line, web teams will be grappling over decisions about how to localize sites
    • Consult local experts
    • Conduct usability testing with people from the target market