Shock horror Flash doesn't work on the iPhone or the "magical" iPad. Steve Jobs has declared its death, and decreed that it's not worthy of inclusion in Apple's market leading mobile platform. Dropping Flash in favour of HTML5 is akin to replacing floppy drives with CD-ROMS we are told. You don't need it, you will be better off without it, it's time to stop living in the past and embrace the future. Naturally Adobe (the makers of Flash) aren't too happy about having the door slammed in their face. Adobe tried launching a campaign online but were forced to accept they have lost the battle. However the war is only just heating up; Google's latest phones support both HTML5 & Flash.

The controversy has been fodder for bloggers, sparked flame wars between fans, and led to an awful lot of FUD (fear uncertainly and doubt) being spread online. This puts many of us in the industry in an odd position. For years Apple and Adobe have been the pillars of the creative industries. As developers and designers we have a love hate relationship with both companies. Designers need photoshop to get their work done, yet vent about it online. Developers love apple hardware, but have a hard time accepting the App Store's restrictions on how they can write their apps.

Which side are you on?
Despite what you read online I don't see a major split in the web community between HTML5 and Flash or between iPhone and Android for that matter. On the contrary, I see lots of overlap. In our industry it pays to have multiple disciplines. Lots of the popular games for the iPhone are written by people who are also Flash game developers. The people doing the cool 3D demos in HTML5 are often the same people who pioneered 3D in Flash. Those of us working on the cutting edge do not erect walls between technologies, we tear them down.

Flash has a long history of bringing innovations to the browser: animation, fonts, audio, video, 3D, and networking to name just a few. Recently we have noted interest and momentum building behind HTML5. It's about time browsers had native support for many of the things Flash has supported for years. The 4 "modern" browsers (Chrome, Safari, Opera, Firefox) are competing against each almost daily to take the crown as being the fastest, and most feature complete implementation. Competition is a good thing, after years of stagnation it's an exciting time to be working in the web. If you are stuck using a "legacy" browser (hint: the one with a blue e) do us all a favour and upgrade today, I promise you won't regret it.

Unfortunately outside of cutting edge Mobile web it's hard to fully utilise all the advances offered by these "modern" browsers. The elephant in the room remains every web developers pet hate; Internet Explorer with it's stubborn 50% market share. Even if Microsoft were to support full HTML5 and CSS3 in IE9 (unlikely), we won't see IE7 and IE8 disappear for years to come. Many sites are only just getting around to phasing out IE6. The key strength of Flash has always been that it's cross browser; unencumbered by the incompatibles and quirks that have plagued browsers. With penetration rates hovering close to 100% and a fast upgrade cycle driven by automatic updates it's no wonder Flash has become the de-facto standard for delivering video and rich experiences online.

So where does this leave HTML5 and CSS3?
Some features lend themselves to progressive enhancement, enabling HTML5 drag and drop file uploads or offline storage for those with capable browsers is an easy win. Using the latest CSS3 properties to render nice UIs while still degrading gracefully to support IE can be tricky, but is doable. It doesn't have to be pixel perfect, it just needs to work in older browsers. This leaves those features that you can't degrade gracefully without falling back to an alternative such as Flash. This category includes the much hyped video tag and canvas element.

Video support in HTML5 is still a bit of a minefield, there are 3 different codecs (H264, WebM, and Vorbis) that may or may not work in your browser, some with critical hardware acceleration, others lacking. In order to provide the best experience on the web and mobile you need to encode and deliver the video in multiple formats as well as providing a Flash version for those without HTML5. There are other rough edges too, such as fullscreen support; which depending your browser works differently or may not be supported at all. My advice to clients is to do what YouTube is doing and give users the choice to pick what works best for them.

This brings me to canvas element, a resolution-dependent bitmap canvas, used for rendering graphs, game graphics, or other visual images on the fly. Many of the demos show it being used for amazing Flash like experiences. Unfortunately there are problems here too. when you do a lot of animation and graphics processing you are going to burn CPU. Lots of it. Technology can always be abused at the expense of your CPU, those annoying battery draining banner ads can be rendered using canvas on the iPhone too. Recently Flash player added code to throttle down processing on browser tabs that are not active. I expect a similar feature will have to be added to browsers to control canvas abuse. Then there is the legitimate concern of accessibility, while it can be a challenge to create truly accessible Flash, it is at least possible.

In conclusion
Despite all the challenges I think it's our duty to push for the adoption of the latest web standards. While I may not agree with Steve Jobs reasons for banning Flash from iOS, I'm grateful that the controversy has put the spotlight on HTML5. I take issue with the assertion that Flash is a dead technology, on the contrary I see Adobe continuing to innovate and evolve Flash for many years to come. When noise generated by all the bloggers and fanboys has died down, it will be left to us humble web designers and developers to make all these technologies work for users.

In the past few years, one of the biggest areas of change for the Web has been the amount of Internet users who are accessing websites via their mobile devices. You are probably aware of the facts: today, 71% of smartphone owners are browsing the Internet (88% of iPhone users do, 92% for Android). And this trend isn't going to stop: 4 billion mobile subscribers worldwide are expected by the end of 2010(1).

