Creating for the Mobile Web: 20 Great Resources for Designers and Developers

by Vero on Mar 25

Everyone has a first time. It’s a special moment, one where we enter a world of unknown and uncertainty, fumbling around and finding enjoyment in the discovery.

I’m talking about the first time we design a mobile site. Obviously. Ahem.

So since everyone’s got to start somewhere, here are some choice resources for anyone new to creating for the mobile web. It’s one thing to create a design and hack some code together, but don’t forget the importance of testing and promoting what you create!

Designing

  • Sitepoint’s Brian Suda writes about the basics of designing for mobile, starting with thinking about screen size and why these people are coming to your site.
  • Sender 11 is an extremely useful blog on mobile interaction, filled with great posts and tips on designing for mobile
  • Oriented towards the iPhone, A List Apart suggests ways to exploit the unavoidable device with Mobile Safari and beyond.
  • For those of us who still occasionally crack a book open, Cameron Roll’s Mobile Web Design comes highly recommended.
  • Even further, if you enjoy social interaction, you might like to take part in a MobileCamp, which is an opportunity to get together with people who work in or love the mobile world. It’s a great place to swap ideas, find new development partners or just check out what everyone else is up to.

Developing

Testing

  • Ready.mobi: Score your mobile-readiness with this useful tool provided by dotMobi
  • DeviceAnywhere is the de facto commercial testing tool, allowing you to test mobile sites on a wide range of networks and devices.
  • Tarek Esber wrote a great post about mobile device testing services and products, ranging from non-profit services to manufacturers’ own developer portals and other options like emulators and outsourcing.
  • Forum Nokia Launchpad is a cheaper alternative to the Forum Nokia Pro program, for those who are developing mobile applications.
  • Only available to the American market is Amazon’s Mechanical Turk which can be used to outsource testing. Your mileage will most likely vary, depending on the complexity of the testing you require.

Promoting

  • AdMob is the largest mobile advertising network out there. Useful if you’re looking to either publish ads on your site for some revenue, or if you want to advertise on other sites.
  • Wapreview is not only an excellent blog by Dennis Bournique, but also an index of useful mobile sites, all rated out of 5 for content and usability.
  • Twitterfeed allows you to automatically share your blog entries to your Twitter feed. Why not create a feed of mobile-friendly content for those mates of yours who mainly use Twitter from their phone? They’ll love you for it!
  • AdSense for Mobile Content: Google’s widely used ad network is also available on mobile. Like AdMob, you can sign up as advertiser or publisher to meet your promo goals.
  • Got a great mobile site? If we’re not already including it in the Taptu search engine index, it may not be on our radar yet. Email me on vero@taptu.com and we’ll visit your site when we next let the crawlers loose.

Got some resources you want to share?

Sprint & OpenWave are breaking the mobile web: Why transcoders suck

by Vero on Mar 20

The mobile web is still only a fragment of the wider desktop web we use everyday, so one of the challenges operators, website owners and users face is how on Earth to cram this big web onto small screens.

Different people tackle the problem in different ways, as the Sender 11 blog points out:

Apple: Adapt the phone to the web.
Opera: Adapt the web to the phone.

But then, there’s a third option: Bulldoze everything with a transcoder, including sites which are already mobile, and don’t shed a tear for the casualties.

This approach has unfortunately been adopted by a number of operators, namely Vodafone and TeliaSonera with Novarra, and Sprint with OpenWave.

When I think of the carelessness these guys are exhibiting, I get a Hulk moment “Vero angry, Vero smash phones! ARGGHHHH!” It boggles the mind how Sprint can go as far as saying it’s in the customer’s best interest. If they really cared about the customer experience, they wouldn’t highjack user agents, they would acknowledge sites which are already mobile-ready and they would listen to the community’s needs.

Anyone who isn’t directly involved in the mobile industry is unlikely to realise that the site they’re browsing looks crap on their phone, not by the website owner’s fault or because their phone isn’t up to par, but squarely because of the operator’s complete disregard for its customers. A little bit of me dies every time I see a friend criticize the mobile web’s shortcomings when it’s really due to bastardised transcoding.

Operators claim to be offering a proverbial olive branch by telling mobile website owners to request to be added to a whitelist. Dennis at Wapreview sounded the alarm on the latest whitelist to join but this is a neverending game of whack-a-mole! As far as I know, between Spain and the UK, Vodafone doesn’t even share its whitelist! (If anyone can tell me I’m wrong on this one, I’ll regain a bit of faith in the Big Red.)

As Dennis explains, unless you have a handset on the local network, it’s difficult to find out what’s happening to your site once it goes through the shredder:

Unless you have a Sprint handset there’s really no way to tell if your site’s being transcoded. If you do have a Sprint phone you can generally tell just by looking at the screen but if in doubt use the device’s Show URL browser menu command. If it starts with http://sprint.aopwv.com/ you are being transcoded.

Mobhappy, Mike Rowehl, Techype, RCR Wireless News and Semapedia, amongst others, have picked up on the issue, and they’re all as unimpressed as I am with the situation.

How could anyone, in their infinite wisdom, think this was a scaleable and manageable way to decide what sites to leave as-is? Seriously, I’m willing to give anyone from an operator a fair hearing, I’ll even buy ‘em a beer, if they can explain to me how they’re going to improve on the current situation from here.

If you’re a developer and your mobile site is affected by the latest Sprint issue, register on the Sprint forums and leave a comment in this thread to get whitelisted.

[Update: Russ at Mowser posted, following my angry post, to shed light on how what Mowser does is different to the operator’s transcoders, so if you’re still fuzzy on what is proper and improper behaviour for adapting content, check out his post. At the core of it all though, Mowser listen to their users and are part of the community rather than living up in that cozy ivory tower. That makes all the difference.]

Design inspiration for recent Apple products

by Vero on Mar 18

In technology, we’re always so focused on the future, on what’s coming next and what’s going to be the next big gadget or web app to break into the spotlight. Gizmodo’s Jesus Diaz looks to the past for the designs that inspired Apple’s products. It’s impossible to deny the resemblance in some of the 60’s styling and our latest shiny goodies.

Dieter Rams & Jonathan Ives

We’re big fans of great, simple design here, so it’s comforting to think that great design is here to stay, revived in different forms through the ages. I’ve had this quote from Rams stuck in my scrapbook for years now, but it’s good to see Gizmodo bring it up as well.

This passion for “simplicity” and “honest design” that is always declared by Ive whenever he’s interviewed or appears in a promo video, is at the core of Dieter Rams’ 10 principles for good design:

  • Good design is innovative.
  • Good design makes a product useful.
  • Good design is aesthetic.
  • Good design helps us to understand a product.
  • Good design is unobtrusive.
  • Good design is honest.
  • Good design is durable.
  • Good design is consequent to the last detail.
  • Good design is concerned with the environment.
  • Good design is as little design as possible.

[Via Thought Balloons]