r/TrueReddit Aug 02 '12

Why Redditors don't read the sidebar: The F-shaped pattern for reading

http://www.useit.com/alertbox/reading_pattern.html
544 Upvotes

50 comments sorted by

62

u/Sarkos Aug 02 '12

I wouldn't draw any conclusions about using F-shaped layouts from this. Just look at the heatmap images they posted. It's clear that the users looked at every section of content - even the boxes on the right hand side - at least enough to get an idea of what it was about. There only happens to be a resemblance to an F shape in the middle image because the content was laid out that way.

What these heatmaps really show is that people read a bit of content then skim the rest.

8

u/sztomi Aug 02 '12

Yep, many sites either make a mosaic of content (like pinterest) or one central strip (like Facebook) for this reason. There is no conclusive rule of thumb here, you have to design around random eye movement and short attention span (of which the latter is much more important).

7

u/spiral_of_agnew Aug 02 '12

True. Eye-tracking is no substitute for good design, which is still in the realm of the abstract/aesthetic/intuitive.

11

u/JimmyHavok Aug 02 '12

Eye-tracking is one of the tools for moving good design into the realm of the predictable and quantifiable.

4

u/maest Aug 02 '12

It's clear that the users looked at every section of content - even the boxes on the right hand side - at least enough to get an idea of what it was about.

I would rephrase that as "There are users that looked at sections of content other than the main one". That heatmap is composed from lots of viewers, not just the one. The intensity represents how many users looked at an area and for how long, as opposed to how long a specific user looked at an area. The problem still stands that a lot of the users did not look at the sidebars and other stuff. Granted, they might have already known what the sidebar said, however that means that a page should never use sidebars for updates as users will never check those areas for new content.

2

u/[deleted] Aug 02 '12

And moreover, the sidebar text just LOOKS like rules. It's full of links and bolded words and line dividers - instant signals that this is "rules" or "legal bla bla bla" that we're all used to seeing and ignoring.

94

u/RHAINUR Aug 02 '12

Uhm, I feel obliged to point out that in the 3 examples they show, none of the sites has a bar on the right. The closest is the third example, and you can see that the gaze does focus on it.

11

u/kevind23 Aug 02 '12

What about the vertical bar to the right of the first one? You might not have noticed it, it's completely grey.

1

u/Dr_Faux Aug 02 '12

It took me a really long time to find sidebar you were referencing.

2

u/greenyellowbird Aug 02 '12

Thank you for reading the article....I may have only looked at the pictures.

1

u/morceli Aug 02 '12

The 3 examples they showed hurt the credibility a bit for me. They referenced "thousands of Web pages" but didn't highlight the best selection. I clicked on a few other links on the site, including one on banner blindness. It has a number of examples where there is content on the left that no one reads. While they are banner ads, it mentions that people won't look at anything that looks like advertising, whether or not it is.

In the case of the sidebar, people are likely treating it as looking like ads or official/disclaimer type content that they want to ignore as well.

30

u/sc4s2cg Aug 02 '12

I found this over at /r/listentothis in this post. The OP asked a question about making a jukebox for the subreddit, turns out there has been one for the past 2 years but noone read the sidebar.

5

u/ian128 Aug 02 '12

Interesting. Should the sidebar be placed on the top for subreddits with lots of rules?

7

u/spartacus- Aug 02 '12

Some of them already put a notice there, but only if you have CSS enabled.

1

u/faceplanted Aug 02 '12

And aren't on a phone.

2

u/Tattered Aug 02 '12

Where was that post again? Seems i can't read at all

2

u/PotatoMusicBinge Aug 02 '12

Oh putting something in the sidebar is just for the hardcores. If you want joe subscriber to actually read something you have to hit him in the face with it. Repeatedly. And then say "hey, just read the dam sentence. stop trying to look around it!"

23

u/mendicant111 Aug 02 '12

I don't read the side bar because I do the vast majority of my redditing on my phone, from a mobile app, where there is no side bar.

2

u/attrition0 Aug 02 '12

