Clickable paragraphs: thoughts/research?

18 Oct 2012 - 11:54am
3 years ago
4 replies
2373 reads

Take a look at this page

If you hover over the news stories, you'll see that the whole extract of each story (title, image and description) is clickable and links through to the full story. This is nice as it give a large click target, but it also leads to unexpected behavior in that the paragraph text is a link even though it doesn't look like one.

Markup like this is relatively new since, before HTML5, block level elements like paragraphs were not allowed inside link tags.

I was wondering if anyone has researched the effects on users - is it helpful or detrimental?


18 Oct 2012 - 12:14pm

I would prefer only the direct content is linked - if you hover over the white space around each article - it's clickable, which if you were viewing on a tablet could result in accidental click-through.

20 Oct 2012 - 6:54pm

Tamlyn, I've done no studies on this, but this style is a big problem for me on two counts.

I keep my hand on my mouse when scanning and reading a page. Often my finger accidentally depresses the left click area. Many times I don't know I'm over an advertisement link and accidental end up at an ad. In no time at all, this Trafficking Culture page would get me to exit it and never come back.

Also I like links to be clearly links so I don't have to search for what is clickable.

This style may be done for SEO purposes—skeptical me.Laughing When site visitors click around the site, Google rates the site better.

Here is a site <a href="">I'm in charge of</a>.


29 Oct 2012 - 8:13pm
Petteri Hiisilä


Only personal research here, but it the link fits, use it. It's quite common in news sites, and it's been around before HTML5. I call these simply "hidden links".

Yes, it's a large click target, which is a good thing, also for fingers. Is there any cons? Most likely it won't confuse anyone, because NOT clicking/tapping it of course doesn't do anything at all, and clicking/tapping it does what's expected: shows the article.

In this site they don't have any mouseover effect in addition to cursor changing into a hand, which is a polite way to allow the mouse cursor wonder around with eyeballs, with minimum interactive noise.

Think about it as a convenience: clicking here did the right thing. Mouseover reveals that this indeed is clickable; the hand is almost a subconscious signal for experienced web users, goes unnoticed. It's unlikely that a beginner web user would visit MY site (or yours) in 2012, but even if they did, they would appreciate if clicking over an article indeed opens the article, and they don't have to look for a "real" click target.

The key is to not overdo it. Cursor change is enough for situations like this. Low noise, enough signal.

Related example: Think if Youtube only plays a video when you hit the video header. People would click the still image of the video and that would not play it. That would be unexpected. Now replace a still image with an article snippet and it's quite close to the same situation.


1 Nov 2012 - 7:07pm
Jeremy White

Is it a problem that there is no hover on tablets? How do you indicate it is a link?

Syndicate content Get the feed