The realm of mobile web design is one that is continuing to grow and expand at a rather fast rate. In the short amount of time that we have been creating websites specifically for viewing via mobile devices (such as smart phones and tablets), a number of usability guidelines have come to the forefront. By following each of these guidelines, you can ensure the success of your design.
- Use a minimal amount of content – This may seem like common sense, but a lot of people seem to think that they can fit the same amount of content on a mobile website. Only include the most important content or features to keep browsing time to a minimum.
- Use single column layouts – Pages that are too wide are very difficult to view on a mobile phone screen. Most of the text will actually be unreadable until the user zooms in. To prevent this issue, opt for a single column design that takes up the entire screen.
- Use different navigation layouts – Whilst top navigation does look nice, it is actually very difficult to fit in like this on a mobile screen. You could try placing the navigation at the bottom of the page, placing it in a drop down link or offering a search function.
- Allow for minimal text entry – It is extremely difficult for users to enter text on a mobile device; they are prone to making errors and type significantly slower. Minimise text entry by allowing users to store their details and using a PIN instead of a password.
- Design for touchscreen and non-touchscreen – You need to ensure that the website has been designed for both touchscreen and non-touchscreen users (including large buttons for fingers), as not every smart phone will feature a physical keyboard.
By following each of the above guidelines when tackling your next mobile web design, you can ensure that the finished product is user friendly and is aesthetically pleasing as possible. Failing to follow even a single guideline could have disastrous results for your website, so it is important that you check and re-check that they have all been followed before launch.
