Now that Google is prioritizing the mobile version of websites for indexing, meaning your Google search results rankings will be a reflection of your site’s mobile experience, you need to make your content just as accessible on devices as it is on desktop.

Content on mobile needs to be designed and presented in a way that gives users the key points of the page, without cutting out any content (some users will want to dig deeper and read every word). While quality content will always be king, the structure of your content is now more important than ever. Every page needs to be skimmable and digestable with second-nature navigation.

Here’s how you can structure your site for a better experience on mobile, which will translate to better rankings on Google search results pages.

Add a Table of Contents

Table of contents continue to feature on popular websites, as this classic method of content structuring is simple and organized. In combination with HTML bookmarks, users can leap from section to section of interest without moving so much as their thumb.

We’ll use this page as an example – here’s how HTML bookmarks can combine with a table of contents for quick and easy navigation:

• Add a Table of Contents
• Break Up Copy with HTML Headings
• Expandable Content and Tabs
• The TL;DR

Break Up Copy with HTML Headings

HTML headings or tags are the best way to section off long pieces of content. You’d structure your page logically and chronologically with Heading 1 at the top – usually your page title – followed by Heading 2 (or subheadings), then H3’s, H4’s, etc.

This page is structured in this fashion, with the H1 as the blog title, followed by H2’s for subsections like this one. Heading tags makes content more digestible, infinitely more skimmable, and are prime targets for anchor links in your table of contents.

As an added bonus, Google loves seeing headings used for structure – even if you’re using multiple H1s! – meaning it’ll boost your SEO, too.

Expandable Content and Tabs

Expandable content spots, or ‘accordions’, can be used for highly-detailed sections or text-heavy areas like an FAQ. Accordions are an excellent way to keep pages tighter, shorter, and easier to navigate without skimping out on valuable content. And if you’re worried that ‘hidden’ content may not be picked up by Google algorithms, rest assured it’ll be given full weight in the mobile-first index.

See how Lowe’s delivers an abundance of content in a neat little package; even with the description, reviews, specs, Q&A, and more, it isn’t overwhelming to the user.

Tabs are another space-saving alternative to expandable content, but are being used less and less due to space restrictions. But still, it’s a better method of content organization than a long and winding page.

The TL;DR

Reddit has brought us a new way to aggregate popular news, the best memes on the web, and TL;DR.

Too long; didn’t read is being featured in more and more content pieces, summarizing long articles into bite-sized bullets of key information. This helps users decide if the content answers the questions they’re looking for and if they want to read the passage in-depth.

See how Business Insider condenses a full-length piece into three essential takeaways:

Final Touches of Style

Finally, you’ll want to vary up and break up your content as much as possible, and in places it makes sense. Use these styling tricks to highlight crucial sections in your content:

• Incorporate bullet points and lists to convey large amounts of information faster
• Use bold text to catch a reader’s eye, and italics to emphasize crucial takeaways
• Pull quotes, block quotes, and embedded tweets stand out on a page – especially if they’re used for statistics – so use them regularly

If your website wasn’t designed with mobile-first in mind, get in touch with Eden’s web development team for a site audit on how you can improve your users’ website experience on mobile.