Testing Methods
- Test on real mobile devices of different sizes
- Identify the devices for testing
- Use tests that incorporate assistive technologies and test for general accessibility and mobile specific accessibililty
- Test on responsive windows on a desktop device
- Test on a desktop device
Best Practices
- Make sure links work and when opened create a thematically coherent experience.
- Exploit device capabilites to enhance user experience
- Provide only minimal navigation at the top of the page.
- Avoid using too many links on a page.
- Provide consistent navigation mechanisms.
- Provide shortcuts to key links.
- Use clear, concise descriptive link text; identify the implications of following a link if the target is large.
- Use clear and simple language.
- Limit scrolling to one direction.
- Avoid large or high resolution images.
- Do not use tables or nested tables.
- Provide alt text for images.
- Specify the size of images in the markup if they have intrinsic size.
- Keep style sheets small.
- Ensure the content is encoded using a character encoding that is known to be supported by devices.
- Do no rely on support of font related styling.
- Provide pre-selected default values where possible.
- Specify default language.
- Label all controls and position so they lay out properly in relation to the form controls they refer to.
- Use cookies sparingly
- Use appropriate client-side storage technologies for local data
- Do not execute untrusted JSON data.
- Ensure the user is informed about use of personal device information.
- Enable automatic sign-in
- Avoid redirects
- Optimize network requests.
- Include background images inline in CSS styles
- Cache Ajax data
- Do not send cookie information
- Keep DOM size reasonable.
- Make telephone numbers click to call.
- Ensure consistency between devices.
- Consider use of canvas element or SVG for dynamic graphics.
Resources
W3C Mobile Web Best Practices 1.0