1. Do nothing.
2. Build a separate mobile site.
3. Build native mobile apps (iPhone, Android, etc)
4. Convert your standard website to use responsive design

1. Do nothing. A lot of small to medium sized publishers present their standard desktop website to mobile browsers with no display changes whatsoever.  Usually this is because they don’t have the time, resources or knowledge to deal with it. However, that isn’t always a bad thing.  If their website is mostly text-based, it won’t look too bad in a modern mobile browser.  Most mobile browsers (I’m talking about Android, iOS, Blackberry, etc) will handle text-based sites pretty easily.

David Eggers‘ popular McSweeney’s website is a good example of this “do nothing” strategy.  They present their standard website to mobile browsers and then prompt you to download their iPhone/iPad app. This is mostly likely a sales/marketing decision for McSweeney’s – as pinching and zooming in a mobile browser isn’t much fun. However, I could purchase their weekly articles inside their iPhone/iPad app for a much better user experience.  I suspect this “do nothing” strategy for their desktop content prompts many of their fans to do just that.

2. Build a separate mobile site.  Many large publishers (as well as smaller tech-savvy publishers) fall into this category.  In most cases, when a reader visits the publisher’s standard website with a mobile browser, she is automatically forwarded to the mobile-friendly site.  This option isn’t as easy as the “do nothing” approach, but it’s not much more difficult.  Finding the right mobile vendor or the right mobile publishing plugin to make this happen isn’t as difficult as it sounds.  Many newspapers and magazines relying on advertising as their main source of revenue decide to go this route for mobile devices.

Many blogging platforms like WordPress and Blogger have easy-to-install plugins that do all the heavy lifting in this case. There are also services like MoFuse that will take a simple RSS feeds and create a mobile sites on the fly.

3. Build native mobile apps. More and more publishers are opting to build specific iOS and Android apps for their content.  If done well, this can be a great experience for the reader to engage the content in ways that a browser wouldn’t previously support.  It can also be another source of revenue if they decide charge for the app (or content within the app) as the New York Times has done with their mobile subscription service.  This is a difficult option for smaller publishers because mobile application development is very expensive right now. Publishers that can afford to drop tens of thousands of dollars on a app will also need to update the app on a frequent basis when Apple and Android periodically release new versions of their operating systems.

The cost of building and maintaining native mobile apps put them out of reach of many small publishers.  (Although, that is changing as more and more mobile app developers are charging a smaller monthly fees or even revenue sharing for mobile apps as the market becomes flooded with mobile developers.)

Native mobile apps also reach a smaller percentage of the public (those who use smart phones), than the mobile web. Because of this, I think this option is best paired with a mobile-friendly website to reach the widest audience.

4. Convert your standard website to use responsive design techniques. Responsive design is a fairly new concept in web design.  It works by determining what kind of device you are using to access the website and delivering content best suited to that device.  If you are using a desktop browser, the site will deliver a content-rich site with photos, video etc.  If you are using a smart phone, the site will scale that content to fit your screen and bandwidth limitations.

There are pros and cons to this strategy. Unfortunately, the concept is so new we don’t have a lot of data to measure the success yet.  On the pro-side, a publisher only has one site to manage and one content management system on which to train their staff.  There isn’t a separate mobile site or separate apps to worry about marketing, etc. On the con-side, building a website with responsive design techniques seems more difficult than building a standard desktop website. Ethan Marcotte recently redesigned the Boston Globe to use responsive design principals. This is one of the first major publishers to experiment with responsive design and I am eager to see how they fair in the coming months.

I hesitate to say that responsive design is the best option available, but it certainly seems like the most efficient way to deliver optimized content to any device, regardless of screen size or bandwidth connection.

I think it will eventually become a very popular option for publishers and will keep my eyes on the Boston Globe to see how they fare.

I was searching for words within a page today using the new Firefox 3 on a Mac when I ran into what looks like a bizarre user interface blunder.  The “Next” and “Previous” buttons to find your search term on the page appear to be switched from the standard left=back and right=forward configuration.

