Before we go any deeper into some of the best practices for your mobile website, we first need to understand and keep this thing in mind: the person is viewing your site with a mobile device.
With a mobile device, they’re expecting some different experience from the one they’ll get on your standard website.
For a mobile visitor, brevity trumps everything else. These visitors are usually looking for a few key pieces of information such as your contact, location and the price of your services and products.
Lengthy stuff and information about your corporate philosophy or PDFs of your latest press releases are usually overlooked while browsing using mobile devices.
That being said, let’s take a look at the 9 best and helpful practices for mobile website design that can help you create a site that help your business better.
#1 Simplify
Due to the restricted amount of screen space, the first step in creating a mobile site is to determine which content to include. It’s vital to figure out what key information your visitors will probably be looking for.
Probably a store location? Contact number? Promotion?
It’s also important to keep the online purchasing procedure as simple as possible. Fandango does a great job of this by eliminating much of these non-essential content to quickly bring their consumers what they truly want: Movie times. Using QR codes also helps in offering better consumer satisfaction, as they can be used as a form of verification when consumers are claiming their paid products or services, thus completing the sales cycle.
#2 Plan Your Site Layout
Unlike traditional web pages, mobile web pages requires a longer loading time. Therefore, keeping the number of pages to a minimum is important. Keep your site layout as streamlined as possible, as the users won’t have the patience to click numerous pages on your site just for the information they want.
One of the best examples is the Domino’s Pizza. They simplified their mobile site and limited the list of items to only those people would most likely be searching for.
#3 Match the Branding Elements from Your Standarad Site to Your Mobile Site.
Another point to take note is while your mobile site will be more simplified that your standard site, it is still mandatory to incorporate the same branding elements in it to retain your corporate image.
A mobile site is a brand touchpoint and just like any other property, should reflect and promote your brand essence. Bear in mind that, it’s for users who are already familiar with your company, a similar design will make them feel like they’re visiting an old friend, which is an important consideration for your most loyal customers.
#4 Utilize White Space
White space give a cleaner, more sophisticated appearance, it also ensures that users can easily click the button they’re aiming for.
This mobile site for MSNBC does a good job at keeping enough padding around all of the text to ensure that the user is able to accurately select the content he or she is looking for.
#5 Avoid Flash or Java
Always remember that Apple products do not support Flash and have declared that they have no intention to do so in the future. Thus, it’s better to avoid Flash
Why? As iPhones make up about 30% of the smartphone market, a significant portion of your audience will not be able to access your Flash contents.
Similarly, many phones do not support Java and even if they do, using Java can be a huge drag on the loading time.
#6 Reduce the Amount of Unnecessary Text Entry
Not everyone has small fingers; in fact, a majority of us have difficulty typing on tiny keyboards.
For mobile website, it’s always recommended to use dropdown menus, checklists and pre-populated fields as means of data entry. This actually helps minimize the challenges people face when typing text into a smartphone.
For an example, FedEx uses checklists and dropdown menus to cut down on the amount of text a user must enter in order to make their services more accessible and practical for mobile users.
Starbacks used the dropdown menus too.
#7 Do Not Use Pop-up Windows
Navigating between multiple tabs and browser windows is more difficult on mobile and can cause slow load times. If you need to open a new browser window, make sure you alert your user so that they know how to navigate back to the original page.
#8 Use Mobile Redirects
Once your site is designed and ready to go, make sure to put redirects in places that will detect mobile visitors and directs them to the mobile-optimized version of your site.
In other words, any mobile user who types in your web address or click on a link in a search engine will be redirected to your mobile site instead.
#9 Allow People to Visit the Full Site
Make sure you include links on multiple pages that allow the user to return to the full version of the site.
Because mobile sites are a new landscape for most marketers, designing and building them can be a bit of a challenge. However, mobile sites also bring an awesome opportunity to showcase your brand and your creativity. But as long as you keep the users’ needs top-of-mind, stay true to your brand and by following these few simple rules, you will have the hang of it in no time.
(source from: Social Media Examiner http://goo.gl/gxXw5C)
To build your mobile website, we have a solution that makes your life easy: http://goo.gl/l0ps3t