Posts tagged mobile

Wikipedia defines Responsive (Web) Design (RWD) as “a web design approach aimed at crafting sites to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones).”

It is a technical strategy involving HTML, CSS and often JavaScript. It is not my intention to go into details here.

Often, when discussing a re-design of a website, the owner will be encouraged to consider Responsive Design. Several of the major sites that sell templates offer RWDs. This is good, but it is my contention that RWD is not a solution to all of the issues confronting businesses hoping to improve the way they present across all potential platforms.

A RWD is no more a complete solution than consuming less sugar is a complete solution to our health needs. We may fall for the advertising of some products but we should know (to at least some level) that we need a balanced diet (probably less fat, less sugar and more fibre, and fruit & veg) and exercise if we are seriously striving to improve our overall health.

For a website, RWD is a good first step, but not all RWDs are equal and there are many things to consider, starting with “does a visitor on a mobile device have different needs to other visitors?”

If the answer is yes (and it almost certainly is for most businesses), an understanding of those differences is needed.

The most likely difference is a mobile visitor needs a phone number and possibly a map to help find the business. A desktop visitor might be more interested in researching products. Accommodating these differences is unlikely to be handled by a generic responsive design intended to turn 4 columns of content into a single longer column of content. Yes it will do it simply and gracefully, but it won’t necessarily make the phone number or physical location any easier to find.

Every business is different as is their mix of mobile and desktop visitors. Have you started considering your customer’s needs?

Update: 2 April 2013

I came across this blog post today - How Common Are SEO Problems With Responsive Web Design?. I seemed relevant to the discussion.

Related articles:

• Going mobile - one step at a time (part 1: struggles with external files) (blog.midboh.com.au)
• Going mobile - one step at a time (part 2: the trouble with forms) (blog.midboh.com.au)
• Going mobile - one step at a time (part 3: Flash rears it’s ugly head) (blog.midboh.com.au)
• Going mobile - one step at a time (part 4: Turn down the volume) (blog.midboh.com.au)

photo credit: efe6_es via photopin cc

We see people using mobile phones and tablets in all corners of our society - trains, coffee shops, libraries and while doing the shopping. We know people are using these same devices while sitting in front of the television. - perhaps as a distraction during he ads or socialising with friends about what they’re watching. These same devices are used in bedrooms - catching up with important reading or even doing some online shopping.

Some of these locations have a reasonable expectation of very low noise.

Image your surprise while sitting in the quiet carriage on your hour long commute doing a little surfing of the web and you land on a page that immediately starts blaring out music. Unless you leave your device on mute you will definitely annoy your neighbours. They tell me there are informal but vigilant noise police on the quiet carriages. Is this sort of (lack of) noise expectation any different with your partner trying to sleep or while others are watching the television or strangers having a quiet chat over coffee.

Please, please, PLEASE, don’t fall for the temptation of playing music as part of the presentation. It doesn’t matter how pleasant the music. It will be an unwelcome surprise for many visitors. Don’t think a volume control on the page is sufficient. There is no standard interface. They are not easy to find, particularly when under pressure. You want your website and business to be memorable. Make it for something positive.

“Language Of Music Really Is Universal” may be a true statement. I’ll leave others to make that determination. But I do know there is a huge divergence in tastes that is impacted by age, race, education and experience. What is pleasant to you may not be to me. This is another trigger point that can impact a visitor’s perception of your website.

Related articles:

• How does your website look on a mobile phone? Have you checked? (blog.midboh.com.au)
• Going mobile - one step at a time (part 1: struggles with external files) (blog.midboh.com.au)
• Going mobile - one step at a time (part 2: the trouble with forms) (blog.midboh.com.au)

Welcome back to my occasional series on ensuring your web presence is compatible with the mobile future. In this episode, I return to one of regular adversaries - Adobe Flash.

For the record, I have no particular beef with Flash, other than it offers very little benefit for a huge overhead. Alright I’m biased .. I don’t like it and it has no place on a commercial website. More on my biases later. First, a recap on how I encountered Flash on a mobile and the implications.

Background (skip to Pitfalls of Flash if you’re short of time)