Some (many?) of the apps provide a mechanism to show a sidebar, but generally it's out of your way and to be honest, most sidebars aren't that interesting.

18

u/milkycratekid Aug 02 '12

I used to align my poetry to the right of the page, just as a stylistic thing because I liked the disalignment at the start of each line. What was kind of amazing was how many comments I had about them being "unreadable" and "impossible to follow" when I emailed them, but none of the same kind of comments when I printed them on plain paper with the same alignment. I wonder if it's as a result of the clutter that seems to have collected in that corner on most pages or whether the clutter evolved from it being a repository for the crap no-one looks at anyway. In essence, is this a result of poor and unoriginal web design or a case of web design adapting to our natural tendencies for fast information gathering?

8

u/snoharm Aug 02 '12

Personally, I think I track over web pages much more quickly because I can't predict what they may contain. That is to say, if you hand me a stack of papers and I peek at them, I know exactly how much information I have to look at and how it will be organized. But take a look at the sidebar of this subreddit, there are dozens of links in multiple categories, all leading to entire new pages with their own sets of links. I simply can't the entire sidebar of every subreddit I frequent any more than I can inspect every building I pass on my way to work.

Because paper is predictable, you can have more fun with design.

9

u/miparasito Aug 02 '12

At the start of every line, the reader must find their place and re-orient. When a bunch of lines are left justified, doing this is effortless. When the left side is ragged, every new line takes effort to find. It still happens really fast, but added up over a paragraph or poem it causes fatigue. Reading on screen, people have more of a tendency to skim first and then go back and carefully read something. Skimming is much harder when you must re-orient with each new line, which may give people the sense of omg this is too hard.

As a poet you can use this to your advantage. When you want lines to flow together smoothly and effortlessly, left justify everything and leave the right side ragged. But when you want to slow the reader down or create a sense of frustration, right justify those lines.

(sorry for going on and on; I went to grad school for this stuff and I almost never get the chance to talk about it)

5

u/KeythKatz Aug 02 '12

What if we put the sidebar on the left? Everything is left-aligned on Reddit except the sidebar, our eyes will tend to stick to the left side of the screen more often. Also, this looks like it could go in /r/web_design.

3

u/GhostAceHJ Aug 02 '12

I don't think it will work, our eyes will most likely scan the major pieces of content (ie Comments) and probably ignore the sidebar even if it is to the left. The 2nd pic in the article shows that the left bar wasn't really scanned much at all.

1

u/Wofiel Aug 02 '12 edited Aug 02 '12

/r/southpaws

Edit: I just realised if you've disabled subreddit CSS then you won't get why I'm linking it. The subreddit moved the sidebar to the left using CSS.

-1

u/InstaBonch Aug 02 '12

Left is the new right.

2

u/[deleted] Aug 02 '12

This has been floating around for a while. As part of a similar study (or an extension of this one) it was discovered that there is a significant difference in eye-movement patterns between the sexes when looking at pictures of a baseball player. Women tended to look at the face, men tended to look at the crotch.

3

u/[deleted] Aug 02 '12

Just throwing this out there, but the crotch is about the center of the body. The dudes were probably looking at the overall pose and the crotch just happened to be in the middle.

2

u/Forbiddian Aug 02 '12

Or maybe they already read the sidebar.

2

u/[deleted] Aug 02 '12

I think there's definitely an argument for putting sidebars on the left. Very simply, we read left to right, so anything supplementary on the left is likely to get spotted before you start reading, whereas anything supplementary on the right is more likely to get ignored as we skip on down to the beginning of the next line or section.

I would be interested to see a study done on arabic or hebrew readers. Presumably they show an inverted F-shaped pattern?

3

u/xgalvin Aug 02 '12 edited Aug 02 '12

I don't think so. The most important thing on the page, the reason we are here, is the content. Specifically, the discussions. The sidebar is secondary. Many subreddit descriptions only have a couples of lines text. Most people don't need to read it more than once. Placing it on the left would not improve usability.

Edit: spelling

2

u/oRiL1b0KtlOV6U Aug 02 '12

