Much has been written on mobile strategy and the benefits of having one, but less has been written about the practicalities of defining and structuring that strategy and less still on the commercial implications of technology and information architecture (IA) decisions.

Enter Econsultancy’s Mobile Web Design and Development Best Practice Guide – containing everything you need to know about design and development for mobile, dissecting the technical challenges and commercial implications of the key mobile site development options.

What you’ll learn from this research

  • The importance of mobile optimisation and the factors influencing commercial decision-making.
  • How to effectively evaluate which mobile development approach is most relevant to your specific business needs.
  • The potential risks involved with mobile web development, to enable effective decision-making.
  • Advice from experienced ecommerce practitioners into planning and implementing mobile design strategies.
  • Considerations for adopting one or more of the development approaches, illustrated with case studies references from ecommerce websites.

Who should read this report?

While modern digital teams have made great leaps in their UX knowledge, understanding of the technical implications (both short- and long-term) of mobile development choices lags behind.

If you are considering investing in mobile commerce, this report will help you to rationalise the opportunity and understand technical implications to provide an objective evaluation of the pros and cons for the principle development techniques: responsive web design (RWD), adaptive web design (AWD) and mobile-specific development platforms (MDP). 

It is relevant to the following audiences:

  • C-suite executives
  • Heads of ecommerce
  • Heads of mobile strategy
  • Heads of IT
  • Agency directors and account managers
  • Independent consultants

Features of the report

At 200 pages in length, the report has been split into the following sections:

Within each section we explore the technical and commercial implications for developing a mobile site, covering:

  • What exactly does the development method mean?
  • How it works – getting under the hood to look at the technical nuts and bolts.
  • Technical challenges and considerations for ecommerce teams.
  • Commercial pros and cons.
  • Example websites that have adopted this approach.

The report also includes expert commentary from ecommerce practitioners who are at the sharp end of mobile commerce, both in client-side teams implementing and managing a mobile strategy or agencies and consultants working closely with client teams.

Contributing authors

James Gurd

The lead author of this best practice guide is James Gurd, an experienced ecommerce consultant with more than 12 years’ B2C and B2B experience client and agency side, providing ecommerce advice and support. He owns Digital Juggler and has worked with a wide range of ecommerce clients helping digital teams to create, implement and evolve digital strategy. 

James is also a guest blogger at Econsultancy – view the articles he’s written on the blog.

The report has been produced with the assistance of leading ecommerce and web development professionals and agencies who have kindly contributed their time and effort.

Contributors to the report include:

  • David Skerrett, Managing Partner, Nimbletank
  • Justin Taylor, Founder & MD, Graphitas
  • Maria Morais, Digital Commerce Consultant, Neoworks
  • Mark Slocock, Managing Director, GPMD
  • Markus Karlsson, CEO & Founder, Affino
  • Matt Bailey, Creative Director, GPMD
  • Matthew Curry, Head of Ecommerce, LH Group
  • Paul Moore, Service Design Lead, Fjord
  • Sohaib Siddique, Technical SEO Lead, Verve Search
  • Stuart McMillan, Deputy Head of Ecommerce, Schuh
  • Tomas Honz, Director of Technology Strategy, Summit
  • Will Garbutt, Senior UX Manager, Summit

What the experts say

“Mobile is where all of the action is taking place – and interesting things are happening. People are moving across multiple devices as a standard way of interacting with information. 

“From research to shopping or simply surfing the web – these online activities are now extending beyond laptops to include mobile devices like smartphones and tablets. If mobile is not a part of your business focus then you are not only missing out on the trend, but are also most likely losing business.”

– Jeremy Woska, Senior Product Manager, Ensighten MobileMonica Savut

“Companies can no longer afford to sit on the fence when it comes to mobile strategy and investment. While intense debate about the merits of different mobile optimisation options continues in some organisations, many are already reaping the rewards.

“This best practice guide takes the guesswork out of choosing a mobile optimisation route, helping you make the best decision based on the context of your business goals and capabilities, along with your customers’ needs.”

– Monica Savut, Research Manager, Econsultancy

