Other Useful Tools for Adaptation

Adapting a site for different devices goes beyond markup generation. Commercial tools such as Changing Worlds, Dynetic, and Volantis do a good comprehensive job in adaptation. Let us look at some more interesting open-source tools in this area.


Dynamically Resizing Images

If we can generate markup code dynamically, we might as well resize images dynamically! Maybe we can detect the screen size using WURFL and write logic that will resize a large image to fit the device screen. This will increase the load on the server a little bit as we resize the image, but we can save the image to disk for later usage and manage the additional load. This will cut down on the chore of resizing images for different resolutions every time we add one.

There are a few ready libraries that work with WURFL and can resize images and even change their format.

GAIA Image Transcoder (http://wurfl.sourceforge.net/utilities/gaia.php) is one such tool in Java. It even lets you define regions of interest to help in preview and place on the image.

PHP Image Rendering Library (http://wurfl.sourceforge.net/utilities/phpimagerendering.php) is another implementation in PHP.

Image Server (http://wurfl.sourceforge.net/utilities/imageserver.php) can work as a filter for your Java server, optimizing images without a trace of what's happening to the user!


Quick and Easy Way to Make Your Blog Mobile

If the job at hand is to make a mobile web version of a blog, you can do it in a matter of minutes! FeedBurner (http://www.feedburner.com) and Feed2Mobile (http://feed2mobile.kaywa.com/) take the RSS feed from your blog and show it in a mobile-friendly manner. Users just point to the new URL and they can access your mobile blog!

If you want full control, and want to set up something on your blog itself, head for Mobile Web Toolkit (http://www.beeweb.com). MWT's WordPress plug-in can get your blog mobile within 10 minutes. MWT allows you to customize what widgets show up to users of different browsers in a friendly AJAX editor. Plug-ins for other content management systems are on their way. MWT is a very interesting concept and advocates delivering a rich experience to mobile users, rather than restricting them with some lowest common denominator design.

On the other hand, many content management systems have now started supporting versions adapted to mobile devices. By the time this book goes to print, all major CMS will have mobile web support.


MyMobileWeb: Going the Semantic Way

MyMobileWeb (http://forge.morfeo-project.org/) is a Java-based open-source tool to build .mobi-compliant websites. It is a comprehensive framework that uses declarative XML to build the presentation layer (very similar to WALL) and an MVC architecture for handling various events.

MyMobileWeb is an ambitious project. The team is working on semantic mobile web, context awareness and mobile AJAX. Some of the features that may interest you:


HAWHAW: As Simple as a Laugh?

HAWHAW (http://www.hawhaw.de/) has a funny acronym, but is a great idea. It stands for HTML And WML Hybrid Adapted Webserver. HAWHAW is an open-source script written in PHP. You can create HAWHAW pages via PHP or XML. But the interesting thing about it is that it can even generate VoiceXML output. So not only can you build your standard and mobile website with it, you can even have people call in a number and do a complete interactive voice response system.

You can even get some ideas from the HAWHAW implementation and build something of your own.


Summary

In this quick chapter, we learned when to adapt and how to adapt our mobile site to different devices. Specifically:

One note of caution! Do not over-constrain the content. Users expect the same kind of experience on the mobile that they have on the Web. As mobile web developers, we must strive to bridge the gap, not widen it.

In the next chapter, we will review the best practices of mobile web development: the standards and the opinions!


Previous Page Page 4 of 4


Feedback Form (ExpandCollapse)

What do you think about this web page?






(Optional) Please provide us more details. For example, suppose you select option 2 above, can you tell us specifically what information is missing? You can also suggest anything that can help us improve this web page.

(Optional) Your name:

(Optional) Your email address:

Please enter again to confirm:

Due to the amount of messages we received, we may not be able to reply to all messages.

A button for going back to the top of this page