Part 1 of 2: Mobile-Friendly Web Design – What are Your Options
Written by Martin Wong on April 25, 2012
Our previous blog post, Why Marketing to Mobile Users Matters, provided overwhelming evidence that mobile device users of Smartphones and tablets actively rely on those devices as shopping aids: to find the nearest store, to compare products and prices, and to purchase. Could your business use a boost from making it easier for walk-in traffic to find you?
In fact, how mobile-friendly is your business (desktop) website? To find out, see Google’s GoMo site, which shows you what your websites would look like on a mobile device and lets you test the functionality of your website on a mobile device. They also provide a PDF report of the results that includes some good general tips for mobile website design.
The first question to ask: to what extent should my website go mobile?
There are different ways to make your website easier to read on Smartphones and tablets. Your decision depends on:
Your goals for a mobile website: A travel business may want to provide full functionality, including self-service cruise bookings, on a mobile interface. Or, just use the mobile interface as a complement to the desktop website by making it easy for the user to press a button on the Smartphone to connect to a travel agent.
How many mobile users come to your site: Your web analytics can identify the type of browser visitors are using to access your site. In Google Analytics, you can find this information by going to Audience, then selecting the Mobile option. This will show you how many visits came from mobile devices and which kind of device. If a high percentage of visits are from mobile visitors, you may want to make your website more welcoming to small screens.
Which pages did mobile visitors try to access? Even if there number of mobile visitors is low, dig deeper. In Google Analytics you can find out by going to Content and then filtering for Mobile via the Advanced Segments option.
This shows you the pages that mobile visitors accessed. There are other ways of slicing the data to determine how long they spent on each page and the flow of the visit. What information do you think those visitors wanted to see? Your store location? Hours of operation? Product prices? A phone number? Job postings?
Based on a bit of analysis, do you need to revise your mobile website goals?
Back to that first question: to what extent should my website go mobile?
In order of difficulty, your options are:
1. Make sure your website presents and functions correctly on mobile devices.
This is the least amount of work and you won’t be serving up a desktop experience by any stretch of the imagination, but it could be sufficient for your needs. The most basic tweaks are to adjust for font size and viewport size. Nothing fancy, just prevent stuff from breaking on a small screen.
2. Implement Responsive Design
Also known as “adaptive layout”, this approach makes use of the ability of current browsers to query for screen size, orientation, and more. Your website targets a few specific resolutions and device sizes and “adapts” as the browser determines screen specifications. The example we showed in our last blog post of a site belonging to a web-savvy politician uses this approach. Smashing Magazine is also a good example to check out.
This option requires more planning because it’s not just a matter of adjusting for size. You also need to prioritize content and design your adaptive navigation to suit each layout. The good thing is that you are still maintaining only one website for both desktop and mobile. True, it’s a more complicated website but it’s still less costly than your next option.
3. Build a Dedicated Mobile Website
This is a major undertaking that requires research in order to make decisions about strategy, content, and target devices to address, to say nothing of tools and platforms to use for development. A dedicated website will need its own domain and offer a completely different, optimized experience for the mobile user. Performance, navigation, minimal use of input keys – you will need to design for all of these factors. Below is how the IKEA desktop website looks (left) compared to their mobile website (right)
If you do implement a true mobile website, make sure you provide a well-placed link to it in your business website and vice versa. The IKEA main site has a text link on the upper-right to its mobile site (below).
This is hardly noticeable when viewed on a smaller screen (see above left again). An eye-catching button on the main site would help mobile users get to a more satisfying dedicated mobile web experience.
A mobile website can also be adaptive. The New York Times mobile interface is an example of a website that recognizes readers could be perusing headlines on a Smartphone or on an iPad while commuting in to work.
4. Build a Mobile App
All the previous options are browser-based applications where functionality and content reside on the website’s server; the mobile device must connect to the server in order to have any sort of functionality or content. They need to be compatible with the different browsers used by various mobile phones.
A mobile app is software that runs on a mobile device’s operating system and makes use of the specific features of the phone (think buttons and touchscreen, GPS, accelerometer, camera, other apps that ship with the phone). A mobile app lives on the device, so there can be features that are usable offline. Apps for gaming, personalization, calculations, or other functions that need direct access to the device’s resources, are best implemented as a native mobile app.
While a dedicated website needs to maintain compatibility with different browser platforms, a mobile app needs to support each mobile device natively. Each device you decide to target represents a different platform that is potentially a separate project, not to mention ongoing maintenance to ensure compatibility with newer versions of operating system, firmware, and any other resources used by the app.
Finally, remember that before you can sell apps through an app store, you must get approval from the device manufacturer. Manufacturers receive a percentage of every app sold, so there are lots of tools and forums out there to help you ensure compatibility and a smooth approval process.
Part 2 of this series will give you some of the essentials of designing for mobile devices. But as you can see, one of the first decisions you need to make is how mobile-friendly do you need to be? The good news is that with some planning, you can take incremental steps. Start with the first option (tweaking your website to present properly on mobile devices) and move to the second option (responsive design). If your business goals warrant it, take the plunge and move to a dedicated mobile website or a mobile app.
Is it in Your Best Pinterest? Part 1 of 2
Written by Martin Wong on April 23, 2012
It seems you can’t open a magazine or newspaper without seeing an article about Pinterest, so here is our obligatory blog post on the fastest-growing social media phenomenon of the decade so far.
What is it? Pinterest is a social media site that’s a cross between social media and social photo sharing. Users can “pin” images to themed boards they create, which can be based on hobbies, events, lifestyle, and other interests. The social sharing aspect comes in when users browse other users’ boards and ‘re-pin’ images to their own boards or collections, ‘like’ photos, or make comments. Sounds pretty straightforward, so …
What’s making it grow? It’s really easy to use, and it’s useful as a personal organizer. A “pin-it” button for your browser bar lets you “pin” the page to your boards as you browse the Internet. Pinterest automatically includes the source URL to give credit to the owner of the image.This is the digital equivalent of ripping out pictures from magazines or catalogues; later, you can click on the pinned item to get back to the product page you liked. Yes, it’s a big, visual bookmarking system. But the other reason it’s addictive is that you can check out what others are pinning on their boards. If you are looking for high end stereo headphones, someone else will have pinned their choices on Pinterest and you can re-pin their item to your own board.
Why is it a viable ecommerce site? Pinterest launched in December 2009. By December 2011, the site made it into the top 10 largest social network services with 11 million total visits per week. In January 2012, it drove more referral traffic to retailers than LinkedIn, YouTube, and Google+. Facebook hasn’t really taken off as a business site. It’s designed for social interactions and its users tend to share activities and news.
Pinterest users on the other hand, share stuff. Stuff they have bought, used, liked, want to buy, or are researching actively before they buy. The images on Pinterest are sourced from websites, so interested users who click to find out more about the dress, the sofa, the garden tool, the hotel, or the book end up on the website that promotes the item or service. Note: the demographics for Pinterest in the US is strongly female, around 83%. In the UK, males dominate at 56%.
How Pinterest is changing the web
Smart retailers are pinning. Smart retailers are creating a presence on Pinterest for themselves. West Elm, the home décor store has pinboards arranged by theme. The store features not only their own products but also other finds, to position the company as tastemakers; to date, they have 24,400 followers on Pinterest. Better Homes and Gardens and other magazines can really leverage Pinterest’s format to curate articles in helpful ways. BHG has nearly 48,000 Pinterest followers — and don’t forget the SEO value of links from all those user re-pins.
Web design. Website designers are jumping on the bandwagon to imitate Pinterest’s grid of images. Sometimes visuals are just more easy to digest than text. With some planning and categories, this can be a useful new way to present consumer products, as shown by Easy Living Magazine.
Contests. Pinterest offers high-engagement contest opportunities and companies are running contests for “best pinboard”. One example is Homes.com, who sponsored a Pinterest contest that encouraged users to create pinboards featuring their favourite homes from the Home.com site.
Next week: As with any social media site, there are rules and etiquette. Is it in Your Best Pinterest: Part 2 of 2 discusses How to Be(have) on Pinterest.
Why Marketing to Mobile Users Matters
Written by Martin Wong on April 16, 2012
The Raw Stats on Mobile
- It took more than one year to sell one million iPods. It took only 28 days to sell one million iPads.
- By 2015, the worldwide shipment numbers for tablets is estimated at 326.3 million units.
- Three days after its launch on October 14, 2011 Apple sold over four million of its new iPhone 4S.
- In 2012 Smartphones will out sell desktop and laptop computers combined, worldwide.
- More than 50% of US residents will own a Smartphone (of any brand) by the end of 2012, and by 2015 more than 158 million smartphones will be in use.
These statistics represent a seismic shift in how a significant segment of the population chooses to consume information. Users want and expect connectivity right now, on demand, and painlessly. For those of you who figured netbooks were just a transitional technology, you are right. iPads are doing a better job of meeting the need for mobile, full-screen mobile Internet access that supports business apps. But those are the raw shipment numbers. The real question is: how do mobile users behave when it comes to browsing and buying?
In-Store Shopping Habits of Smartphone Users
Google has released the results of a survey that studies: the types of information consumers search for on mobile; how they use smartphones to find local information; and how smartphones influence in-store shopping process and behavior. The survey presented results from the USA, UK, France, Germany, Spain, and Japan; results from other countries will be released later.
The US findings show that of the Smartphone users who have searched online for information about local businesses or services:
- 51% have also called the business or service
- 49% have also looked up the business on a map
- 48% visited the business premises while 49% visited the business’ website
- 25% have acted on that information by making in-store purchases.
- 21% have acted on that information by making a purchase from the business online.
- Overall, 92% of users seek local information and 89% take action after looking up local content.
Furthermore, Smartphone shoppers are frequent shoppers. More than 3 out of 5 Smartphone shoppers purchase using their device at least once a month, while, 14% purchase weekly and 20% daily. This behavior is not exclusive to the US. In all of the six countries featured in the report, the majority of smartphone shoppers purchase on their device at least once a month.
Other findings show that users intentionally bring their Smartphones while shopping to compare prices and research more about products, and about one-third changed their minds in-store or while on-line based on information they found through their Smartphone.
Online Shopping Habits of Tablet Users
What about tablet users? Adobe Digital Index recently conducted a study of online buying habits of tablet users. Based on an analysis of over 16.2 billion online transactions of more than 150 U.S. retailers, 85% of which are included in the Internet Retail 500 Index, the report found that while traditional users (desktop, laptop) still have the highest conversion rate on retail sites (2.5%), tablet users run a close second (2.3%), three times more than Smartphone users ( 0.6%).
Plus, although tablet users convert at a slightly lower rate than traditional users, they spend over 20% more than traditional users and over 50% more per purchase than Smartphone users.
This higher average spend is due to the demographics of tablet users, who tend to be male and more affluent than the average online shopper. First, Tablet Visitors are more affluent than other online shoppers and tend to be males. The study also suggests that tablet users shop under more enjoyable, less stressful circumstances: at home and on weekends.
What This Means for Digital Marketing
The mobile market needs to be segmented into tablet and Smartphone shoppers. Smartphones are more portable than tablets, so users are more likely to visit a brick-and-mortar retail store after visiting a website and respond to in-store promotional offers. Tablet users, on the other hand, are like traditional users when shopping online but with higher disposable incomes. Online retailers need to deliver the most engaging customer experience possible to tablet users and leverage the features of the tablet for a seamless and positive site visit.
Make sure your website is mobile-friendly. Just because a Smartphone can access your site doesn’t mean you’re providing an experience that’s optimized for the small screen. To see a great example of what that means, take a look at this site belonging to a web-savvy politician. Drag your browser screen to resize it, make it narrower and see what happens: everything on the page, including the navigation, shifts so that you retain full functionality, but in a presentation that’s easy to view and use on smaller screens. Notice also that text gets larger and so do the buttons, which make the site friendly for small touchscreens.
Get listed in location-based social media sites. Mobile users go to different mobile-oriented social media services for recommendations and shopping advice, especially to find local stores and services. Make sure your store is easy to find, not just on Google Places but also sites such as Foursquare, Where, and Yelp.
Be data-sensitive. Mobile users are on data plans. Make interactions fast and direct. Use short URLs to minimize typing. Better yet, use QR codes to take Smartphone users directly to the specific product page or call to action. Make your designs lightweight, keep text brief, and be careful about image sizes. Avoid using Flash or large images on pages meant for mobile devices. Better yet again, offer Wi-Fi access in your stores.
