Multiple Page Navigation: What do you like most?

Not for 'how-to' coding questions but PHP theory instead, this forum is here for those of us who wish to learn about design aspects of programming with PHP.

Moderator: General Moderators

alex.barylski
DevNet Evangelist
Posts: 6267
Joined: Tue Dec 21, 2004 5:00 pm
Location: Winnipeg

Re: Multiple Page Navigation: What do you like most?

Post by alex.barylski »

Fare enough you know about what you need or want better than I do. :)

Also consider though, that when you build software, you are trying to make it useful to your users, not you, which is why following a standard pager is proabbly best.

I think the main reason most implement a pager as a series of clickable links is that it saves you trouble, navigating to a new page is only a single click, not two clicks which is the case when you use a drop down.

Paging is a very common action so having to select the page I wanted from a list each time I wanted to progress would be annoying, personally speaking anyways. Again it totally depends on who you are targetting, if it's just for you then giver' 8)

Cheers,
Alex
User avatar
JAB Creations
DevNet Resident
Posts: 2341
Joined: Thu Jan 13, 2005 6:44 pm
Location: Sarasota Florida
Contact:

Re: Multiple Page Navigation: What do you like most?

Post by JAB Creations »

Who's doing two clicks for a select menu? Not I! :wink:
alex.barylski
DevNet Evangelist
Posts: 6267
Joined: Tue Dec 21, 2004 5:00 pm
Location: Winnipeg

Re: Multiple Page Navigation: What do you like most?

Post by alex.barylski »

Don't you have to first click on the select box, then click on an item?

Compare that to just clicking a link to jump to a page?
User avatar
JAB Creations
DevNet Resident
Posts: 2341
Joined: Thu Jan 13, 2005 6:44 pm
Location: Sarasota Florida
Contact:

Re: Multiple Page Navigation: What do you like most?

Post by JAB Creations »

Click, drag, release. Technically one action...same thing a lot of people do on their icons explaining why they have three hundred copies of "Shortcut to Internet Explorer". :mrgreen:

Seriously, I expected you to get it the first time though. :|
User avatar
Eran
DevNet Master
Posts: 3549
Joined: Fri Jan 18, 2008 12:36 am
Location: Israel, ME

Re: Multiple Page Navigation: What do you like most?

Post by Eran »

PCSpectra wrote:Don't you have to first click on the select box, then click on an item?

Compare that to just clicking a link to jump to a page?
Spectra is quite right that a dropdown requires more user interaction than a link. Also, when eschewing well established web UI conventions you usually need to have a good reason - meaning your solution has to be more than just a little better (which is debatable) but a significant improvement, which in my opinion it is not. Link-based pagination doesn't have to be tiny, hard to click numbers - this is where a good UI designer can do wonders.
User avatar
VladSun
DevNet Master
Posts: 4313
Joined: Wed Jun 27, 2007 9:44 am
Location: Sofia, Bulgaria

Re: Multiple Page Navigation: What do you like most?

Post by VladSun »

allspiritseve wrote:I would NEVER browse through 7000 pages of results. I'd browse through maybe the first 10, 20, if I was really that determined. If I didn't find what I wanted, I'd either leave or narrow down my search.
There are cases you can't narrow it more ...
allspiritseve wrote:If the page number is meaningless, then the user isn't going to know what page number they want, and hence won't use any links you listed except for the ones that are single digits away from the page they are on. The rest of the links are pointless.
Do you know how "binary search" works? My pagination gives that power to the user with simple clicks.

And about Google - it's a fuzzy logic there, so it's not comparable to most of the cases pagination is used.

