3

Local Search, Flash and Mobile Devices: Does Your Site Fail?

Yesterday, I was thumbing through the latest edition of Tattoo Savage and got it into my head that I finally need to get those dermal implants in my wrists I've been wanting so badly.

Dermal ImplantSo, I hopped on my trusty iPhone and started looking for local body mod establishments here in Austin. Now, the occasional shabby website designs aside, what disappointed me most in my search for local tattoo and piercing shops was the fact that I couldn't view their websites at all on my iPhone.  It wasn't a matter of not having a mobile-friendly version of the site available (though that would be nice).  It wasn't even a cross -broswer compatibility thing.  It was the current nemesis of mobile accessibility: Flash.

While there has been chatter for quite a while that Flash 10 would be the panacea for the lack of Flash accessibility in mobile devices, that seems to be a lesson in disappointment.  Apple remains firm on supporting HTML5 and CSS3 for Web interfaces and streaming media.  However, this doesn't necessarily mean that there will be a mass exodus from Flash-based animations, applications, advertising, etc. Flash won't be going away anytime soon.

You might think, "Well, hardly anyone will see my site on a mobile device anyway, and I want a big shiny Flash site!"  Here are some sobering local search statistics, my friends.  And check your site analytics and review how many have tried to access your site on a mobile device: you'll be surprised.  Horror/dark art sites? I'm talking to you, too!

How did local business websites fail in my mobile device?

While there was plenty of information to be found about local Austin tattoo and body mod parlors in resources such as Google Places, etc in the search engine results, when clicking in to the actual websites on my iPhone, I was greeted with one of two scenarios:

A.  The entire homepage of the website was a Flash-based splashpage, resulting in a black screen and a little blue Flash FAIL box ( = NO WAY to enter the site.)

B.  Essential areas of the website such as contact forms, portfolios or navigation were Flash-based and resulted in the little blue Flash FAIL box.

Examples of tattoo/piercing websites doing it wrong:

True Blue Tattoo, Diablo Rojo, and as for Steadfast Tattoo, the little bitty 'enter' link is barely visible to the naked eye on a mobile device and is a weak Flash splashpage navigation Band-Aid.  (And while Body Adorned didn't fail, they need to lose the animated GIFs. Seriously, you guys...)

Even Tattoo Savage magazine's website failed!  I've been wanting to advertise in this mag and when I visited their page on advertising rates on the iPhone, the area that contained the contact form for more information was, you guessed it, Flash-based and resulted in the little blue FAIL box.  Did I get up, go into my office, turn on the lappy, find the page again and fill out the form there?

No.  And I probably won't for a while because now I'm out of the mood.  That's a personal example of how you dissuade or lose a customer with essential site navigation or calls to action in a non-accessible format such as Flash.  And I'm a web snob.  If you're site won't let me in, it says a lot about you as a company.  This is skewed and wrong, but it's how web users operate. Get with the times.  #toughlove

Examples of tattoo/piercing websites doing  it right:

These sites are accessible and functional in an iPhone and allow me to not only review their sites in-depth but also see galleries of their work. I was also able to view their contact us pages and get the info I needed.  Good job!

Industrial Primitives, Atomic Tattoo

How does the local small business take mobile devices into account when designing their websites?

How can local businesses design their sites to both take advantage of the benefits and attractiveness of Flash animation while ensuring their sites are accessible to local customers searching for them on mobile devices?  It’s really easy, actually!  While working with your web designer on navigation and design elements for your new site, simply do the following:

  1. NO splashpages.  Just don’t do it.  Whether on a desktop or mobile device, they’re outdated, annoying and a waste of an essential click to access the site.  I (and other web users) don’t care about the talent of your web designer that’s been wasted on a non-essential page and that they probably charged you extra for.  I want a tattoo and want to see your portfolio and contact you.  Period.
  2. Ensure that the site navigation and portfolio areas aren’t embedded in Flash. Having these areas in Flash is bad for search engine optimization, and it makes it impossible for visitors to navigate your site or see your work on mobile devices.  Consider an HTML/CSS-based navigation. As for portfolios, etc you can do some nice things with jquery, and other techniques for sliding images, etc.  (We did it on the RRC website’s portfolios, you can too! They look awesome in an iPhone and don’t use Flash.)
  3. Include all contact info (full address, email link, phone, etc) and a Google map on your contact page and if your form is dynamic, don’t make a Flash-based form.

 

It’s that simple!  You can blend Flash animation into a website nicely, without compromising usability.  When I’m looking for local tattoo and body mod shops, your website may be more or less attractive but frankly, I don’t care.  What will sell me is the quality of the work in your portfolio, my ability to learn more about your artists and the ability to find and contact you.  And if I can’t do that from wherever I’m at in Austin, even my armchair, you’ve lost me.  #moretoughlove

What if a business already has invested money and time in a Flash-heavy website?

This is also a quick and easy fix or your designer to do.  Simply add HTML links along the top or bottom of the Flash homepage animation (splashpage), allowing the user to get into your site quickly and easily.  Also, remove essential elements such as navigation and contact forms from Flash.  It might take a little bit of work, but your web designer should ethically not charge you much to do this since they provided you with a site inaccessible to mobile devices in the first place. If, however, your designer told you a splashpage or Flash navigation was not the best idea, and you wanted them anyway, then they have the right to charge you to go back and sort it out.

The Wrap Up

While I focused on tattoo and body mod shops, this applies to any local small business wanting to make sure customers can find their businesses from anywhere around town on mobile devices.  Make the right choices when designing or re-designing your local business website.  This will ensure that your customers can find you easily, while the big names in web and mobile technology get their act together and decide to play nice in the sandbox. 

Also, I in no way want to imply that the majority of web designers are ego-driven hacks who want to sacrifice your site’s usability for their artistic endeavors.  There are clients who ask for ridiculous things on their websites everyday and an ethical designer will explain the costs and benefits of certain applications or design techniques.  If the client still wants a splashpage, full Flash site, etc after such an explanation, well…there you go!