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:
It does not do markup transcoding at run time, but generates device-specific pages at publish time. This gives better performance.
The visual controls are defined through a declarative language and can interoperate with JSTL for dynamism. They are also rendered based on the context or rules that we can specify.
The framework comes with ready visual controls for layouts, date control, RSS etc. It can even do binding of visual controls with data, and can generate a grid to display data and paginate.
You get control over the visual aspects—CSS, alternatine content, hiding pages based on device, etc.
It has a validation framework that can work on both client side and server side depending on scripting support at the client.
Comes with an Eclipse plug-in!
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:
We learned about the Lowest Common Denominator method, finding and comparing features of different mobile devices and deciding to adapt or not.
We extended the Pizza On The Run application to adaptively display content using Wireless Abstraction Library.
We saw how adaptation works in different browsers.
We learned about WURFL and how it can be used to adapt based on browser capabilities.
We reviewed tools that can aid in adaptation—Tera WURFL, MyMobileWeb, Mobile Web Toolkit, Image Server, GAIA Image Transcoder, and HAWHAW.
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 |