2012 0307

A common UX mistake in pagination

A common UX mistake in pagination Navigation on the web is common place today. We click on links or buttons, and they take us where the link text said. But are they? Even if the website's developer didn't intend to mislead us, there is a common issue related to pagination.

Blogs often provide "previous" and"next" links. If I'm on the first page, then there is no confusion. There should be a previous link called "previous page" and the other link "next page" should be hidden. Clicking on the "previous page" the "next page" appears and I'll know where the "next page" will take me.

Okay, so let me ask you that if your first visit on a blog wasn't the main page, rather a deeplink with posts listed. At the bottom of the page where will the "previous page" take me?

  • Takes me to the older posts related to the page I'm currently viewing? Logical, because it was before in time.
  • Takes me forward in time? Makes sense, because the present is before the past and right now I'm in the past somewhere.

I've seen blogs operating both ways and it is a little confusing.
The solution is simple, just call your links older posts and newer posts, so any visitor can tell without doubt where will the navigation take them in relation to the page they are viewing right now.

Category: User experience - Tags: ux navigation Read more

Briefing

Me myself and I
I love coding, especially for the web. I'm in the online industry for 6 years. My favourite toys are:
JavaScript, PHP, XHTML, MySQL, Canvas, Flash

My startup

The project's name is CloudDeck and you can read about it here in more detail.

Topics

Friends

Feeling so social

Tags

javascript (14) php (6) mootools (5) codeigniter (4) iscaffold (4) tutorial (3) crud (3) structure-synth (2) template (2) css (2) free (2) renders (2) google (2) experience (1) design, (1) user (1) iscaffold, (1) facebook (1) twitter (1) interface (1) canvas (1) drupal (1) wordpress (1) joomla (1) data-visualisation (1) resizing (1) cms (1) soundcloud (1) beatfader (1) combinator (1) magyar (1) windows8 (1) microsoft (1) clouddeck (1) ux (1) navigation (1) progress (1) transitions (1) reason (1) email (1) music (1) ie8 (1) bugs (1) bermuda-triangle (1) easing (1) clouddeck, (1) rc1 (1) bugfix (1) slimbox (1) tagging (1) cfdg (1) experiment (1) drag-and-drop (1) svg (1) blackout (1) firefox-extension (1) class (1) library (1) sitebuild (1) utf8 (1) nl2br (1) slideshow (1) wikipedia (1) dns (1) open-source (1) infovis (1) table (1) hack (1) script (1) google-buzz (1) forge (1) data-uri (1) inspiration (1) lists (1) ajax (1) konami-codes (1) trick (1) tabs (1) rss (1)