I think it would be OK in the Japanese version of the browser (because Japanese is read right to left).  However, on all English versions of the browser the buttons should be swapped.

(Now that I think about it, the same goes for Spanish, French, German, etc…)

Am I crazy or is this really odd?

I just finished upgrading to FireFox 3.0 and so far the good outweighs the bad. Some things I noticed immediately are the bookmarks in my toolbar are completely rearranged and outdated.

Several of my bookmark folders were simply replaced by two folders called “Most Visited” and “Places.” It’s almost as if the installation grabbed an old copy of my bookmarks as it upgraded.

That is forcing me to scramble to find some old back-up copies of my bookmarks. And that is a pain. About half my add-ons are working correctly. I consider the following add-ons to be essential for any installation of FireFox: Web Developer toolbar, FireBug, TabMix Plus. TabMix Plus isn’t compatible with FireFox 3.0 yet; nor is Mr. UpTime, TinyURL creator and view source chart. But I can live without those for a while (until the developers update them…hint, hint).

The good news.

The speed is fantastic. The startup and shutdown times for FireFox 3.0 seems at least 3 times faster than FireFox 2.0. Even faster than I expected.

FireFox 3.0 appears to be using less memory (RAM) than FireFox 2.0 used on a regular basis. This frees up more memory for other apps to be open at the same time.

The navigation bar has been slightly redesigned, making the back button (pictured above) larger than the forward button (and also graying out the forward button when it is not needed). This is an excellent example of Fitt’s Law (the time to acquire a target is directly related to the size and distance of the target) in action. Mozilla’s interaction designer probably noted that most people use the back button far more than they use the forward button and adjusted the size to reflect that. Pretty sharp.

Overall, I’d say the upgrade was pretty positive with a few hiccups.

Take my advice and back up your entire machine (on an external source) before upgrading. That way you can simply copy over anything you may be missing (or back out of the upgrade gracefully if something goes awry).

Speaking of Firefox add-ons…what are some of your favorites?

Wow. I have been drinking from the fire hose of information for the past two days here in New Orleans at An Event Apart. The conference was organized by Jeffery Zeldman and Eric Meyer and according to the website:

“Their new conference wouldn’t be just for designers. It wouldn’t be just for coders. Attendees would gain a deeper understanding of web standards, of course. But they would also encounter a world of emerging best practices and inspiring new ideas.”

I didn’t know what to expect. Would the code be over my head? Would the design be beyond my skills? Would I be able to grasp the conceptual nuggets they would throw? I mean, these people are the best in the industry.

They’re internet famous, right?

As it turned out, each presentation was amazingly clear, surprisingly understandable and completely worth the price of admission. The difference between the presenters at An Event Apart and your run-of-the-mill web experts is an overwhelming sense of passion for their craft. Some of the highlights for me were:

Andy Clarke‘s astute observation about how comic book design can be transferred to the web to control pace and user engagement was refreshing, if not brilliant. It was one of those ideas that made me whack my forehead and wonder why I hadn’t thought of that. Andy’s a smart fellow. I added his blog to my feed reader immediately.

Brian Oberkirch, beyond being an extraordinarily nice guy, has an uncanny grasp on what humanizes the web. His talk Thursday afternoon was a lot like eating really good dim sum. I was filled with delicious savory tidbits about how sites can create human connections and positive social interaction with their users. Not shallow marketing, but real connections. The web would be a better place if more people listened to Brian.

I thought Eric Meyer’s CSS presentation, if any, would be the one that stumped me. I am, by no means, a CSS expert; and I feared his material would be tailored for people with more experience. However, Eric did such a good job of presenting his material in a way that made it easily digestible. I took away some very useful tidbits about how to use CSS to debug your markup. Very handy stuff.

I had never paid much attention to how beautiful data & information design could be until Jeff Veen spoke on Friday. His slide showing Google searches throughout the world as pinpoints of light on a globe was amazing. He spoke about data like some artists speak about color or texture. Data is simply another artistic medium.

