Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

At my job there is no UX expert, which can be frustrating since most of the daily discussions I have with colleagues is about user experience / interaction.

Right now there is a discussion regarding (custom) tooltips/balloons on a website, the concept is 'we have too much content' so they try to shorten it and place an information icon behind it with a tooltip. The tooltip will (probably) contain a lot of information - I've seen them use tooltips like this to display specifications for hardware, including images.

The reason behind minimizing the content is that we have too much of it and our Sales guy wants to focus on his 'sell sell sell' button.

In my opinion tooltips should only be used for forms/input elements where more information is really needed, the information in a tooltip should be short and descriptive and not require any interaction (links for example) unless the label is already clear enough.

Additionally I think you might damage your users' trust a bit if you hide pretty much all important data behind a little icon after some sales-driven text.

So I am interested to hear what the real UX people here think about this problem/'solution'.

This is basically what they are asking me to create for them: Example usage

(A sidenote is that we are trying to make our website as touch-friendly as possible and small icons like this are impractical touch targets.)

share|improve this question
3  
May be what you really need is a content strategy and a good copywriter. –  kontur Feb 6 '13 at 7:06
    
@kontur you are very right, we do need that. But unfortunately due to a hiring freeze a good copywriter is out of the question for now and a content strategy is in the works.. but from the sounds of it that's still at least a year in the future.. unfortunately. –  CharlesLeaf Feb 6 '13 at 18:11
add comment

5 Answers

If the information can be hidden behind a tool tip, is it relevant at all?

Once you start hiding information behind interactive elements, there are new barriers that you run up against. If this works on hover on a desktop browser, this will need to be on click for a phone, however bringing up the tooltip on a phone may cover up the call to action completely until it is closed. This would defeat the point in creating the tooltips in the first place — making the CTA more prevelant.

You should also consider rearranging where these CTA and information content appear. Pricing tables are a great example of putting the details BELOW the CTA buttons.

enter image description here

This will allow you to "make the sell" at the top and inform the user below it. The pricing table also put the same CTA button below the details so a user has easy access to "Sign Up" or "Buy" before or after reading the details.

share|improve this answer
    
Thanks! This is something that we are hoping to work towards, the big problem we have with this right now is that while we offer various "packages" the difference between them is very very minimal except for price. So when putting all the packages next to each other it always ends up looking like the cheapest one is the best to get (while 'we' prefer a higher ARPU). This is very silly, I know, but changing the product isn't an option right now unfortunately. Any tips for that? –  CharlesLeaf Feb 6 '13 at 18:18
    
As for relevancy (character limit in prev. message) the information is relevant for certain kinds of people - we have a very broad target audience and some of these want every little detail and others just want the highlights. I think that should be possible to combine this without tooltips behind nearly -every- sentence as my co-workers proposed. –  CharlesLeaf Feb 6 '13 at 18:20
    
I can't think of a great solution for offering different packages that are essentially the same, but for different prices except for something that may help increase sales. Why not eliminate options and sell at a higher price. Providing numerous options of the same product may cause buyers remorse and doubt. Selling 1 or 2 products at a higher price may help in the end. There is a great MSNBC profile of Costco about selling only 1 variation of an item. People will buy a $30 bottle of 500 count Advil if there is no option to buy a $6 bottle of 100 count –  ckaufman Feb 6 '13 at 20:41
    
I completely agree, unfortunately I can't make decisions like this. There have been talks about just offering 1 variation but the result ended up being 2 variations (instead of 4). But there are talks in making the second variation more appealing with more extra's so then something like this might work - that's still months from now. So for now they want to 'hack' something together to try and improve sales.. I doubt their solution will. –  CharlesLeaf Feb 7 '13 at 5:26
add comment

For something like that, I would consider using an accordion style interface, where the summary sales copy is somewhat like a heading/button and the content can be expanded if that item is clicked.

Make your interface clear with something like a plus sign to show that they can expand it. This problem has been solved pretty widely by FAQ systems.

Take this for example (although I'd probably make the plus signs contrast better):

FAQ Page with Expandables

Here is a link to the interactive site:

https://www.updater.com/faqs

share|improve this answer
add comment

I would leave tooltips to form inputs too and make lists like these expandable/collapsible or link off to different pages entirely.

share|improve this answer
2  
Can you explain you reasoning in more detail? –  kontur Feb 6 '13 at 7:44
1  
If the bullet points mentioned are indicative of the level of content displayed, then the info is already self-contained enough that additional details can be obscured for most users but accessible to those who REALLY want it. People who access this on mobile devices don't need paragraphs of explanatory text cluttering up their screens either. –  Spencer Williams Feb 7 '13 at 6:28
    
Good point about the mobile users screen real estate. You could update your answer with the ´edit´ link and add some of your comment to the answer. It is likely to be of more help like that. –  kontur Feb 7 '13 at 7:13
add comment

We're looking for long answers that provide some explanation and context. Don't just give a one-line answer; explain why your answer is right, ideally with citations. Answers that don't include explanations may be removed.

Look at in-text advertising as sample technology, like Vibrant or Infolinks. You can use a kind of link which distinguished from normal underlined link, e.g. by dotted underline or double underline. Thus you can exactly tell user what namely has additional description. Pressing this link or hovering it activates popup window with additional information of any kind you need - technical, marketing, etc.

share|improve this answer
    
Yes, it is technically possible to do this thing, but that's not really what the question is about. The OP is asking about whether or not it is a good thing to do, and why that is the case. –  JonW Feb 6 '13 at 8:50
    
Sorry for misunderstanding the question. I should clarify that in fact my answer endorses idea of reducing visual content and expanding it in some way. Also I offer another possible solution which seems to me more reasonable than tooltips. –  Serg Feb 6 '13 at 9:04
    
@Serg this is basically a nice looking tooltip/balloon/etc. but it doesn't really answer my question. Why would this be better than for example just optimising the customer journey and/or content. Because I can't really find any good articles about this subject except for examples on how to make them. Not to help decide if/when they are a good idea. –  CharlesLeaf Feb 6 '13 at 18:15
    
@CharlesLeaf: Thank you for your comment and sorry for wasting your time. –  Serg Feb 6 '13 at 18:48
add comment

Good that you mentioned that you have to make the website touch-friendly. If the content is too much, it is not preferred to use tool-tips at all. Depending upon the kind of content you want to have in tool-tip, you can use the following options.

Pop-overs

Collapsibles

Also, there is no problem in having few interactive elements (CTAs) in the pop-over itself. Like buttons or links. Just make sure they are not too important for the user at the first sight.

If you can provide some more insight about the content and context, it would be more helpful.

share|improve this answer
    
But a pop-over is basically just a custom tooltip (except it activates on click, at least in the Bootstrap sample). I'm not a big fan of their sample because I can imagine people not knowing how to close this window (clicking the exact same button that hasn't changed state isn't something all users realise). More content/context isn't possible due to work regulations, all I can say is that right now I'm talking a sales page for services. –  CharlesLeaf Feb 6 '13 at 18:23
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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