Table of contentsMobile Web Design and Development Best Practice Guide

  1. Introduction to Our Guides
    1. About Econsultancy
  2. Introduction
    1. Goals of the report
    2. Report structure, content and target audience
    3. Mobile commerce market data
      1. Mobile moves centre stage for strategic planning
      2. Christmas is mobile
      3. Mobile browsing and purchasing growth
      4. Key factors driving mobile usage
      5. Popularity of different development approaches
    4. Glossary of key terms
    5. Marketing challenges and opportunities
  3. Planning Your Mobile Site
    1. Defining goals and objectives
      1. Example goals
    2. Understanding audience needs
      1. Using research and insight
    3. Common mistakes to avoid
    4. Device-specific patterns and behaviours
      1. Mobile usage
      2. Access on the go
      3. Implications of touchscreen browsing
      4. Device-specific browsing variations
      5. Key drivers for device differences
    5. Measurement and optimisation
      1. Web analytics
      2. Metrics to measure a mobile website
      3. Mobile testing
    6. Marketing challenges and opportunities
    7. Key technical considerations
      1. Technology brings businesses closer to customers
      2. Cheat sheet
    8. Key takeaways
  4. Responsive Web Design
    1. What does ‘responsive’ mean?
    2. Commercial implications and challenges
      1. People
      2. Research and development
    3. Technical challenges
      1. Technical impact of building a responsive website
      2. Creating a responsive code base
      3. Common mistakes and pitfalls
    4. Implementation challenges
      1. Creating a responsive code base
      2. What do developers need to do to create a responsive codebase?
      3. Code validation
      4. Optimising responsive sites for optimal page speed
    5. Pros and cons
      1. Criteria to consider
    6. Example sites
    7. Case studies
      1. Schuh
      2. Ted Baker
  5. Adaptive Web Design
    1. What does ‘adaptive’ mean?
    2. How does an adaptive website work?
    3. Technical and commercial challenges
      1. Decision criteria
      2. Critical success factors
      3. Impact on the business of going adaptive
      4. Mitigating the risks of adaptive design
    4. Implementation considerations
      1. Adaptive layers of progressive enhancement
      2. Design trends
      3. Context is king
      4. Technical challenges with going adaptive
      5. Overcoming caching challenges
    5. Key dos for adaptive design
    6. Common mistakes and pitfalls
    7. Creating an adaptive code base
      1. Coding for adaptive layers
      2. Maintaining an adaptive code base
      3. Good house-keeping
      4. Code validation and quality assurance
      5. Optimising for performance and page speed
    8. Pros and cons
      1. Key pros
      2. Key cons
    9. Adaptive checklist
    10. Example sites
      1. American Airlines
      2. Lufthansa
      3. USA Today
      4. eBags.com
      5. Epicurious
  6. Mobile-Specific Website Development
    1. What does ‘mobile-specific’ mean?
    2. Commercial implications and challenges
      1. Evaluating the commercial implication
      2. Platform considerations
      3. Design considerations
      4. Creating page templates
    3. Technical challenges
      1. Planning the development
      2. Mobile site development
    4. Implementation challenges
      1. Responsive vs. mobile-specific code base
      2. Development frameworks
      3. Development challenges
      4. Code maintenance
    5. Summary – key pros and cons
      1. Key pros
      2. Key cons
    6. Mobile-specific site development checklist
    7. Example sites
      1. New York Times
      2. Marks & Spencer
      3. Harrods
      4. Ralph Lauren
  7. UX/UI Design
    1. Importance of UX/UI skills for mobile
    2. Touch screen considerations
      1. How does screen size influence design
      2. Screwfix – an example of understanding user context
    3. Device-specific considerations
      1. Screen size
      2. Operating system (OS)
    4. Key design techniques for mobile sites
      1. Define your site
      2. Wireframing
      3. Advanced techniques
      4. Responsive or adaptive
    5. Key dos and don’ts
      1. UX/UI
      2. Mobile-specific HTML
    6. Mobile designer’s toolkit
      1. Software
      2. Tools
      3. Browser plugins
      4. Resources
      5. Developer resources
    7. Examples of good and bad practice
      1. NHS Direct
      2. LateRooms.com
    8. Case study
      1. An overview of the brief
      2. Defining the site
      3. Target audience
      4. Refine the original list of features
      5. Wireframing and site concepts
      6. Evaluating and planning
      7. Site visuals
      8. Build
      9. Finished site
  8. Technical SEO for Mobile Development
    1. Development implications
      1. Responsive web design
      2. Adaptive web design
      3. Mobile-specific site development
    2. Indexation
      1. Verifying your mobile website
      2. Mobile sitemap
      3. User agent management
    3. Ranking and clickthrough considerations
      1. Page speed
      2. Redirects
      3. Google+ listing
      4. Mobile markup
      5. Title and meta description
    4. Useful tools and resources
    5. Examples of good and bad mobile SEO
      1. Good mobile SEO – Vouchercodes.co.uk
      2. Room for improvement – Wired.co.uk
  9. Summary and Recommendations
    1. Is there a ‘right’ approach?
    2. Key takeaways
  10. Useful Resources
  11. Acknowledgements
    1. Lead author
    2. Expert contributors

Download a copy of the report to learn more.

A free sample is available for those who want more detail about what is in the report.