I’m interested in some professional headshot photographs to replace the self portraits I currently employ. I could go to somewhere and get a passport photo but they are often too sterilised for my purpose. So I did what most people do these days - I reached for a browser enabled device and went to Google. [BTW if you know of a photographer in the Croydon Park, NSW area that does something other than wedding photos and baby snaps, I’d love to hear about them.]

First results were not promising. Clearly some of the photographers need a little SEO help. In my searches, TrueLocal held out the most promise, with a few photographers listed for my area.

One of the sites that confronted me was built using Flash. It had a landing page proudly announcing the site was built with flash and that I need “screen resolution of at least 1024x768”. Two of the choices available were “- enter full screen -” and - enter same window -“. The meaning of those descriptors wasn’t immediately apparent. Either way it took in excess of 30 seconds from selecting an option and the Flash script downloading and showing the first image. In the image below, the left half is the landing page and the right half was after 30 seconds.

Was it worth the wait? Not to me. At the default resolution of the screen, I still had to expand the display to be able to read the menu before I could find out the range of services offered. Don’t forget I was on a quest for some headshots. I still don’t know if this photographer offers that service. I was not impressed enough to find out. The only value I extracted from this website was the germ of an idea to blog about.

“Pitfalls of Flash

Here’s my list of issues impacting mobile visitors:

• Flash files are large, which has 2 consequences (1) they are slow to download and (2) consume a lot of the visitors bandwidth. Mobile browser often have limited bandwidth allocation and usually slower download speed. In a fast paced mobile environment, time is interest. Take too long getting your message into the hands (literally) of someone interested in you and you will lose them.
• Flash has no capacity (to my knowledge) to respond to the variations of screen size. Even if the display responds and shrinks the Flash output, the text becomes so small it is next to impossible to read or click, when the text or image is a menu.
• Flash doesn’t respond to the gesture-style interface (pinch and flick) common to mobile devices. This becomes very confusing for the visitor.
• Visitors on mobile devices don’t use websites in the same way as desktop visitors. They don’t want to read the history of the company or necessarily sit through an extended slide show of recent triumphs. They are much more likely to be interested in your phone number and a map of your location. Make these easy to find.

I have other concerns that are not mobile specific. Some of these are covered in the Related Articles below.

Summary

I think you should avoid Flash entirely. I think it is a very poor choice for presentation to your mobile visitors, and we know they are an increasing portion of internet users. Can you afford to alienate even a small section of your potential client base?

Related articles

• Is Flash safe to use in the context of SEO? (midboh.com.au)
• Tag Your Cause (blog.midboh.com.au)
• Size (of the textarea) matters (blog.midboh.com.au)
• Alas this website cannot be viewed on iphones - coz it requires Flash (blog.midboh.com.au)
• Going mobile - one step at a time (part 1: struggles with external files) (blog.midboh.com.au)
• Going mobile - one step at a time (part 2: the trouble with forms) (blog.midboh.com.au)

Last week I was adding a comment to a blog post while using my tablet. The comment section was at the bottom of the page as it is on many blogs. A problem arose when the onscreen keyboard is displayed - it overlays the bottom (or quarter depending on orientation) of the screen, making it impossible to see the text I was entering.

The image on the right shows my dilemma. The top half is before the keywoard is displayed. In the bottom half the comment field is effectively hidden.

Of course there are options as a user in this situation.

• use a notebook or desktop computer to enter the data, or
• connect a Bluetooth keyboard

But these weren’t available to me. It would be some time before I had access to a different device. It’s good to add the comment when the inspiration strikes. So my choice was between giving up on the comment or toggling the onscreen keyboard off and on until finished. I chose the latter. Fortunately I only had a small comment.

What’s the solution for the website developer? The only solution I have at the moment is to make sure your form doesn’t sit hard at the bottom of the display, either by adding some otherwise unnecessary HTML or applying a bottom margin via a mobile only stylesheet.

Related articles

• Going mobile - one step at a time (part 1: struggles with external files) (blog.midboh.com.au)

