Optimizing Your Website For Mobile Commerce

The First Step Towards Your New Mobile E-Commerce Platform Is Your Old Website

By Paul Konikowski, CTS-D

The next time you are sitting with your family, friends, or coworkers, and you notice that everyone is playing on their mobile phones or tablets, try this:

Tell them you want to have a little contest and everyone in the room can participate.

Then say “The first person to find [YourCompany] on their mobile device wins [insert small prize]. Ok? 1,2,3,go!”

Now start counting to yourself, or use the second hand on your watch to track roughly how many seconds it takes them to find your website on their devices.  (Note that a wi-fi connection may be a lot faster than in a car or restaurant). Jot down this number, and congratulate the winner.  If no one can find your website, you have a serious problem.  If they instead find your company Facebook or Linkedin, that’s not bad, but we are talking about websites in this particular contest, or paragraph.

‘Your foreshadowing is so deep’ the writer says to himself, sarcastically.

Next, ask them what they think of your website as it reads on their phones or tablets.  Can they even read it?  Are the photos and graphics loading properly on their various devices and browsers?  What happens when they pinch the screen to zoom in, or when they rotate their mobile devices by 90 degrees?  Can they watch videos or audio clips that you have posted to your website?  Can they email tech support if they have a problem?  Can they easily toggle between your company website, Facebook page, Linkedin page or Group, your Youtube channel, and The Twitter?

You will likely find that you family and friends will give you an honest answer, and sometimes a brutally honest opinion of your website.  Don’t argue with them about it, because this is good feedback, and you will want to play this game with them again after you optimize.  Tell them you appreciate their constructive criticisms.

At some point, you should also test your website in at least 3 different browsers on a PC and/or Mac and see if there are differences between the browsers.  Make a list of all the graphics that would not load, bad fonts, and missing links.  Record how long it takes each page to load, especially if there is a difference between browsers. This is your baseline.

Notice that I have not said a word yet about e-commerce.  Why not?  Well to be honest, if you have not yet optimized your website for mobile devices, you are not ready for ecommerce.  If your company is putting out press releases and blog posts that can not be read on any and every iPhone or Android device, then you can not expect to sell many products or services through those same devices, no matter what you do!

So what DO you do to make your website more mobile friendly?  According to this page by Google Developers, there are three different configurations for creating smart-phone optimized websites.  Pass this on to your webmaster:

  • Responsive design: serves the same HTML for one URL and uses CSS media queries to determine how the content is rendered on the client side. This removes the possible glitches of user-agent detection and frees users from redirects. This is Google’s recommended configuration.
  • Dynamic serving: serves different HTML for one URL depending on the user-agent. Use the Vary HTTP header to indicate you’re doing this.
  • Separate mobile site: redirects users to a different URL depending on the user-agent. Use bidirectional link annotations to indicate the relationship between the two URLs for search engines.

If this sounds too complicated for you, let me make it simple. I was able to update this website for mobile devices in under an hour, using a new theme from WordPress.com that was optimized for mobile. Done.

One more interesting note from the Google page I cited:

“We do not consider tablets as mobile devices because, among other reasons, they tend to have larger screens. Most tablet users expect to see tablet- or desktop-optimized pages when browsing the web. This means that, unless you offer tablet-optimized content, users expect to see your desktop site rather than your smartphone site.”

‘But what about phablets?’ The writer asks himself, sarcastically.

I digress.  Happy Memorial Day!  You can go back to playing on your phones now.   -pk

Advertisement

Google+ #AutoAwesome

When Google+ #AutoAwesome Is Not That Awesome

By Paul Konikowski, CTS-D

In the fall of 2013, Google released a new set of features on Google+ called AutoAwesome.  If you want to use AutoAwesome, you need to have uploaded or synchronized digital photos from your phone to your Google Drive. Once you enable AutoAwesome in your profile settings, and your photos meet a certain criteria, Google will essentially create new images by adding special effects to your photos, or will sometimes combine a series of phones into a composite image or an animated gif. But sometimes those AutoAwesome results are not that awesome. Let me show you some examples, starting with a “successful” AutoAwesome image:

Google created this composite photo from three other photos.  In reality, there was only one dog
Google created this composite from 3 separate photos. In reality, there was only 1 dog

The image above was created by Google AutoAwesome after uploading 3 different photos of my white German Shepard, Jack. Notice that Jack’s leash has also been deleted on 2 of the 3 dogs.  Google also created a new “ERASER” image that deleted Jack altogether, except for the leash:

Notice how Google + erased Jack and his shadow but not his leash and its shadow
Notice Google + erased Jack and his shadow, but not his leash, and its shadow

I think its pretty neat that Google can do this to uploaded photos, but many times the autoawesome image is not that awesome. In fact, sometimes the resulting image or gif is downright scary:

Google AutoAwesome turned my dog Jack into Kerberos
AutoAwesome turned my dog Jack into the mythical creature, Kerberos

Take a look at what AutoAwesome did to the Golden Gate Bridge in this image below:

Autoawesome must have detected and deleted straight black lines in this image
Autoawesome detected and deleted straight black lines in the original image

I have seen other images where faces have been accidentally replaced with someone else’s face, or a person’s head was completely deleted! Luckily, the AutoAwesome animated gifs usually turn out better than the Eraser photos:

Google AutoAwesome created this animated gif image from a series of uploaded photos
AutoAwesome created this animated gif image from a series of photos
Google AutoAwesome created this animated gif image from a series of uploaded photos
We were trying to win a gift certificate from Love’s Convenience Stores

In addition to the “Eraser” and “Motion” features, AutoAwesome will also sometimes photobomb your photos, or add special effects like falling snow or floating hearts to photos of romantic couples. Personally, I have very mixed feelings about Google AutoAwesome: part of me thinks Google has pioneered a whole new angle of digital photography, while creating a new tool for social media marketing; and that part of me really does find these new images to be truly awesome.  But a bigger part of me says, Wait a second, how exactly do ‘they’ decide what photos to autoawesome? For instance, how on earth does Google know to add animated hearts to two people kissing?  Seriously, how does Google know that two people are kissing, and not Siamese twins? If it’s just an automated robot (computer program), that would be impressive, but a bit scary. If there is a human deciding which photos to use, then we should be worried about privacy issues; even more scary.  I guess if a person is willing to create a Google+ account, and upload photos, they are giving up their rights to those photos.  As the old saying goes, you can’t swim, without getting wet.

Feel free to share your links to your own Google+ Autoawesome photos in the comments below.