Robert Hoekman Jr switched things up a bit. He did live usability assessments for people in the audience who needed some help with their sites. Usability issues fascinate me and Robert was very good at recognizing usability issues with a short glance at the site in question. I plan on checking out his book.

What can be said about Jeffery Zeldman that hasn’t already been said? Jeffery is the patriarch of web standards and has been fighting the good fight to make the web a better place for designers, programmers and users alike. He addressed a room full of designers as Yoda addressed his Jedi. Use your powers for good He was also very humble and approachable, something I hadn’t expected.

Here is some additional information about the speakers at An Even Apart 2008 in New Orleans:

Andy Clarke – Author, Transcending CSS
Dave Shea – Co-author, Zen of CSS Design
Cameron Moll – Author, Mobile Web Design
Jeff Veen – Design manager, Google
Brian Oberkirch – Publisher, Like It Matters
Aaron Gustafson – Co-author, AdvancED DOM Scripting
Stephanie Sullivan – Co-author, Mastering CSS with Dreamweaver CS3
Aarron Walter – Author, Building Findable Web Sites
Robert Hoekman Jr. – Author, Designing the Obvious
Jason Santa Maria – Designer, Happy Cog
Eric Meyer – Author, CSS: The Definitive Guide
Jeffrey Zeldman – Author, Designing With Web Standards

If web design, development and standards interest you then I would recommend checking out An Event Apart. I had a blast and hope to attend again in the future. It was good to hang out with Tim and the rest of my pals from BarCampNOLA in New Orleans.

Hope to see you all again soon.

Mozilla community (makers of FireFox, Thunderbird, Bugzilla, Camino and other fine applications) have announced their intension to build mobile browsers for both touch screens & non-touch screen phones.

I think they have a great shot at competing directly with the likes of Apple, Palm, Nokia, RIM, Microsoft, etc in the mobile browser market.  Most mobile browsers are lacking in basic functionality of some sort.

• iPhones can’t copy & paste.  It.  Can’t.  Copy.  And.  Paste.  Think about that for a minute.  Palm Treos over 6 years ago could copy and paste.
• Blackberry browser laughs heartily at your mobile CSS while slapping its knee.
• Internet Explorer Mobile is almost as fantastic as Internet Explorer’s desktop version.  D’oh.
• Opera Mini, god bless them, are trying, but not much better than the rest (frequent connection errors have tainted my once-cheery opinion of Opera Mini.)

Most mobile browsers have serious issues supporting JavaScript, CSS, AJAX, Flash, audio, video, etc.  None offer developers tools or plugins to allow any real dissection of a page.  I would LOVE some sort of “Email me page source” and “Email me screenshot” tools.  For that matter, many phones are capable of voice-dialing.

Why not use voice browsing to automatically open a browser and navigate to a preset audio bookmark?

1. “Find Starbucks” – could trigger google maps search
2. “Browse CNN” – open CNN mobile homepage in your browser
3. “Wiki Ben Franklin” – searched Wapedia for Ben Franklin references

There are infinite possibilities when you ponder all the available functionality of a mobile phone.  They are, after all, audio devices first and foremost.  Let’s put the audio to good use.

Speaking of functionality, Google is beginning to use a combination of GPS and cell tower pings to determine where a user is located for their mobile maps product.  It’s not perfect, but pretty accurate and more importantly, it’s combining interesting features of the phone (WAP & GPS) to create an application that is greater than the sum of its parts.

I hope Mozilla pushes the envelope and begins utilizing more of the phone’s capabilities than just a simple browser.

Track the progress of the browser development on Mozilla’s wiki pages:

Touch screen browser wiki
Non-touch screen browser wiki

I’ve been working on our mobile site a lot lately and found this great FireFox plugin that has helped me a great deal. I’ve spent a lot of time looking at how newspaper sites present their mobile-friendly WAP sites. WAP usability and interface designs are wildly different in comparison to their full-featured main websites.

The tricky thing about investigating mobile sites is that many of them sniff out your user agent and redirect you to the mobile site only if they detect you are using a mobile browser. Several actually filter in the other direction as well.