However, accessing Web content on a mobile device is still a rather inconsistent experience. Dozens of mobile browsers exist, each with different rendering capabilities. Designing and building mobile sites brings some unique situations and challenges. For web developers, optimising websites for mobile browsers is often a painful and difficult process.

But things are changing: the latest mobile browsers, available on the iDevices (iPhone, iPod, iPad) and Android phones (Nexus One, Motorola Droid) are game changing, offering a much superior browsing experience to their users. Amazing results can be achieved, as web developers are now able to make use of the latest web technologies, even on mobile devices.

It comes as no surprise that the US mobile browser usage is now dominated by the iPhone, with 64%(2), and Android, which comes second at 19%. Both Apple and Google are pushing mobile browsing, and empower their users with tools far ahead of the competition.

But whether or not you decide to focus your mobile strategy on the iDevices and Android specifically, here are a few things to consider when going mobile:

Simplify
The key to a successful mobile site is simplification: simpler navigation, fewer options (especially in web apps), a reduced amount of text, and possibly fewer images. While webpages made for the desktop often get crowded (banners/ads, huge blocks of text, countless buttons and links etc.), mobile websites have to remain simple. What is important on the page has to be kept, but the rest should be cut out. Less is definitely more on mobile. With fewer (carefully selected) options available to the mobile user, the site gains usability and the viewer is likely to continue browsing your site.

Think lightweight
Because of the limited bandwidth on mobile devices, as well as the inherent hardware limitations, an important focus has to be put on optimisation (load speed, image compression). Your visitors using mobile devices do not need high definition pictures, neither do they need ambient sounds or music. Pages have to be leaner, so users are spared excessive bandwidth costs and enjoy a faster browsing experience.

Prioritise content
What is crucial in your mobile strategy is to put "function before form" and present users with a customised experience, relevant to mobility. Your mobile site has to be contextually relevant to your users, and first address how content is consumed. If you are an online reseller, you might want to put the search bar at the top of your page and a quick way to find a local store (which are the most likely actions users will need on mobile); if you're a small business with an online presence, you would probably need quick access to your phone number (e.g. a "Call us" button) and address (e.g. "here's our address, view it on a map"). The logic is that your viewers who are accessing the website are on the go and probably have something very specific in mind!

Do not neglect the Mobile Web
Having a mobile website doesn't mean removing images from your website. It deserves it's own strategy and requires dedicated development. As the number of users browsing the Web from mobile devices continues to rise, you cannot miss the opportunity to shine!

References

1. Mobile Subscribers to Reach 2.6B This Year
   
2. Net Applications, February 2010

We have just launched a lightweight mobile and smart phone friendly version of our website.

codegent.com/mobile

This is a classic WAP style site that has been designed to work across the broadest range of mobile devices that still dominate the marketplace. Our focus here has been on keeping the code limited and easy to navigate with minimal images to download.

codegent.com/iphone

We have also produced a sexier version that is optimised for the iPhone or any Smartphone running Android (such as the new Nexus) that leverages Webkit and CSS3. Check out the funky finger swiping scroll on our about page and portfolio and if you ever need to find us on your way to a meeting fear not, its all integrated with Google Maps at the touch of a button.

Just go to www.codegent.com on your device and we will automatically take you to the most applicable site.

2010 is certainly not the first to be touted as the ‘Year of the Mobile Web’ but with the recent launch of the Nexus One and the likely war that will be waged between Google and Apple, it may be the first to actually go some way towards fulfilling its billing.

Currently, 1 in 7 minutes of media consumed in the UK is via a mobile device of some description. That number is set to rise with the end of the iPhone/O2 exclusivity deal, the addition of the Nexus One to the market and the inevitable clamouring amongst the remaining handset manufacturers to catch up. Mobile specific content is no longer a differentiator for companies; it is fast becoming a necessity as users move away from their PCs.

As we become more proficient at sifting through the mass of information at our fingertips and with the evolving development of the semantic web, we are starting to browse for information less and scan for it more. The ‘Smartphoners’ are the biggest ‘scanners’ of us all as they hunt out that quick hit of data; be it social updates, news, directions or very specific information. More and more user journeys follow the pattern of;

search engine > top listed page > back to search engine > another top listed page

As a result, as smartphone market share increases, bounce rate percentages across the land will inevitably rise as users who aren’t finding what they need quickly head off in search of it elsewhere.

The challenge we will face as designers, developers, UXers and strategists is how to overcome this behaviour and capture a user’s interest before they head off into the virtual sunset. The type of thinking that we need to do as creators of content for the mobile web is no different to that which we need to do for the desktop web; there is just less margin for error.

Think in pixels - Information Architecture needs to reflect the hardware that the audience use and this will increasingly mean a screen resolution of 480 x 320. This means cut down copy, reduce layers of navigation and think about content weighting – what are the most important of all the important things you are trying to say? What about font size? Can you read 10pt Verdana easily on an iPhone? Do those beautiful, detailed icons mean anything to the guy scanning your site on his Palm Pre from a train?

