44 Actionable Checks

Elevate Search Rankings

Improve User Experience

Sell More

Expand Your Audience

Join The Future


Saved Audits

Login or join to save audits.

OK | NOT Check Findings

Essential User Experience

The first many steps in this audit will address basic mobile user experience.

Is Responsive Design Or A Mobile Version Implemented?

One of the following must be in place:

Responsive design is the better choice for most sites. Mobile versions have one big disadvantage. They don't reproduce every page of the site. This is bad for SEO. Only consider a mobile version if you want a fundamentally different experience for mobile users.

Implement one or both of these solutions before proceeding further.

See Google's mobile guidelines.

Does Your Site Look Good On All Devices?

Open Developer Tools in Google Chrome: More Tools > Developer Tools

Select the smartphone icon in the top left corner. Drag the bottom bar all the way down so it's out of your way.

Toggle through a few smartphone devices in the top left corner. Does everything load up alright?

We'll consider more specifics using this view in the steps below.

Do Interstitials & Popups Work On Mobile?

Does your site display pop-ups, lead-generators, etc. that cover site content? Can these be easily dismissed on a mobile device?

If not, you will need to use a new design or plugin that is mobile friendly.

Are Images Responsive?

Are images static, or do they scale when you resize the screen horizontally?

Best practice is scaling to fit. With Bootstrap, you can make images dynamic by adding the CSS class "img-responsive". Or, by assigning "display:block;" and "width:100%;" (or another percentage) to an image's CSS. Containing DIVs/TABLEs, and their CSS, can also cause issues.

See this guide.

Are Videos Responsive?

If there are video embeds, do they scale to fit the window as you resize it?

Best practice is to use HTML5 video over Flash. See this guide.

Here is how to make an embed responsive.

Is All Text Readable On Mobile?

Open Developer Tools in Google Chrome: More Tools > Developer Tools

Select the smartphone icon in the bottom left corner as before.

Is any text too small or distorted to see on small screens?

We will revisit this question in more automated fashion later. Still, nothing replaces a spot-check with human eyes. Make note of any difficult page elements.

Is There Only One Menu Item Per Line?

Scale your developer view to under 480 pixels. Open the navigation menu. Is there more than one item per line? On a smartphone, there should only be one.

Are Drop-Down Menus Unobtrusive?

Does your site use drop-down menus on mobile?

If so, they should be easy to collapse with an "accordion" or "hamburger" button.

Even with such a button, the menu can still become obstructive if it's too big. In this case, the menu should be fully expanded by default in mobile view.

Are All Important Elements Still Present?

Do any menus or elements disappear when the screen shrinks below a certain size? If so, are they important?

Make note of any elements that disappear here. Only your judgement can decide what is crucial and what is not.

Does Your Site Work Without JavaScript?

Disable JavaScript in your browser.

Is the site still usable? If any crucial elements are missing, use noscript. Implement an HTML stand-in.

For dynamic elements that require JavaScript, verify that they work on iOS and Android. The only way to do this is by checking with a phone, or using unit testing software.

Are All Changes In Layout As Intended?

Re-scaling a responsive site can result in unintended layout issues.

Go to Chrome Developer Tools and adjust the screen size as discussed above. Size to 320 pixels wide. Are there any unexpected layout issues?

Correct any unexpected layout issues. Tables and images that do not size any smaller are the most common issue.

Are All Mobile Elements Non-Superfluous?

User experience expectations are different on mobile and desktop devices.

It is not always necessary to reproduce everything from desktop on mobile.

Browse your site for any elements that are distracting or obstructive on a mobile device. There are no hard and fast rules for this. Cut or distill any elements that are not a good fit for mobile.

Can You Complete All Conversions On Mobile?

Use a mobile phone to run a test conversion. Is it possible? Is it effortless? Make note of any points of friction.

Mobile Site Considerations

The next many checks only apply if there is a separate mobile website. If the site is instead made mobile-friendly using responsive design, skip ahead to the next section.

Is The Desktop Version Accessible?

Is there a link that allows the user to visit the desktop version?

Most will prefer a good mobile layout, but some users will want the desktop version. Especially if it features "superfluous" elements they want to access.

This gives users control. It also sends a clear message to Google about device versions.

Can You Reach The Mobile Version From The Desktop Version?

Are there links in the site footer that allow a user to toggle from desktop to the equivalent mobile URL? There should be.

Are Users Automatically Directed Based On Device?

Do visitors begin their experience on the site with the intended version? Does this work no matter what page they land on?

How to redirect visitors to mobile.

Can Users Opt-Out Of Mobile Redirects?

As discussed above, your site should have a link to the desktop version.

Such a link is useless, however, if it is automatically redirected back to mobile.

How to halt redirects based on screen size.

Are Links Consistent Between Mobile & Desktop Versions?

Other than a link to switch versions, all links on page should be to the same version. Cross-linking causes a loss of search engine authority.

Crawl your site with Screaming Frog, starting from the mobile homepage. Verify that the only links between versions are to switch.

The easiest way to do this is by using relative URLs.

There are 24 more steps in this audit.


... to continue.

Ready to get started?