Selling through mobile websites

Selling through mobile websites

Quick tips for optimising the user experience of mobile e-commerce websites.

Presented at Internet World 2011 in London, UK.

Af04691bcac07bc059504150d5fbe88d?s=128

Alexander Baxevanis

February 17, 2012
Tweet

Transcript

  1. www.webcredible.co.uk 1 webcredible | user experience • research • design

    • training 1 Selling through mobile websites Alexander Baxevanis Senior Consultant, Webcredible Internet World 2011
  2. www.webcredible.co.uk 2 webcredible | user experience • research • design

    • training 2 Why bother with mobile? • People have smartphones and are increasingly using them • People think of things they want to buy everywhere, not just at home • Mobile is often used even when a computer is available • There’s things you can do on a mobile but not on a computer
  3. www.webcredible.co.uk 3 webcredible | user experience • research • design

    • training 3 Why mobile web? • Reach the maximum number of platforms • Re-use existing web development skills and resources • Capability gap between mobile and apps is closing • Web likely to be a first point of contact if people search for your brand or products on Google
  4. www.webcredible.co.uk 4 webcredible | user experience • research • design

    • training 4 Example: Search for IKEA on an iPhone Even though IKEA has got an iPhone app, the first link that comes up in Google is their website.
  5. www.webcredible.co.uk 5 webcredible | user experience • research • design

    • training 5 Mobile e-commerce site checklist 1. Help people find your mobile site 2. Avoid data entry where possible 3. Cater for mobile data connections 4. Reassure customers about transaction security 5. Think about the post-transaction stage
  6. www.webcredible.co.uk 6 webcredible | user experience • research • design

    • training 6 Help people find your mobile site
  7. www.webcredible.co.uk 7 webcredible | user experience • research • design

    • training 7 Automatically redirect • Don’t rely on people to remember a special mobile link that you’ve advertised • Detect visitors using a mobile phone browser and redirect to the mobile version automatically
  8. www.webcredible.co.uk 8 webcredible | user experience • research • design

    • training 8 When redirection fails … • Automatic redirection isn’t 100% reliable • Use a predictable mobile URL – e.g. m.example.com or www.example.com/mobile • Make sure there’s a link to the mobile version of your site in the desktop version (and vice versa) The link to the mobile version is placed on the top of the page where it’s likely to be noticed if the page loads in a mobile browser.
  9. www.webcredible.co.uk 9 webcredible | user experience • research • design

    • training 9 What about tablets? • Tables are advertised as having large screens and good web browsers and most people expect to see the full version of a website • Avoid presenting tablet users with the mobile version of your website - it will usually appear oversized and will be difficult to use • Make sure your desktop site is usable on tablets – Provide alternatives to Flash banners/carousels etc. – Use mobile-friendly formats for product videos
  10. www.webcredible.co.uk 10 webcredible | user experience • research • design

    • training 10 Avoid data entry where possible
  11. www.webcredible.co.uk 11 webcredible | user experience • research • design

    • training 11 Data entry challenges • Small screens – difficult to see exactly what you’ve typed • Small keyboards – greater likelihood for mistakes • Interruptions and lack of concentration • Credit card numbers and addresses particularly vulnerable in case of data entry mistakes
  12. www.webcredible.co.uk 12 webcredible | user experience • research • design

    • training 12 Avoiding data entry • Re-use account information from desktop website e.g. previous shipping addresses, card information (if saved) • Use geo-location services if current position is needed (e.g. in a store finder page) • Make sure your site works well with form auto-fill on mobile browsers
  13. www.webcredible.co.uk 13 webcredible | user experience • research • design

    • training 13 Facilitating data entry • Add auto-suggest/auto-complete functionality where appropriate (e.g. when a user is searching for a product in your website) • Use a postcode-based address finder • Use in-line validation for form fields during checkout
  14. www.webcredible.co.uk 14 webcredible | user experience • research • design

    • training 14 Cater for mobile data connections
  15. www.webcredible.co.uk 15 webcredible | user experience • research • design

    • training 15 What can go wrong? • Data connections can be slow • Data connections can be unreliable or unavailable in a low-signal area • Mobiles run out of battery • What if one of the above happens in the middle of a transaction?
  16. www.webcredible.co.uk 16 webcredible | user experience • research • design

    • training 16 Avoid losing data entered by the user • Save all details in every step of a transaction e.g. the items in a shopping basket or the shipping details already entered • Make sure that a transaction can be resumed from the point where it was left, without having to start over • Capture customers' e-mail addresses or mobile phone number at the beginning of a transaction and send them instructions to help continue an interrupted transaction
  17. www.webcredible.co.uk 17 webcredible | user experience • research • design

    • training 17 Optimise for mobile connections • Make sure images and other resources can be downloaded quickly – However, you should still allow access to high-resolution image if this is important for selling a high-value product • Minimise the number of steps that require reloading the entire page – For example, an image gallery should refresh images in- place instead of having one page per image
  18. www.webcredible.co.uk 18 webcredible | user experience • research • design

    • training 18 Reassure customers about transaction security
  19. www.webcredible.co.uk 19 webcredible | user experience • research • design

    • training 19 Highlighting secure websites - desktop • Most desktop browsers prominently identify secure websites and help people understand if they should trust a website • Some standardisation, e.g. a padlock next to the site link, use of green colour
  20. www.webcredible.co.uk 20 webcredible | user experience • research • design

    • training 20 Highlighting secure websites - mobile • However, mobile web browsers don’t always prominently highlight secure websites • Also, no additional information is given (such as “when you last visited this website”) • Lack of established conventions
  21. www.webcredible.co.uk 21 webcredible | user experience • research • design

    • training 21 Work harder to promote security • Highlight your security credentials on the homepage and on pages that ask for sensitive information (especially if you’re not a well-known and established brand) • Explain why you collect personal information and what you’ll do with it • Avoid entry of sensitive information via the mobile site, by re-using information stored in an existing user account
  22. www.webcredible.co.uk 22 webcredible | user experience • research • design

    • training 22 Think about the post-transaction stage
  23. www.webcredible.co.uk 23 webcredible | user experience • research • design

    • training 23 What happens after you buy? • Mobile users won’t put their mobile away after they finish their purchase or other transaction • If people buy on a mobile phone, they’ll also appreciate any followup to be accessible though a mobile • This includes order tracking, delivery confirmation, leaving reviews, contacting the retailer etc.
  24. www.webcredible.co.uk 24 webcredible | user experience • research • design

    • training 24 Post-transaction tips • Provide a mobile solution for tracking the progress of an order and the delivery of the goods • For booking tickets or other services, provide a mobile-friendly booking confirmation e-mail and consider mobile ticketing solutions, where tickets can be electronically stored in a mobile phone in the form of a special barcode • In any case, ensure that all e-mails following up on a transaction are mobile-friendly
  25. www.webcredible.co.uk 25 webcredible | user experience • research • design

    • training 25 Post-transaction tips • Make sure that key customer service areas on your website are available in a mobile-friendly format e.g.: – Terms & conditions – Contact information – Order tracking/modification/cancellation
  26. www.webcredible.co.uk 26 webcredible | user experience • research • design

    • training 26 One more thing …
  27. www.webcredible.co.uk 27 webcredible | user experience • research • design

    • training 27 What if you just have a mobile app? • Make sure that your mobile app is sufficiently promoted when people visit your website through a mobile: Special banner to promote iPhone app
  28. www.webcredible.co.uk 28 webcredible | user experience • research • design

    • training 28 Visit our stand (E7080) to talk about your mobile web design needs. Please email us for a copy of this presentation: marketing@webcredible.co.uk Visit our website to read more articles & blog posts: www.webcredible.co.uk Follow us on twitter: @webcredible