The Web’s Arrow of Time
I was looking into adding some navigation links to my post feed/archive pages, when I ran into an old confusion of mine. The Web has a completely messed up arrow of time!
We primarily view the Web, or any other reading medium like books, in two dimensions. To represent time, we squish it into these two dimensions, by picking a dimension (or frequently both dimensions) to represent time in a certain way. But time has a natural direction of flow; from the past to the future. So we must not only pick a dimension to squish time into, but also pick a direction to represent this intrinsic arrow of time.
Time in Reading
The direction of reading is a good example of representing this arrow. In English, we read from left-to-right and from top-to-bottom. Words read in the past lie to the left/top, words to be read in the future lie to the right/bottom. This direction changes between languages but each written language seems to have a consistent set of rules to indicate this direction. The direction of reading is the same as the direction of time.
If you were reading a scroll that would be the end of this story. But books, with their pages and chapters, present another problem. What is the “correct” way to order the pages and chapters?
The solution, which seems obvious in hindsight, is to maintain the direction of time between pages and chapters. So, past pages/chapters are to the left, while future pages/chapters are to the right. Incredibly, this consistency is also maintained when books decide to switch the dimension that represents time. Inside a book, Chapter 1. is to the left of Chapter 2., and so in the table of contents Chapter 1. is listed above Chapter 2. Among the pages past-future is mapped to left-right and, in the table of contents past-future is mapped to top-bottom. So books maintain the mapping between reading order and direction of time everywhere; very neat and consistent. Matthew Butterick’s Practical Typography a web-book also maintains this directionality while navigating between chapters.
Time on the Web
On the Web, the reading order on a page is the same as the pages of a book. Read a post from left-to-right and top-to-bottom. Even the comments on a post page are ordered so that time flows top-to-bottom; older comments on top, newer on the bottom. So how do we represent the next or previous post to be read? How about we maintain the direction of reading between posts; previous/older post to the left and next/newer post to the right. This at least is the recommendation by
Tantek
.
Tantek Çelik
Quite a few sites which have such navigation on their post pages follow this rule.
Tantek
and
Aaron
use the “older to left” pattern.But some don’t.
So far so good… Enter feed/stream/archive pages; the monkey-wrench in the works. Feed pages are lists of posts on a site, usually in reverse-chronological order. Why reverse-chronology? Because “newer is better”. Or better said, people who visit our site most likely want to read the newest thing we have posted, not something from 2006. So we happily order our posts from newest on top to older towards the bottom. Good job! We have now reversed the arrow of time relative to the reading order on our feed pages. We also want to paginate our feed/archive pages instead of showing everything on one page. OK done!
Now to add navigation links to the previous/next page in our archive. Oops! Should the right arrow link to the page with the “next” posts in the reading order of the current page (i.e. to the past) or to the “next” page in terms of time (i.e. to the future)? Does reading order between feed pages move from left-to-right or does time flow from left-to-right?
Aaron
uses the “older to left” pattern on feed pages while
A very useful thing that both
Aaron
and
Ben
do is to use the explicit words “Older” and “Newer” to describe the navigation links instead of just arrows. I think having these words clarifies the navigation a lot compared to the ambiguous direction of arrows.
Prev/Next
HTML even provides rel=prev and rel=next so that the navigation to previous/next post pages can be marked-up suitably. But which link is the rel=prev and which one is rel=next? Is rel=next the next thing to read or the next thing I posted?
According to both the W3C Recommended HTML5 and the WHATWG HTML Living Standard, rel=next indicates that the current document is a part of a series, and that the next document in the series is the referenced document.
. Pretty ambiguous about the direction of time.
Most sites use rel=prev to indicate post in the past and rel=next to indicate post in the future which makes some sense. But at least in the Youtube playlist interface the “next” button plays the video posted in the past!
With all this confusion, I have decided, at least for now, to keep the reverse-chronological order of my feed and use the “older to right” pattern while navigating between feed pages with the explicit words “older” and “newer” to help the ambiguous arrow icons. We’ll see how that works out.
Replies
James Gallagher
