Crimson Blog

As part of my cellphone programming class, I have been introduced to a few new tools for mobile design. So far the most important one is the Opera Mini Demo. Opera Mini is the most prevalent web browser on mobile devices, and this clever page displays web pages in a nice little cellphone after jamming it through Opera Mini’s rendering engine. Opera Mini takes an Apple like approach, discarding mobile only style sheets, and instead opting to fuse both mobile and screen CSS together with the grace of a walrus doing ballet with a running chainsaw on the flat end of a postage stamp. This is however a strong improvement over what the web used to be on a phone where the rendering was the chainsaw and the users sense of sight and good taste, the walrus. Whereas the current state of events can be done carefully, even gracefully if the web page is designed well, the past was just an exercise in how to make it hurt the least.

Getting back on track, Opera Mini Demo is a fantastic tool for those brave enough to tame their wild CSS to live in a pen a tenth of the size when one doesn’t have a cellphone handy. Designed to be as much like the cellphone experience as possible, developing without this or a phone would be impossible. My instructor has taken it upon himself to direct his class’ Opera Mini Demo’s wraths on several popular sites and discover any pros or cons. The following, is the tale.

The Wall Street Journal is the first to fall beneath the sword. In my opinion, it falls hard. For a site that must be a common locale to tech savvy businessmen and businesswomen, to not even have a mobile style sheet referenced in it’s HTML was a shock to me. Upon viewing in Opera Mini, I got to see a lovely cornucopia of random pixels that I pretended were text blocks and headers. Because Opera Mini can zoom in, sort of like the iPhone and iPod Touch can, its ok to have smaller text I suppose, but the trouble is I have no idea where to zoom in to to get the information I want. The headers and links are just as impossible to read as the plain text is and that’s on my high resolution monitor. I can only recommend a few important actions at this point. Build a mobile version, take more content off the homepage so the stuff that’s left can be seen without a scanning electron microscope, and take your headers off the diet. Web 2.0 style massive headers are a good thing when each key press on the phone is an annoyance, I don’t want to browse around your site all day to find out where I want to go. The RSS feed looks great though. They should just detect a mobile browser and redirect it to the RSS and it would help a great deal.

Amazon.com is the next contender and can claim a solid victory. Again I am surprised. If I’m going to start throwing my credit card number around, the cellphone is the last place I would want to do it, and yet upon pointing Opera Mini to it, I am met with a fantastic experience of only the stuff I need, organized in the way I need it! At the top, a readable but not too big logo reminding me where I am. Below, an advertisement for the American Gangster book appears, and below that a search bar. Unlike the Wall Street Journal, besides the advertisement I can’t think of a single thing I would want removed from this page. Its simple, not even requiring a zoom in or left-right scrolling. Below the search, a few unadorned important links to my account and the various categories. Amazon is really shooting for the utter bare bones, but I find I can’t blame them. Yes the experience is a little dry without many colors or graphics, but when I’m on a tiny cellphone, I’m not browsing to be wowed by pictures that I have to scroll past, or text that is too small to read, I’m scrolling for information in small polite bites that are easy to navigate and Amazon delivers. I can’t think of anything I would want to add.

Espn.com is the final battleground and once again, stunning defeat. One would think that people keen on checking scores on their phone might check ESPN’s webpage, but they would only be disappointed by the inability to navigate. Too much content per page, so everything scales down so you can see it, but conversely, it can’t be read. No readable headers without zooming in, the text columns must be scrolled left to right in order to read, the information is built on a multi column display… all in all a nasty experience, though not quite as bad as the Wall Street Journal’s nightmare since at least the design makes use of colored blocks that help indicate where one column ends and another begins. Once again, no mobile CSS document, a real pity since I can see ESPN getting quite a few hits from cellphones. A one column display has to be used here, at most two if both columns are made to render correctly to the right width. Otherwise start taking out unnecessary stuff from the homepage and start spreading it around.

Before any snide comments are made, yes I am aware this blog doesn’t have a mobile CSS document on it… yet… but you will find one nicely adhered to the homepage should you choose to visit it and see what I might consider a usable design using a bit more color than Amazon.

Tags: cell phone, css, mobile, web design

This entry was posted on Tuesday, February 19th, 2008 at 3:52 am and is filed under Bradley University, Multimedia. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.