media salt

Beginning today, visitors to longhollow.com have a great way to get our information while they’re away from their computer. After a few months of elbow grease and experimentation, we’ve launched a new mobile web app that streamlines our most frequently accessed information into one convenient package. You can check it out today at m.longhollow.com (The site is designed for iPhone, iPod Touch, Android and the Palm Pre… More on this in a future installment).

As this was my first attempt at web development for modern mobile devices, I thought it would be fun to document my design process and make it a full series for discussion here at Media Salt. I was surprised to find that developing for mobile devices has it’s own set of unique considerations and challenges that make it a different beast than developing for an ordinary web browser.

Let’s get the series started with a brief discussion about the mobile web and why custom mobile sites are becoming a sought after option.

The Times are Changing

For the longest time, browsing the internet on a mobile device was simply dreadful. I remember my first experiences on my Sprint phone back in 2003. As part of an up-sell by the sales person, I left the Sprint Store convinced that all of the possibilities of the internet were now available to me 24/7 from anywhere in the country.

Boy was I disappointed. Instead of the full internet, I encountered a small handful of terrible WAP sites. Forget all of the wonderful design, imagery and multimedia associated with your favorite sites; WAP sites were about as scaled down as they come, with only a few paragraphs of text per page and maybe a postage stamp sized image (if you were lucky). The mobile data networks were slow, and the available devices just didn’t have enough horsepower to support anything different. It was a tough time to be a geek.

Fast-forward to January 2007 and the legendary introduction of the iPhone. The buzz among geek circles was palatable as the “holy grail” of mobile devices finally appeared to be achieved: One pocketable device that could do everything your computer could do, and actually do it pretty well. Chief among these innovations was a strong mobile web browser that brought the full internet along with it.

In the years since the iPhone’s introduction, full internet browsing has become an expectation of modern mobile devices as limited mobile browsers continue to become more antiquated. The road has finally been paved for our content to be more accessible than ever.

Today’s Issues

Ever since these powerful mobile browsers have entered the marketplace, a few issues have risen to the surface as consumers spend more time browsing on their mobile devices.

1) Web sites are large.

In an effort to take advantage of larger computer monitors, our websites have grown to fill up more space over the last few years. As a byproduct of this growth, most content appears pretty darn tiny when viewed in a mobile device. What looks great on a 1,024 px wide web browser can be much harder to navigate when it’s shrunk down to fit a 320 px wide viewport.

2) User interaction isn’t the same.

Since websites have been uniformly designed around desktop web browsers, almost all of our navigation and interaction is designed with several events in mind: mouseover, mousedown, mouse position, etc. These events simply don’t translate to a mobile browser that is driven by viewports and multi-touch user input (for instance, hover effects are rendered useless in Mobile Safari).

3) Plug-ins may not work.

The most notorious plug-in lacking broad mobile support is Adobe’s popular Flash plug-in. All of those embedded video clips and animations are completely absent on many mobile devices, largely due to the system-intensive nature of Flash.

So how can we present our content in response to these limitations in a way that is still engaging to our visitors?

Give Your Visitors Something Graceful

Just like a desktop machine, you want to give your users the information they’re looking for in a way that’s useful and attractive. This was the impetus for creating our mobile web app; with a slight shift of focus, I found that I can deliver the same information that our visitors are looking for, but in a format that is tailor made around the abilities and limitations of their mobile devices.

Be sure to check out “Going Mobile - Part 2,” where we discuss what matters most in designing your mobile site.

More from “Going Mobile:”

Going Mobile - Part 1: Why Do a Mobile Site?
Going Mobile - Part 2: What Matters Most?
Going Mobile - Part 3: Big Design on a Tiny Canvas
Going Mobile - Part 4: Not From Concentrate
Going Mobile - Part 5: Where the Magic Happens
Going Mobile - Part 6: Final Touches