Skip to content
NEW: Moz AI, Refreshed Interfaces & More API Data. Discover what's new at Moz!
Search engines 5511dd3

How Paging Improves or Worsens Your Website

M

This YouMoz entry was submitted by one of our community members. The author’s views are entirely their own (excluding an unlikely case of hypnosis) and may not reflect the views of Moz.

Table of Contents

M

How Paging Improves or Worsens Your Website

This YouMoz entry was submitted by one of our community members. The author’s views are entirely their own (excluding an unlikely case of hypnosis) and may not reflect the views of Moz.

Having read Duncan's post about Information Architecture,  I thought I would write a short follow-up about an important means of navigation and IA: the paging navigator.

Providing a well thought out paging navigator can immensely increase the value of your website for both search engines and users. What follows is a selection of different popular paging navigators and a short evaluation.

1. Show all links

As far as search engines are concerned, the best way to go is to show all links to pages so that the bot can easily access the content of each page by digging no further than one level. A nice example is deezer.com's artist browser.

Paging navigation on deezer

This approach, however, lacks usability if the paging navigator contains a lot of pages. For example, on a screen with the (still) standard resolution of 1024x768, the paging navigation of the letter 'T' consumes more than 50% of the screen, which would be unacceptable if the page wasn't built specifically for search engines ;-)

2. Show adjacent links only

To avoid the bad user experience mentioned before, a lot of sites show only the current, the first, the last and some adjacent pages. A good example is digg.com's paging navigator.

digg.com paging navigation

That's pretty good if your users tend to read page by page and skip only one or two pages at once. It's bad, however, if your list is ordered alphabetically and contains a huge amount of items. A user is then unable to skip, say, ten pages at once. An example of that don't make me click behaviour is the following. Just image you're looking for "Ashcroft, Richard" - you'll end up clicking at least 7 times, which would be level 8 if you need an extra click from the homepage to the browsing page.

bad paging navigation example

If you have a lot of terms arranged alphabetically, like the deezer.com's artist browser mentioned before, it's best to provide a paging navigator that is based on letters rather than numbers and to provide a sub-navigation. A good example is gemm.com's browser:

gemm.com paging navigation

As far as SEO is concerned, this approach doesn't flatten the website's hierarchy and thus makes it less crawlable.

3. Combine 1 & 2

One of the best paging navigation I've seen in recent months is the one on erweiterungen.de. They combine the two approaches by showing some pages on demand:

erweiterungen.de paging navigation


The best thing about this is that they do this by using javascript only, so a bot sees the following:

Paging - what a bot sees on erweiterungen.de

4. Automatic paging

The geekiest approach to implement a paging navigator is to just load the content as you scroll down, just as dzone.com does it:

dzone.com paging navigation - loading as you scroll

Search engines, of course, just crawl the first items shown. The same applies for the minority of users browsing without javascript. There, an additional pager for non-javascript users would be appropriate.


5. [slightly off-topic] The "show results per page" option

Some websites provide the option to manually select how many results you wish to see on one page. It's already a some kind of standard that you use a dropdown choice for that, just as Google Analytics does it:

analytics results per page

There are other websites that use links or a textfield for that. If you use links you should be aware of the following:


  • Nofollow these links - otherwise, the bot might get confused and index pages you don't want to be indexed (e.g., pages with just one item on it)
  • Make sure your users know what they're about to get by just seeing the link - e.g., use an anchor text like "Show 2 results per page" and not just "2"
  • Also make sure that it doesn't look like a paging navigator. This sounds logical, but ...

... look at the following example, taken from the 'Top Ranked Members' page of SEOmoz, and tell me what you would click in order to get to the second page:

seomoz results per page

I always click on the '2' and always get surprised seeing just Rand and Rebecca instead of the next 100. It's not that I don't like seeing them, I just didn't expect them there ;-)

6. Conclusion

Be careful how you design and implement paging navigators on your websites. Choosing the wrong type can easily result in upsetting your users and search engines. If you find yourself asking "How should I make a pager with that huge amount of pages?", reconsider your information architecture and divide your items into categories and/or tag them and use faceted browsing. And - of course - provide a search box.

Back to Top

With Moz Pro, you have the tools you need to get SEO right — all in one place.

Read Next

The Mozbot Mashup: Roger Explores the World of Generative AI Imagery

The Mozbot Mashup: Roger Explores the World of Generative AI Imagery

Mar 07, 2023
One Secret to Improve SEO in 2021: Guestographics

One Secret to Improve SEO in 2021: Guestographics

Jul 21, 2021
Pop-Ups, Overlays, Modals, Interstitials, and How They Interact with SEO

Pop-Ups, Overlays, Modals, Interstitials, and How They Interact with SEO

Apr 28, 2017

Comments

Please keep your comments TAGFEE by following the community etiquette

Comments are closed. Got a burning question? Head to our Q&A section to start a new conversation.