In the last few years many more people have started using iPhones, Androids, iPads, Blackberries and other hand held devices to browse the Internet. How well does your website display on these devices.

Most websites will display but the visitor generally needs to zoom in to read any information, and even to view the navigation links. Some images require scrolling sideways to view. Everything is possible but it can become tiresome. Visitors can be lost to other websites

A separate website

It takes a lot of work to convert a typical website created for viewing on a desktop computer into one that displays well on a smart phone. It is easier to create a separate website specially designed to be read on a mobile device.

Your mobile website address can be a sub-domain or a folder of your main website.

There is javascript code available which detects a mobile device browsing your main website and redirects the browser to your mobile website. You can even detect which device, e.g. iPhone, Android, Blackberry, iPad, and redirect accordingly.

There is special coding to enable the use of features of e.g. Safari, the browser for iPhones and iPads.

Changes for a mobile website

Everything that requires a visitor on a smart phone to zoom in to read the content must be eliminated. Anything that slows down the loading of the website on a mobile device should be eliminated. Any content that delays the visitor from finding the important information can be left out

Header on each web page

The header needs to be brief, with maybe a small logo, title, short description and a link to a navigation page, so that navigation can be accessed from anywhere on the website.

The address of your main website would show visitors where they can see more information on a desktop or notebook computer.

Footer on each web page

This should contain the title, copyright notice and links to top of the web page, the navigation page and the main website address.

Navigation page

If your main website uses a series of tabs across the page each with dropdown menus, you can convert this to a menu running down the page with pop-out menus for each item.

Images

Smart phones and iPads cannot see Flash animations, so these should be eliminated. If left in, a blank area will show. If it`s absolutely essential to display an animation, then Adobe Flash lets you publish a Flash file as an animated GIF which can be seen on a smart phone.

However this could be many times the size in Kb of a Flash file and could be too slow to load on a phone. Corel`s Animation Shop lets you edit the GIF animation and remove frames to reduce its file size. But this may ruin some animations.

Other images should be eliminated or resized to suit the small screen. Every image that you leave on a mobile website will slow down the time the website takes to load.

This risks you losing your visitors.

Content and layout

Only put in content that is absolutely essential to the purpose of the mobile website. You may need only a half of your main website on a mobile website. You may be able to shorten the content of some pages. You still have a link to the main website that visitors can view on a desktop or notebook computer for more information.

Have percentage width pages rather than fixed widths. Do not have sidebars.

The end result should be a website that a visitor can read down the page on a smart phone without any zooming or scrolling sideways.

Conclusion

The mobile website is becoming more essential as the iPhone, Androids and iPads become more widely used for Internet browsing.

Many people using mobiles do not have access to a desktop computer. We now all need to cater for this large section of the public.


These articles were first published on www.platywebs.com.au and have been re-published on many other websites and ezines over the years. New readers are still finding them to be of value and up to date with today’s conditions. We believe they illustrate common sense and the value of thinking through situations. Please check out the other articles advising on small business, web design, search engine optimisation, web hosting and domain names.