Categories
Online Business

Beginner’s Guide to Making Your Website Mobile-Friendly

Article Contributed by Kate Wilson

Go mobile or go home.

If your website isn’t optimized for mobile traffic, then you’re going to lose market share to competitors who have websites that are mobile-friendly. That’s because people in your market are using their smart phones and tablets to research products and services, go shopping online, and visit their favorite websites.

Just last year, it was reported that two-thirds of Americans own smart phones. More than a third own tablets. That’s a significant market share you’re losing if your website isn’t optimized for those devices.

Here are 9 ways you can be sure your website is mobile-ready.

  1. The Key Word Is “Responsive”

This is the most important point on the list. If you remember nothing else, remember this word: “responsive.”

Why is it so important? Essentially, that word is geek speak for “mobile-ready.” If you’re shopping around for a theme to apply to your WordPress or WooCommerce site, then “responsive” is the word you’re looking for in the description of the theme.

Check out this example or responsive design from Awwwards.com. Because it’s built on a grid format, it’s can be easily resized to fit the dimensions of any screen.

awww

  1. Start from the Beginning

It’s much easier to ensure your website is mobile-friendly when starting from scratch than it is to work backward and force a mobile-unready website to become a mobile-ready. It can be done, but you’ll likely find it’s more expensive and can still yield unforeseen bugs.

However, if you’ve just developed your great business model and you’re starting from scratch, then you can begin by ensuring your website is optimized for mobile usage right out of the gate. If you’re shopping for a theme, remember to look for the word “responsive.” If you’re hiring a professional developer, ensure that he or she understands the website needs to be responsive as well.

  1. Use a B-Site If You Must

If you find yourself in a position in which you simply can’t start from the beginning, then a B-Site is always an option.

What is a B-Site? It’s a separate view of your website designed specifically for a mobile device. You can see an example of one here on the Ring Power CAT website. Note the “Mobile Device” graphic in the lower, right-hand corner. That’s a link that people can use to view the site in a way that is optimized for mobile devices.

cattt

  1. Nothing Beats Testing

If you aren’t sure whether or not your site looks great on a mobile device, then there’s one sure way to find out: Test it.

This part of the process might involve some investment on your part. If you simply don’t have the up-front capital, then ask to borrow the devices of a few friends. You’ll find Apple devices are fairly consistent. However, there are almost infinite variations of Android devices. Testing your site on every piece of Android hardware would be a Herculean feat. Don’t sweat it, just test it on some of the latest phones, phablets, and tablets.

  1. Make Sure the Basics Are Readily Available

It might be the case the people who land on your site are simply looking for your name and phone number. This would be the case if you provide a service to people in your area (e.g., if you’re a plumber or an electrician).

Be certain your contact information is prominently displayed at the top of the page so that users looking for that information can access it easily. Remember, you can also provide a link on your phone number that dials the number. Don’t skip that.

  1. Avoid Image Overload

Images are great because a picture is worth a thousand words. Unfortunately, a big picture or a lot of pictures could also be worth a thousand minutes to someone who is connected with 3G or 4G, instead of with a networked router.

You don’t want to waste people’s time (or money — sometimes data charges will be incurred for heavy throughput) with your website. Just show them the basics and ensure the images you must display are small in size.

Check out the National Society of Collegiate Scholars website. This is another example of responsive design, but what makes it so great is it only features one image in its background. This way it’s still able to utilize visual elements without delaying load time.

socc

  1. Make Sure Clickable Elements Are Big Enough

Remember, everything tends to be smaller on a smartphone. The elements on your website will likely be shrunk down proportionally to fit on the smartphone screen.

However, the elements should still be large enough that a user can easily touch them to navigate around. If the elements are too small, it’s likely people will literally “miss” the clickable portion when touching the screen. Distilled offers a great resource on determining the proper size and proportions for your mobile website.

  1. Limit Input Text

Typing text on a smartphone is often a more complicated affair than typing words on a standard desktop or laptop keyboard. People who can whip out 70 words per minute on the QWERTY keyboard will often struggle to complete just a few words per minute with a mobile device.

For that reason, limit input text to only what is absolutely necessary. You don’t want to discourage potential customers by asking them to enter a great deal of text with their mobile “keyboards.”

  1. Less Is More 

Limit the amount of content on your site. People don’t want to read numerous paragraphs when they have to squint just to read a few words. Only include verbiage that is essential to your marketing campaign.