When your website is chock full of important content, it’s vital to figure out the best way to organize your information. A common way to do this is with in-page Tabs. But you may wonder like many other site owners how tabbed content, particularly in-page tabbed content, can influence your user experience (UX), and in turn your conversion rate.

What Are In-Page Tabs?

In 2016 the Nielsen Norman Group wrote the following about tabbed content:

“Tabs have no value in themselves, but they shine (in terms of meeting UX and business goals) when they don’t draw attention to themselves but facilitate access to the content.”

The most important trait of in-page tabs is their ability to keep a user grounded, while still showing them multiple views of content. You need to be conscious of how and where you’re placing your in-page tabs, and how you’re formatting the tabbed content within them. There are quite of few design guidelines to keep in mind while implementing any feature on your website.

You might see in-page tabbed content on a site like Expedia, where there are multiple options for a similar thing. See below:

As you can see, the content here makes sense in tab form. When you click on a new tab you do not leave the page you’re on, you just go to a different facet of the page. Picture your website as a house, and each page of it a new room in the house. In-page tabs shouldn’t make new rooms, but new corners of each room.

How do You Know When to Implement Tabbed Content?

Now that you know what in-page tabs are, you need to figure out whether or not you should utilize them on your site. To decide this, you first need to ask yourself about the content you’re producing. Keep these queries in mind:

• Is the content you’re crafting similar enough to be coherent on the same page?
• Is the content you’re crafting different enough to warrant separating it?
• Does the content you plan to separate need to be compared?
  • If so, putting the information in different areas will make it harder for users to compare, and thus may frustrate them into leaving your site

If you decide that, yes, in-page tabbed content is a great fit, then you should continue reading to learn how best to implement your tabs.

What Are the Design Guidelines to Follow For Tabbed Content?

There are a couple of things that you need to do in order to make your in-page tabs as user friendly possible.

Make sure that each tab is consistent in appearance and title length. For example, if one of the tabs is entitled “Our Mission?” another shouldn’t be “About”. The titles should be parallel in structure. It’s especially important for UX that it’s blatantly clear to the user what tab they’re reading. So, there should be a hover or highlight effect utilized. Take a look at this example:

Here, Ticket Master follows the general rule of thumb  that all tabs function or behave similarly. You’ll see that the “2 for 1 Tickets” tab acts as drop-down when selected. So, users would be thrown for a loop if the next tab functioned differently by opening to the left or right. Consistency is key and so is view-ability.

Here also users don’t have to scroll down to see all of the information in each tab. This is a solid best practice to keep in mind for all in-page tabs. Content should be succinct and shouldn’t force users to scroll in order to take it all in.

Another guideline to keep in mind is the use of title capitalization in your tabs. That would be, “Like This” rather than “LIKE THIS”. The latter of which is tantamount to shouting on the web, and while attention grabbing it may be, it is also slightly less readable.

But there is one thing you don’t want to imitate when it comes to this example. That is the number of words used in each tab. Typically, you want to keep it between one and two words per tab and no more. This makes it easy to quickly digest information and remember it when scanning through everything on the page. Digestible information is far easier to apply to actions (e.g. apply, read, subscribe, etc.) later down the line. There’s more to think about but this is a good start for anyone thinking about applying in-page tabs in their web planning.

Conclusion

The fact is, the validity of tabbed content versus non tabbed content all depends on your website. There are many web pages that benefit from in-page tabs for organization, but there are just as many that don’t. Take the time to look over your content, the tone of your text. Decide what is best for your site. Remember, too, that the most important thing to keep in mind with any design choice is how it’ll affect your users overall experience (UX).

The post Tabbed Content and Its Effect on User Experience appeared first on Health IS Technology Blog.