Search Engine Optimization All-in-One For Dummies, 4th Edition
Book image
Explore Book Buy On Amazon

As part of your SEO strategy, think of all the things your users see when they visit your website. From words, pictures, and video to your site’s navigation, they see the content of your website.

Now, get in your mobile mindset and think about how your visitors will experience your website content when they are on mobile devices walking the streets of New York.

If you remember only one thing about designing for mobile friendliness, it needs to be this: Mobile-friendly websites need above all else to provide the best user experience possible.

Create single-tap calls to action

To make your content mobile friendly, you want to make it as easy as possible for your user to find what they need and take action. In the mobile environment, in which users are working with small screens and finger taps rather than mouse clicks, prominent click-to-call call-to-action buttons are a great way to help users easily accomplish common tasks. And completing a task means a conversion for you!

Click-to-call buttons are a great mobile-specific call to action because mobile users are often already holding a phone. This button helps users get what they need (a chat with you) and for you to get what you need (a conversion).

Here’s an example of a click-to-call button, placed strategically at the top of the Bruce Clay, Inc., mobile experience.

Click-to-call buttons let mobile users easily take action and get the assistance they need.
Click-to-call buttons let mobile users easily take action and get the assistance they need.

Also consider creating single-tap buttons that help mobile users find your store front or accomplish tasks on the go. You can see an example on the Progressive mobile site, which has buttons to help users find local agents and make payments without having to scroll down the page.

One-click buttons above the fold help mobile users accomplish tasks.
One-click buttons above the fold help mobile users accomplish tasks.

Design for a small screen size

Mobile devices are smaller than desktop computers, so you have less room to fit content on the page and less room for white space. Some small-screen content optimization tricks include:

  • Making your logo serve as a link that redirects back to your mobile home page.

  • Minimizing white space and making sure that the majority of the page is filled with actual content.

  • Building off-screen elements such as a toggle menu, which is a navigation element that can expand and close.

  • Shorten the text that appears on buttons when possible.

Be particular about what goes above the fold

Because mobile devices are smaller than desktop computers, they have less space to present content above the fold (in the space the user sees before scrolling down the page). Make sure to be thoughtful and user-focused when selecting your above-the-fold content. Also, make sure that the content you place above the fold loads quickly. Site speed and above-the-fold load time are important to user experience, and they’re also important mobile ranking factors.

Choose a legible mobile font

Any time you put words on your website, the first priority needs to be user comprehension. Your user needs to be able to clearly see, and quickly read, your words on a variety of devices. Because no one-size-fits-all standard currently exists for mobile screen size or graphic quality, it’s difficult to narrow it down to a one-size-fits-all recommendation for font selection. Here are some rules of thumb to follow about fonts:

  • Whether you go with a Sans Serif or Serif font, consider the height of the characters in your font alphabet and the white space between the letters. Fonts with a moderately high individual character height and a little bit of space between letters can improve readability.

  • Know your demographic and remember that older folks may have a harder time reading smaller, more condensed fonts.

  • Make sure to provide enough contrast between the font and the background so that users can see your content, even outdoors or in other conditions where screen glare is a factor.

  • The safest route is to use a common font that mobile device manufacturers and users approve of, such as Arial, Helvetica, Courier, Georgia, Times New Roman, Trebuchet MS, or Verdana.

Optimize images

To make your website mobile-friendly, it’s important to make sure your images are sized and saved in a way that allows them to load quickly on desktop and mobile devices. Optimized images that load quickly keep both the user and the search engine happy.

To optimize images for mobile, make sure to

  • Save images in a compact file format, such as JPG, GIF, or PNG.

  • Never size images larger than they need to be; remember that big images mean big file sizes, which in turn means slow load times.

  • Optimize the size of images even if you’re using responsive design. With responsive design, you can make sure that images are optimized for mobile by using CSS to write in a max-width clause — {max-width:100%} — which will resize your images based on the size of the detected screen.

Design for multiscreen

To optimize your mobile content for multiscreen use, make sure that the colors, fonts, and themes that you use closely imitate your desktop colors, fonts, and themes. Doing so helps your visitors feel confident that they’ve landed in the right place when they navigate to your website using a new device, and it can also help reinforce branding. Progressive Insurance does a good job of this.

Keep your mobile and desktop designs similar.
Keep your mobile and desktop designs similar.

Avoid using Flash

In general, designing with Flash is unreliable and not recommended for either desktop or mobile design. This includes relying on Flash to play video content. Some mobile devices, such as iPhones, can’t render Flash at all, so any elements of your website that require Flash will render a poor user experience.

Flash is also bad for SEO because Google has been known to bump SERP rank and insert SERP warnings when mobile sites use Flash.

About This Article

This article is from the book:

About the book authors:

Bruce Clay has been a search engine optimization consultant since before there was Google. Today, Bruce Clay, Inc., is a leading search marketing company providing SEO services and consulting, pay-per-click advertising management, content development, and social media marketing services. Learn more at Kristopher B. Jones is the founder and former CEO of digital marketing agency and affiliate network Pepperjam, which he sold to eBay in 2009. He most recently founded three-time SEO agency of the year finalist and DIY Software company

This article can be found in the category: