Design Philosophy

BBC Mobile Services should be...

Immediate, Scannable, Concise, Considerate of context, Focused, Clearly navigable, Responsive.

In contrast to the web or television, consumption of content and services on mobile rarely happens in ideal viewing circumstances. Mobiles are often used whilst commuting, watching television, or speaking with other people and it is important to bear this in mind when designing for this platform.

As a rule, mobile web pages scroll vertically. It's best to arrange the page content so that it is in direct 'read order', starting with the most relevant or featured content at the top.

You should also consider the following:

Be Concise

Mobile phone screens show only a small portion of the page. Aside from index pages, it is best to keep the 'one story per page' rule. Placing multiple articles on one page could lead to subsequent content being missed by the user.

Downloads

Be judicious with the amount of content, particularly the number and size of images displayed. Long download times lead to people navigating away before the page has loaded.

Speed

Remember that mobile web users are likely to experience distractions due to their environment. They are also likely to want information that is useful at their location.

Distinguish Items

A busy environment or bright lighting conditions can make it difficult to pick out links or fields that are in focus.

User Input

Even though most recent phones have advanced text entry, allowing users to input information by making simple selections instead of entering text is preferable.

Flexible Layouts

Make sure that the content is in the right order and the page can adapt to various screen types and widths. This is important especially for devices that can be used both in landscape or portrait modes.

Resolution

When designing for BBC mobile platforms we recommend designing for 320px width and 240px width resolutions. Screen sizes and resolutions can vary across the same mobile platform.

BBC © 2014 The BBC is not responsible for the content of external sites. Read more.

This page is best viewed in an up-to-date web browser with style sheets (CSS) enabled. While you will be able to view the content of this page in your current browser, you will not be able to get the full visual experience. Please consider upgrading your browser software or enabling style sheets (CSS) if you are able to do so.