@Jab - I should agree with others - your pagination is not standard (so it's more difficult for the user to use it), requires clicks and *scrolls* and it doesn't have advantages over the traditional one.
There are 10 types of people in this world, those who understand binary and those who don't
User avatar
allspiritseve
DevNet Resident
Posts: 1174
Joined: Thu Mar 06, 2008 8:23 am
Location: Ann Arbor, MI (USA)

Re: Multiple Page Navigation: What do you like most?

Post by allspiritseve »

JAB Creations wrote:For me I always disliked having to click on tiny single digit numbers.
pytrin wrote:ink-based pagination doesn't have to be tiny, hard to click numbers - this is where a good UI designer can do wonders.
@JAB, going off of what Pytrin said, here's a suggestion: style the links so there is a larger clickable box, maybe 30 pixels wide, with the number in the middle. Give a little margin between each box. That should be easily clickable, and you won't have to resort to non-standard pagination.

(Though does that work in IE? I have a vague memory from my front-end days of links only clickable where there's text in IE, even if the link is styled as a larger box... maybe somebody on here knows more definitively than I do...)
User avatar
JAB Creations
DevNet Resident
Posts: 2341
Joined: Thu Jan 13, 2005 6:44 pm
Location: Sarasota Florida
Contact:

Re: Multiple Page Navigation: What do you like most?

Post by JAB Creations »

I'll do it though it'll be an opt-in option on my site. I plan on having various GUI options and this seems like a good example.

I'm not really sure how to approach the code...mostly apprehensive because I ended up sleeping this afternoon for three or four hours though I just yawned so maybe I'll take a crack at it in the morning.

I'll end up creating another function and since I haven't implemented much on the back end except for the base features I'm working on will probably do a class switcher to hide/show the two layers for page navigation.

As far as styling is concerned I already know exactly what I'm going to do. :wink:
User avatar
VirtuosiMedia
Forum Contributor
Posts: 133
Joined: Thu Jun 12, 2008 6:16 pm

Re: Multiple Page Navigation: What do you like most?

Post by VirtuosiMedia »

allspiritseve wrote:@JAB, going off of what Pytrin said, here's a suggestion: style the links so there is a larger clickable box, maybe 30 pixels wide, with the number in the middle. Give a little margin between each box. That should be easily clickable, and you won't have to resort to non-standard pagination.

(Though does that work in IE? I have a vague memory from my front-end days of links only clickable where there's text in IE, even if the link is styled as a larger box... maybe somebody on here knows more definitively than I do...)

A quick and dirty example that works in IE6, IE7, FF, Chrome, Opera, and Safari:

Code: Select all

 
<style type="text/css">
    #pagination {margin:0px; padding:0px; list-style:none;}
    #pagination li {margin:5px; float:left;}
    .pText, .pLink {padding:5px; border:#0066FF solid 1px; color:#0066FF; display:block; text-decoration:none;}
    .pLink:hover, .current {background:#0066FF; color:#FFFFFF; display:block;}
</style>
 
<ul id="pagination">
    <li><a class="pLink" href="">First</a></li>
    <li><a class="pLink" href="">Previous</a></li>  
    <li><span class="pText">...</span></li>
    <li><a class="pLink" href="">7</a></li>
    <li><a class="pLink" href="">8</a></li> 
    <li><span class="pText current">9</span></li>
    <li><a class="pLink" href="">10</a></li>
    <li><a class="pLink" href="">11</a></li>
    <li><span class="pText">...</span></li>
    <li><a class="pLink" href="">Next</a></li>
    <li><a class="pLink" href="">Last</a></li>                              
</ul>
 
User avatar
JAB Creations
DevNet Resident
Posts: 2341
Joined: Thu Jan 13, 2005 6:44 pm
Location: Sarasota Florida
Contact:

Re: Multiple Page Navigation: What do you like most?

Post by JAB Creations »

Like I said before I got the styling down.

I ended up sleeping like 16 hours or something insane like that so I'm going to work on this now and post a reply in a couple hours or so. Looks like I'll be working with math operators a bit.
User avatar
JAB Creations
DevNet Resident
Posts: 2341
Joined: Thu Jan 13, 2005 6:44 pm
Location: Sarasota Florida
Contact:

Re: Multiple Page Navigation: What do you like most?

Post by JAB Creations »

I've spent the past few hours mostly working on the pagination2 function. Until I implement user preferences later on in time I'll leave it appearing at the top of the page (it will not be available at the bottom until I implement the preferences).

The math wasn't difficult though some of the logic associated with it required some moderately difficult logic though hardly anything I can't figure out with extra time. The major issue I wanted to avoid was physically moving buttons. By that I mean the previous page anchor (which unless you're on page 1 or page 2 will display 'Page '.$number) in example would push the current page and following page anchors towards the right. So essentially regardless of the current page I wanted the current page span (no need to anchor a page to itself) to always have the same position. The styling wasn't difficult nor was the general concept...again the logic wasn't necessarily easy though it did take some troubleshooting all of which I am more then capable of doing on my own.

Thoughts are welcomed. :P
Last edited by JAB Creations on Thu Apr 15, 2010 5:14 pm, edited 1 time in total.
User avatar
JAB Creations
DevNet Resident
Posts: 2341
Joined: Thu Jan 13, 2005 6:44 pm
Location: Sarasota Florida
Contact:

Re: Multiple Page Navigation: What do you like most?

Post by JAB Creations »

Is the overwhelming silence is err...underwhelming. :| Thoughts please?
User avatar
Eran
DevNet Master
Posts: 3549
Joined: Fri Jan 18, 2008 12:36 am
Location: Israel, ME

Re: Multiple Page Navigation: What do you like most?

Post by Eran »

Usability wise it's a major improvement in my opinion. The styling isn't really my cup of tea though.
Also, why not keep the current page as a link?
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: Multiple Page Navigation: What do you like most?

Post by josh »

The page numbers are kinda huge and in a prominent place. I like the phpBB style pagination better but it seems to work nicely. If I pass in a negative it breaks though
User avatar
JAB Creations
DevNet Resident
Posts: 2341
Joined: Thu Jan 13, 2005 6:44 pm
Location: Sarasota Florida
Contact:

Re: Multiple Page Navigation: What do you like most?

Post by JAB Creations »

@pytrin Fair enough, and the styling is very customizable on the live version of my site. I'll be implementing a long term theme solution for Version 2.9 of my site any way. Can't make everyone happy but sometimes you can give people the tools to do it themselves. :mrgreen:

@jshpro2 Good catch! It took some a little time though the code was easy to implement. Try non-integers, negative integers, and integers greater then the total number of pages. Additionally I added an extra parameter for the pagination functions to pass "top" or "bottom" so currently only one call to a pagination function calls with the second parameter set to "top" meaning the error message will only appear once.

Examples...
blog.php?p=11 (valid)
blog.php?p=12 (invalid)
blog.php?p=-12 (invalid)
blog.php?p=d (pretty dam invalid)

:mrgreen:
Last edited by JAB Creations on Mon Jul 04, 2011 10:16 am, edited 1 time in total.
Post Reply