6

Should search results with missing images use a placeholder, or fallback to textual data available on boxed/grid view mode? I feel that using image instead of data when available makes result look nicer but on the other hand penalize on amount of info provided to the viewer.

At the moment our gathered data is mostly 90% textual.

Now missing blank item without any image. Additional placeholder of using title as part of placeholder-box for that is already in result and therefore does not have any informational benefit over logo. enter image description here

  • 1
    Could you provide some screenshots or mockups of both situations so we can better judge it? – Paul van den Dool Apr 1 '14 at 8:14
7
+50

Are the images themselves of any value? - placeholder or actual.

If you're dealing with a mixed-case of images and missing images, why not design for the most common denominator? Likewise from a design perspective, you're putting heavy emphasis on the image scale and placement itself - are most users more familiar with the image or title of entity?

I'd gather it's best to approach the entire listing from a textual listing and reduce image scale to thumbnail approximation. Your eye is accustomed to identifying things even tiny in scale. Likewise, you skirt the issue of providing generic placeholder image - just don't it at all.

enter image description here

2

Not divergent from other answers , but a few direct suggestions:

If users will be visiting the results / target pages often enough, then consider generating "Custom Unique Place holders" (like those in stack-overflow avatars) as users may learn to identify these when scanning results.

Do not repeat title or add additional text when a place holder image is there. This will slow/disrupt scanning.

Do make the text a feature when it is likely you only have text. In this case the difference between a place-holder and real image is far smaller, but still noticeable.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

Do use a place holder that is reminiscent of entity being listed i.e. a "Building£ for business rather than generic 'no picture'

1

If placeholders are meaningless for your users (i.e. doesn't add any value to the results) it's not a good idea to use them. Please, notice that placeholders often looks similar and will visually distract your users from analyzing an information.

It seems like if you have a 90% of textual information it's better to use Column layout instead of Grid: In columns there is no need to align "cells" vertically, so you may use images if available and plain text if there is no image for the block available:

enter image description here

  • I think this kind layout would work for recent news where some text could be thought mandatory. We will have use the same layout for consistency across so I think it would be safer bet to let users eye scan the results by rows or columns as they prefer. – user20301 Apr 1 '14 at 15:35
  • Your right on key with the problem of meaningless placeholder. Should the placeholder made meaningfull in some other way... – user20301 Apr 1 '14 at 18:07
0

If the image and text both are important to you, then why don't you go for a combination of both as shown in the image below:

enter image description here

This way whether the image is available or not, it will not penalize the amount of info provided to the viewer.

  • Some of the textual data is important eg, product key and company of the hit on product type results and is located at place you used. I have mixed feelings about the type attribute as they can be filtered by and address in the result is just example of data that could be used as filler. I think the important things after the title (should be bigger) on company results are mostly look and feel. – user20301 Apr 1 '14 at 15:52
0

Remember that the whole idea of having an image, especially in search results would be for the sake of making it easy for the user to discriminate results. So, if you are going to use this pattern...

Use the image placeholder in search results pattern when: Missing an image it's an exception rather than the norm, which allows a placeholder to be a helpful cosmetic design element rather than a stubborn and annoying feature...

Workaround: If you still want to have the placeholder, regardless of having a lot of images missing, make a placeholder for types. i.e. have a placeholder for cameras, and another for computers, etc., that way at least the placeholder conveys some information.

0
  1. The user will be drawn first to results with images above all else. If only 10% of your data has images I would avoid images.

  2. Make sure that images are actually useful for the user in discerning which result they want. Images may make a results list look better but if a user still needs to read each line to figure out what they want then the image is likely a distraction.

  3. If the image IS important and useful and in fact primary to the user, then a grid as you have it works well for displaying results. If not then a grid is pretty terrible way to display results: the user can't easily scan the text to find what is needed.

If you still want to use an image, I recommend a small thumbnail to the left of a text list:

[   ] Item 1 title
[   ] Item 2 title 
[   ] Item 3 title 

This lets you use images when you have them but still allows for easy vertical scanning of the text results. It also makes the placeholder-or-not question less critical: I think you could go either way.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.