Design

4 tips for your Mobilegeddon-inspired responsive redesign

by

on

View all posts

As of April 21, Google searches from a mobile device are more likely to turn up relevant results that are also mobile-friendly results. The algorithm update dubbed Mobilegeddon doesn’t affect desktop searches, or even tablets, but it’s still a huge deal.

Has your website survived Mobilegeddon?

Of course, all websites should be mobile-friendly. In a perfect world. But in the real world, there are legacy builds, business requirements, and development timelines to deal with.

For the unprepared, Mobilegeddon’s a nightmare. But for the rest of us, it’s a real opportunity.

Making the most of Mobilegeddon

If your site (and product, for that matter) isn’t mobile-friendly, you’ve got 2 basic options:

  • Mobile retrofit: All some desktop sites need is a new viewport meta tag and a handful of new of CSS rules. While it’s not always that easy, a mobile retrofit can quickly (if only temporarily) make your brand mobile-friendly.
  • Mobile-first build: The more labor-intensive but lasting option is to redesign your site, starting with the mobile experience and working your way up to larger screens. This can be a bit daunting, but with the right data and solid planning, a mobile-friendly build can be closer (and more rewarding) than you might think.

Both approaches offer real benefits, but only your team can decide which is best—and best for right now.

But whichever you choose, you’ll want to do these 4 things.

1. Learn what Google means by “mobile-friendly”

mobilegeddon-friendly

A lot of features signal mobile-friendliness to Google, from viewport meta tags to touch features and device detection. While they won’t share the exact science, you can see what it thinks of your site with their Mobile-Friendly Test tool.

In more good news, Google determines mobile-friendliness on a page-by-page basis. So check your analytics and start your retrofit/redesign with your heaviest-hitting pages. If the bulk of your search traffic hits your index or landing pages, optimize those first.

Since this is an update to their real-time algorithm, altered pages should be re-indexed quickly, in as little as a few days. Once Google decides that your destination page is mobile-friendly, it’ll get the gray “mobile-friendly” callout in search result pages and you should start seeing the reward in ranking that Google has claimed.

Google determines mobile-friendliness on a page-by-page basis. So check your analytics and start your retrofit/redesign with your heaviest-hitting pages.

2. Focus on your users’ experience

mobilegeddon-focus-ux

Of course, getting your content to load on a mobile device isn’t enough. Experience matters, so cramming too much stuff onto a small screen (with potentially limited bandwidth) can cost you.

People hate waiting. Which means that, on mobile devices, every second lost to loading shaves valuable users from your bottom line.

When you’re planning your responsive retrofit or redesign, pay close attention to your assets’ file sizes. Designing with a file-size constraint in mind not only speeds loading, but also shifts focus onto more important things: simplicity, clarity, and conversion.

On mobile devices, every second lost to loading shaves valuable users from your bottom line.

Aside from file size, make sure your site is easy to navigate and its text is easy to read. An uncomfortable or confused user isn’t a repeat user.

3. Understand what people want in a mobile site

mobilegeddon-users-want

Search queries and results vary from mobile to desktop by up to 60 percent. When making a mobile plan of attack, checking your keywords is a great way to see what your mobile users care about (you can view these in both Webmaster Tools and Google Analytics).

While a lot of people preach full feature parity, a quick build focused on “on the go” features can be a great place to start. If you can create a useful mobile experience with only a quarter of your desktop content and functionality, go for it! It’ll be much better than nothing.

Just don’t rest on your laurels. After all, it’s a multi-device world (opens PDF), with the majority of users frequently switching between devices, or using multiple devices simultaneously. And you can use your success with the limited mobile experience to inform a full-featured redesign.

4. Test your mobile experience

mobilegeddon-test

This may sound like a no-brainer, but before you launch your shiny new mobile flow, make sure to test it on a mobile device. While the numbers show that mobile devices are king, most of us still design and prototype in a desktop environment.

Emulators, inspectors, and artboard zoom levels all do a great job of making something feel mobile, but nothing beats actually experiencing mobile. You’d be surprised how often buttons and links turn out to be near-impossible targets on a mobile device. And that’s just one example of how things change across devices.

Of course, you don’t want to invest a ton of time coding up a mobile version of your site, just to find errors like that.

Enter InVision, which lets you easily prototype your mobile flows without a single line of code—and experience them right on your mobile device. Add a team armed with a random sampling of devices and varying experience levels and you’ve got some mighty heavy user testing ready to go.

The early results are in

Since announcing the change in February, Google has already seen a nearly 5 percent increase in mobile-friendly sites. With the change live, and desktop-only sites starting to feel the crunch, that number will only rise.

While no one’s sure how the change will affect desktop-only sites just yet, some are already wondering if Google’s suddenly privileging design over content.

Have you made changes to your product in anticipation of Mobilegeddon? Or are you a “perfect world” type, with a perfectly responsive site already a couple years old? What do you think about Google’s vote for a more mobile-friendly world?

Originally seen on Creative Bloq.

Author

Aaron Stump
Brand Director at InVision.

Join over 3 million designers

Who get our content first.

No sales pitches, no games, and one-click unsubscribe.

Over 3 million designers
get our newsletter
every week

Find out why

Get awesome design content in your inbox every week

Just like over 3 million of your fellow designers do.

Plus get 3 free downloads, just for signing up.

Give it a try—it only takes a click to unsubscribe.

Thanks for signing up!

You should have a thank you gift in your inbox now—and you'll hear from us again soon!

Prototype better experiences with InVision

Just like over 3 million of your fellow designers do.

I agree to InVision's Terms of Service.

Want a free t-shirt?

Join the 3 million+ designers who get our newsletter weekly for your chance to win!

We hate spam as much as you do, and you can unsubscribe anytime.

Double your chances to win!

Tweet and automatically get a second entry

Tweet Now

No Thanks

Stay in touch!

We share news, freebies, and more on Twitter.