Clarity of message – Keep it short, and to the point.

Take SEM by the balls– It is unlikely that a mobile user will get past the first 1 or 2 pages of Google results so to be in with a chance of getting that click-through you need to be running intelligent PPC campaigns (Google mobile still makes room for sponsored links both on its mobile site and iPhone application), have outstanding SEO or go niche – ideally a combination of the 3. Interestingly, Google's mobile search also has room for a couple of real time results so all the more reason to engage with your audience on the social web.

It’s all in the content – I know we always bang on about this, but it is with good reason. Why are your users coming to your site and how do they generally find you? Look at your analytics; what are they looking for and how can you better deliver this information? Smartphone users are less inclined to browse and if they aren’t quickly seeing what they are looking for you may as well wave them goodbye.

The smartphone world is the antidote to the big budget, FWA world of 27” iMacs and megabytes of Flash. It is all about simplification of your message and real emphasis on what audiences want. It is a world where vanity must make way for clarity of message and ultimately one that requires us as an agency to really earn our fees in the field of usability, audience expertise and successful user conversion.

Here are a few of the current heroes from the world of the mobile web;

• http://www.bbc.co.uk/mobile/ - easy to use and the right mix of content. Most importantly it doesn't feel like a stripped back version of the full site and of course there is the iPlayer.
• http://touch.facebook.com/ - Everything from the full site, cut up into bite-sized pieces.
• http://mobile.flightstats.com/go/Mobile/home.do - a simple site that helps you find crucial information when you need it.
• http://onetrip.org/ - more of a web app than a site but worth mentioning as they have consciously gone minimal with no GFX to speed up mobile load time.
• http://m.google.com/ - everything you can do on the Google you can do here from searching to mail.

It is with interest which we have been watching Google’s Android Application competition. This is the $10m competition to develop applications for Google’s Android mobile platform. The 50 semi-finalists were announced today, and although a lot of the applications are shrouded in secrecy, a strong theme seems to be developing. The majority of applications seem to be based around Social Location tools, or Security applications.

For more about the semi finalists information have a look at this site.

Most of the industry are predicting a breakout year for the mobile web in 2008.

For a long time, the mobile web has been unpredictable, costly and low on user take-up. The majority of campaigns I have previously worked on with any serious mobile element have just scraped the surface, tapping into popular SMS and MMS services.

So what is encouraging us to use our mobiles online?

Apple's iPhone, released in late 2007, has made mobiles very sexy again.

If you haven't heard of it (welcome back to Earth, the wall is down and the cold war is over) the iPhone is a revolutionary device that unites your calls, contacts, email, music, camera, web browser etc in a dynamic, touch-screen, curvy-edged box.... and regular people are using it in droves!

For many reasons it would be wrong to confuse the iPhone with most mobile devices, especially if you are considering building a mobile site, but it has finally united the idea of phone and web working together properly.

It's not just the technology that has pushed us. Major websites, search engines and social networks such as YouTube, Flickr and Facebook have placed mobile services at their core, tempting unsuspecting users into an ever-connected virtual world.

Location Based Services

We have been using Google Maps and Sat-Navs for a while. It makes perfect sense to be applying all this thinking to your mobile. Needless to say the iPhone already does a lot but what about the rest?

In 2007 Nokia acquired a mobile advertising firm and a leading navigation system company. It isn't hard to see where they see things going. The benefit to marketers is easily delivered, relevant, geographically contextual content to end users.

Open Platforms for Applications

It's not all about browsing! 2007 really brought home the possibility of the web app, widget, mashup etc. Vista followed the Mac's lead and introduced desktop feeds for your local weather, football scores, status updates (the list goes on forever) and we all became RSS junkies. Adobe launched AIR and iGoogle followed suit so even your default homepage can tell you everything about anything you want.

But what about the mobile phone? Geeks have been hacking the operating systems on their phones for years but there have been no open standards available for developers to really use the core features of a physical handset. Until now!

The Open Handset Alliance Project launched Android, an open, free mobile platform which is being supported by some heavy companies such as Google, Motorola, LG, Samsung and T-Mobile to name a few. Expect that to be supported as standard in most future handsets.

Apple decided to open up the iPhone Developer SDK last week so we can look to develop intelligent bespoke apps that can fully interact with the handset soon!

Mobile Web Standards

There has been a degree of convergence in web standards for mobile. XHTML-MP has become the default industry-supported language for the mobile web. Page load and the multitude of various screen sizes still need to be taken into account when designing but at least the code is behaving itself!

Codegent Mobile

So we thought after all that talking we should show you something. We have built a simple version of our own site for your viewing pleasure.
www.codegent.com/mobile/

Or you can navigate to it using your mobile barcode scanner on the funky looking graphic below. You will see these dotted around everywhere soon. The Japanese have been using them on outdoor advertising, business cards, print ads etc. for years. But don't feel too left behind, they also have robotic dogs that clean their flats whilst they micro-sleep :)

Geek out.