Anyone following me for a while will know one of my common themes is ensuring your website is ready for the mobile invasion. Just because the majority of your current visitors are still using traditional platforms doesn’t mean that will remain the status quo for very long.

Given that background, I thought it might be good to start exploring some of the practical steps involved to prepare for this revolution.

Today’s topic: reliance on external file formats such as PDF and .doc to incorporate content into your website.

For some time, desktop and notebook browsers have incorporate tools that have enabled these external documents to be presented inside the browser. There may have been some accessibility issues with this approach but for the majority of visitors this integration has been seamless.

Unfortunately, only the very latest of the current crop of mobile browsers support that sort of integration. Those that do probably open a new tab, a method that has it own usability issues on the little screen. For many visitors using a mobile device their only option is to download the file and then display it using a separate app - assuming of course that they have a suitable app available.

“No biggie” may be your first response, but let’s try looking at it in context. Put yourself in the situation of travelling home on public transport and you decide it’s Chinese takeaway for dinner tonight. You’re new to the area so you need to find a restaurant and make a choice. You pull out your trusty Android or iPhone and start searching. You recognise a name of a restaurant recommended to you and visit the website. Oh no! They insist on Flash (as shown in the image). Scrub that one. Let’s try the next one.

This one is not been optimised for mobile but it does load and you can manage to navigate the site. Unfortunately you discover the menu is only available in PDF format. You have no choice but to download the file … waiting, waiting, waiting … finally it’s on your phone. Now you have to leave the browser, find the PDF viewer, navigate to the directory where the downloaded file is stored and open it. You make the final choice and go looking for the phone number. It’s in the PDF file but it’s not clickable.

You can either commit the phone number to your memory (even 8 digits can be a struggle for some of us) or go back to the browser and hope the phone number is clickable.

Phone call made, order given, taste buds tingling … you look up and recognise that you’ve passed your stop. If only the process was a little smoother you might have been on time for dinner. Will you have fond memories of your dealings with this restaurant? The food needs to be spectacular and the service exemplary to offset the struggle so far.

So what could the restaurant do to improve this situation? One simple option is to show the menu in the page (built using HTML) and provide a PDF version for those who would like it.

The recommendation from this first instalment is to re-think the way your visitors might need to interact with your website. Even if you are not yet ready to build a mobile friendly version of your website, you can incorporate some friendlier methods into the current structure, such as not relying on external files to convey critical content.

Related articles

• Do You Need a Mobile Website? (flyteblog.com)

Image via Wikipedia

In my last post, QR Codes and a coincidence, I wrote about the problem I encountered when attempting to use a QR delivered to my letterbox and the coincidence of reading a Chris Brogan post talking about QR codes and the problem of assuming that implementing them is the essence of a Mobile strategy.

A few days later and I was reading another post about QR codes and potential problems arising from a poor implementation strategy. That post was QR Codes and Mobile Phones: 3 Marketing Blunders to Avoid. I think the points raised are valuable enough to bear repeating. These are the 3 “blunders” identified:

• Placing QR Codes in Remote Areas
• Pointing QR Codes to Your Desktop Website
• Crafting QR Codes That Don’t Scan

I’d like to add a fourth blunder

• Placing QR Codes in an Obscure Physical location. If the visitor can’t find it, they are unlikely to utilise it.

I have two broad (and very basic) suggestions for implementing QR codes. These help identify potential blunders before wasting too much time, effort or money:

• Test, test, test
• Think like a potential user

These suggestion apply to almost any new strategy being considered.

Related articles

• Some Basics about QR Codes (babyfruit.typepad.com)
• Are QR Codes Dead? (blogworld.com)
• Mobile Marketing Isn’t a QR Code (chrisbrogan.com)
• QR Codes: From Bus Stops to Art and Tombstones (ponderingtechnology.wordpress.com)
• Using QR codes for mobile augmented reality? (wttfuture.wordpress.com)
• QR Codes -Make yourself a ‘bar (QR) code’! (aktechnation.wordpress.com)
• This probably pushes the QR Code boundary a little further than… (midboh.com.au)
• How have you seen QR codes used? (midboh.com.au)
• First sighting of a QR code in the real world (midboh.com.au)