Try this little test and you will see exactly what I mean. Try going to mobile.nytimes.com (new window) in your browser right now. If you are using a normal browser (IE, FireFox, Safari, Opera, etc) you will be redirected to the New York Times’ main site. This redirect forces you to use an actual wireless device to surf the New York Times’ mobile version.

This, my friends, is a tad annoying when trying to investigate mobile sites.

To get around this I installed a great FireFox addon by Chris Pederick that enables me to set my user agent to any browser I’d like (including mobile browsers like the Blackberry, Iphone, Treo, etc). I found a few user agents for mobile browsers here to configure the addon and I was good to go.

Now I can simply tell FireFox to act like an iPhone and it will render those automatically redirecting sites without any trouble. Fantasitc.

I told a co-worker about this cool addon to FireFox and he responded “Oh yeah, Safari has a user agent switcher built in. Check it out.”

He’s absolutely right.  Looks like Safari includes the ability to render pages as an iPhone if you want. Pretty cool, although I still use the FireFox addon to spoof Blackberries, Treos, and any other mobile browser I can find. Here are the links you’ll need to make this happen:

FireFox user agent switcher addon
Resource for user agents (not just mobile)

Hope you found this useful.

“After 1 February, there will be no more active product support for Navigator nine, or any previous Netscape Navigator browser,” wrote Mr Drapeau.

“We feel it’s the right time to end development of Netscape branded browsers, hand the reins fully to Mozilla and encourage Netscape users to adopt Firefox,” he said.

I remember thinking  Netscape Navigator was pretty cool when it first came out.  That coolness has since evaporated along with floppy disks and dial-up modems.

I’ve been using the Mr Uptime FireFox add-on for several months now and it just dawned on me that I use it fairly often. Mr. Uptime saves me time and hassles in one fell swoop. Here’s how it works:

Let’s say you are reading your favorite RSS feed or visiting your favorite news aggregator (digg, slashdot, whatever…). You click on a link that is referenced on the site and …blam…404 file not found. For whatever reason, the site is currently down or experiencing database problems, DNS issues, they didn’t pay their electric bill…whatever.

That is where Mr. Uptime steps in. It notices that you couldn’t reach the site and offers to monitor the page in question until it becomes available. As soon as it’s available, it will offer to open that page in a new tab, window or simply alert you that it’s available now. I have mine set to alert me and open a new tab in the background, so it doesn’t disturb whatever I’m reading at the moment.

There is also a nifty menu option that allows you to highlight some text on a page (such as an SQL error) and set a rule to watch for that SQL error to go away. It then notifies you when that SQL error goes away (see image below).

That about covers it. You can download the Mr. Uptime FireFox add-on here. It’s free and pretty cool.

No go forth and surf; and don’t worry about site getting Dugg or Slash Dotted. Mr. Uptime can keep an eye on them for you.

I downloaded Flock over the weekend and plan on kicking the tires for a few weeks to see if I like it. Flock is a browser based on the Mozilla FireFox browser (that you all should be using by now because it contains vitamins and minerals and buttery goodness and it works on lots of operating systems out there).

Flock does something FireFox doesn’t. It connects people to their social networks out of the box. When you open Flock for the first time, you need to configure it to connect to Facebook, Twitter, Youtube, Flickr, Delicious, etc. It then logs you into all of your accounts at once and opens up a sidebar that allows you to see all of your social networks in one nice package.

I’ve just started playing with the blogging functionality of the browser as well. It lets you post entries to any number of popular blog sites without ever leaving the webpage you are currently reading.

I hope Flock gets some more market share in the browser wars. At the very least, FireFox can get some great ideas from them for a more socially connected browser experience.

The one thing I wish Flock had…extensions. FireFox is a development dynamo with loads of extensions to help web developers. So far, Flock is very limited in that arena. My hope is that Flock will eventually allow a smooth integration with all FireFox extension.

If that happened, it wold probably make the switch much easier for the development community.

Flock covers all their bases and is currently offering versions in Windows, Mac and Linux.

I’ll let you know what I think in the coming weeks. My goal is to use it several times a week until the end of the year.