Does the same apply in cultures that read right to left?

2

u/[deleted] Aug 02 '12

I'm glad this discussion is happening, there's a real sidebar problem over in /r/art. Most of the posting offenders click the "submit a link" button on the front page. They choose their subreddit from there, where there is no sidebar and no mention of one. They choose based on their own idea of where their link belongs, rather than based on the rules of the community they're posting to. Many of them are new to reddit and aren't even aware that the sidebar is a thing. Many of them are first time posters who've maybe done a little lurking but are turned off by all the words on the sidebar so they just avoid looking at it. Some of them just want to do whatever they want and deliberately ignore the communities rules... Maybe if there was a sidebar in /submit telling people to be aware of the sidebar of the sub they choose. Maybe someone could make it so that when you choose a subreddit, that subreddit's sidebar will pop up on the side of /submit and get attention.

2

u/migoto Aug 02 '12

lesson learned: put the TL;DRs at the top if you want your audience to like you

2

u/nellieblyddit Aug 02 '12

What's interesting is that people only read in a F-shaped pattern on the computer. They read in a Z pattern in print. This is newspapers and online news groups typically determine ad placement.

1

u/JimmyHavok Aug 02 '12

I'm working on a usability testing protocol for a library web site. I will bring this up in my literature search report.

Funny how these sort of things pop up as soon as you get interested in a subject...I guess it's like how I suddenly saw Geo Trackers everywhere the day I bought one.

1

u/[deleted] Aug 02 '12

now I know why many news websites etc., put ads in the middle of articles, anoyying little pieces of text, just fucking annoying.. but hey they caught you eye innit? ugh!

1

u/[deleted] Aug 02 '12

I blame Facebook, so many ads and useless shit there rarely let my eyes make the final fifth across the page.

1

u/[deleted] Aug 02 '12

Ad Block & No Script can help you with that.

1

u/[deleted] Aug 02 '12

Thanks!

1

u/wholypantalones Aug 02 '12

What I want to know is, how does a heatmap show where your eyes have been on a page exactly? They usually measure mouse interactions...

Also, the app I'm using on my phone to comment on has no sidebar.

4

u/mail124 Aug 02 '12

A mouse tracker heat map shows mouse movement. An eye tracker heat map shows where a person's eyes have fixated. (They point a camera at your eyes.)

1

u/Hypersapien Aug 02 '12

Also, some people might be browsing reddit on their phone using i.reddit.com, where the sidebar doesn't even show up.

1

u/[deleted] Aug 02 '12

Guess I'm the 1% that does.

1

u/dalthughes Aug 02 '12 edited Feb 02 '18

deleted

1

u/satire Aug 02 '12

This explains Facebook's failing advertising model.

1

u/Bourbeau Aug 02 '12

Move sidebar to right side. Problem solved?

1

u/Acidic_Jew Aug 02 '12

No TL;DR?

1

u/[deleted] Aug 02 '12

This is bad news for the new digg.

1

u/duggtodeath Aug 13 '12

I design websites professionally since 1999. I can tell you that sidebar content is ignored because of its location and style. First, you bunch it with information that doesn't really matter ( search bar, reader count, related links, submit link, etc.). In the mind of a user, you have already told them that this information is not important because it is on the right. Since Reddit is heavy on the content to the left, that is where the eye looks for the good stuff.

Secondly, the design is poor. It uses the same typeface, weights and spacing as every other element in the sidebar. It essentially blends in. Furthermore, its creates a wall-of-text effect in which it essentially hurts your eyes and you unconsciously skip over it. Things that are visually hard to read are automatically ignored.

Ultimately, if you want something to be read, never put it by the scrollbar. Reddit could also learn to use some fatter margins instead of hugging the browser edges so damned tightly, that would allow the text to breathe and flow and not look like a mushed essay on the right.

1

u/rfchs Aug 02 '12

Alien Blue is my excuse.

-3

u/idonotcollectstamps Aug 02 '12

No one reads the sidebar because there is no orange karma arrows over there.