Tips for developing a mobile-friendly version of your Dynamicweb website

I find that more and more of my customers at Bleau A/S are asking me for advice on how to handle mobile phones. And I have noticed that several are very unsure on which strategy to adopt when it comes to mobile phones. Therefore, I have decided to write a couple of blogposts offering advice on this subject. Please feel free to comment.

The fact is that if you want to support users of mobile phones, there are a number of options. I have heard several people suggest that you have to develop an app that contains specialized functionality, but I’m not convinced that that is the best solution. Instead, I believe that apps are great when you need to display rich content, while it is more worthwhile to develop a mobile version of a website if there is more “ordinary” content – such as text and images.

The reason for this approach is that it is much more expensive to develop apps. Apps have to developed in multiple programming languages and there is an extensive approval process for each smartphone. And if you consider that there are about as many people who browse websites using the browser in the mobilephone, as there are people who use apps, you will quickly find that it is more economically sound to develop a mobile friendly version of the website.

The technical implementation of a mobile version has some special challenges though:

  • Small screens
  • Varying screen size
  • New phones almost every day
  • Featurephones vs. Smartphones
  • Difficult to operate
  • Slow downloads – even with 3G

These challenges mean that if you want to succeed with the mobile version, you need to take the following into consideration.

Carefully selected content

You should limit the content published to the mobile friendly version. The 80/20-rule applies nicely here. Most people who choose to use a mobile site have a specific objective in mind. However, make sure that users can access the full version of the website by providing a link at the top of the mobile friendly version. That way, you can service both types of users.

In Dynamicweb, you could create a new languare area / website in order to administer the mobile friendly content. Naturally, you would want to reuse content by creating global paragraphs.

Navigation

Just as the content should be limited, so should navigation. There should be a maximum of three levels in the hierarchy, and each level should have a maximum of four menu items. One can often help the user on his way by implementing a search function that  implements some form of AJAX autosuggest-functionality. However, such a function would not work on older phones.

Mobile-friendly design

Statistics show that the mobile phones used by far most people to surf the Internet in Denmark, is the iPhone and Android. Therefore, one solution could be to develop a mobile version that is primarily aimed at  these phones, but also ensure that the design  can be “downgraded” and thus appear on other phones.

The selected design will need to comply with the standards from W3C for XHTML. Moreover, the design should be implemented with relative font sizes and variable page width. The horizontal scroll should also be removed.

We should also assist users on mobile phones by installing an application in Dynamicweb that will check all incoming queries. Queries from mobile phones will then be sent to http://m.mybrilliantwebsite.com while other users will see the normal version.

Optimization / Performance

You also need to optimize every page and file being sent to the browser. Therefore, you should create new CSS and new JavaScript, which contains none of the code that is only used on the website.

Moreover, all images should be compressed. In Dynamicweb, we can automate this by applying the automatic compression functionality in templates.

That’s it 🙂

ehhmm.. no, there’s more to it than that. I will bring you more tips and advice in later blogposts. But for now, you have to wait. However, please feel free to comment – do you agree with me on the above mentioned list?

Notice, that this blogpost is also available in Danish. Find it here: http://blog.bleau.dk/index.php/2010/10/forholdsregler-ved-udvikling-af-dynamicweb-hjemmeside-til-mobiltelefoner/

 

 

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s