Product image links

Question

The scenario: customer navigates to the start page of a e-commerce book site, is presented with various offers on new books. Books is shown just by its fairly large cover.

Example: http://www.pocketshop.se/ (not my project or client!)

Can the product image really be the only entrance to a product page? It sure looks a lot cleaner, but will users understand? I'd like to think so, considering the title and author is visible on the cover. Alt tags is provided of course.

My client's solution: add "read more"-buttons under every product. Necessary? Cluttering? Experiences?

Answer 1

I once designed a category page template in which I put product images and some basic differential facts about the products in a sortable and filterable table, in order to make it easy for the visitor to scan and select the product that matched his preferences. I didn't use any read more buttons because I believed they were unnecessary. After the launch I found out that people didn't understand that there were more facts about the single products so we had to quickly add read-more links.

Lesson learned - always user test, don't expect anything from your visitors.

Answer 2

You're not going to turn people away by improving the affordance of the links. Sure, currently the mouse cursor changes on hover and you get a (slight) state change in the look of the book (the background is highlighted on hover). Not to mention the ghastly hoverover bubble.

However; none of that is noticeable until you start interacting with the page. Adding in some extra affordance; whether that is a link, button, or another visual cue will show that the items can be interacted with which may increase the click-through rate.

I've mocked up some quick-and-dirty examples here. Either a direct button over the book (more obvious but means you're slightly losing some of the bookshop shelf metaphor they're going for), or a page turn graphic to indicate that you can 'go into' the item. (Less obvious than the button that it's clickable but still more obvious than nothing).

Some A/B testing can work wonders here as to which route to go with. (And you don't need to limit it to two choices in an A/B test, you can come up with numerous methods of providing affordance and determine which version gives you the best click-through rate).

Answer 3

Good question!

There is the adage - "Don't judge a book by its cover", but psychologically you tend to choose books by its cover, unless the subject is of real interest to one or the book is known to them. So going by the adage it is mostly the cover that takes center role and thats the reason which precariously says "dont" (never do it). This is all literary.

Now, as the websites need to be now looked with a context of user and seller. A seller will be really glad, to see the money pouring, nevertheless the user even though makes a wrong choice. Wrong choice is fairly a wrong book as far his/her liking. But from the user point it really is not beneficial, where he may not return to a site of making that wrong decision, since the website did not help or lead in picking the right choice. Now there is the "Amazon Effect" which states that people really do their research well and go to Amazon to do the research before buying a book. So fairly in a world where information is huge, user will find his/her way to get the right product, even though a site does not aid in finding a better book.

Sites mostly fall like this -

1.Informative and best in price

2.Best in price and bargains

Once the clear line is drawn the sites can behave in that way where it is suitable to take design decisions which looks like -

1. Creating information and leading user to find the right choice, which is a pattern - where reviews, star ratings, favorites and social media patterns really drive the site's merit. This means your site should have these kind of information, and also as your client adviced to have a one liner about the subject. Since all this can build user trust and then persuade them to find the right choice.

2. If your site handles much like a dealer; price and bargains are all important, then I think the approach to have only large and good visual images are the apt solution. Since the focus will be on price. "Read More" will start to complicate the way user interacts, atleast on the home page or start-up page. I think Offers should be highlighted and on click of the product, the details of a book can open in a modal window or somewhere on the same page. Think in this fashion, that clicking a "Read more" link is mundane activity to do repetitively, never a sleek solution as against clicking the book or product itself. May be you can have a mouse-hover effect as in pocketshop site, and push some book details with some more additional information of the book to help your client statements.

But decide on the business context of how the seller looks the site to behave. User can ascertain 90% of the books content with looking at the cover, so that interest is created first by showing the book face-cover. If the cover is not really enduring then never the user will approach that product or read more information of that product. One task leads to the other. How often people keeping clicking the read more information consecutive times in a series ? Its fairly however you structural strengthen to have info about the product, its only the face-value or by cover of the book, choices are made, atleast for the unknown books.