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.

Over the past months I have been turning small websites responsive and encountered PDF links that spell out Opens in a New Window instead of using an icon. I spoke to the client about using an icon however the client has stressed that users will not understand what the icon means.

enter image description here

Can anyone provide some insight/information on which is preferred over the other?

share|improve this question
add comment

2 Answers

up vote 14 down vote accepted

There are several studies studying users ability to understand icons, text and both. The results of these studies always come to the same conclusion. Double coding (text and image) is always the easiest and fastest for users. Look at the three images below, and decide which one would get you a beer fastest be fastest to recognize.

enter image description here

On a more serious note, Microsoft found that icons alone didn't do the trick.

Many researchers have shown that icons are hard to memorize and are often highly inefficient. The Microsoft Outlook toolbar is a good example: the former icon-only toolbar had poor usability and changing the icons and their positioning didn’t help much. What did help was the introduction of text labels next to the icons. It immediately fixed the usability issues and people started to use the toolbar. In another study, the team of UIE observed that people remember a button’s position instead of the graphic interpretation of the function.

Reference: Myth #13: Icons enhance usability

But there are places where Icons actually can help:

Where icons add value:

  • Universally understood icons work well (ie. print, close, play/pause, reply).
  • Icons can serve as bulletpoints, structuring a webpage (ie. file type icons for PDFs, DOCs, etc.).
  • Good icons can make the look of a webpage more pleasing.

One could argue that the open in a new window icon really is universally understod. However, there are quite a few open in a new window icons around, which are plattform specific, and even changes between releases within the same platform. Further, the share icon is very similar to the open icon. I wouldn't rely on just the icon if I wanted my users to know what they should expect.

But if, and only if, this is a PDF link, you could use the PDF icon and test run with the intended audience and see what result you get. Anything less than 90 percent positive response would give me argument to use both image and text.

share|improve this answer
1  
I think the answer will be complete if you also include the fact that icons do increase cognitive load due to the sensemaking effort involved; the fact that very few icons are conventional, and even these are often unknown to technical novices; and the interference effect, where the addition of (unclear) icons can actually reduce the user response time. –  Izhaki Jan 27 at 14:59
1  
If I were to choose either only icon, or only text (because of space-issues) I would have chosen the bar on the left with only a beer... Signs are probably best represented with icons (especially road signs). But as everything else, it depends on the context, and, of course - the users. Test each solution with real users, don't always listen to generalizing studies. (Even though they are mostly right) –  Bluewater Jan 27 at 15:23
    
One point here: "Universally understood icons work well" - there is a chance that the new window icon is universally understood. (note: I'm not saying it is or it isn't, but it's certainly possible). –  JonW Jan 27 at 16:22
    
@JonW True that! But there is confusion between share and open as well, which would support the theory of using words together with images. –  Benny Skogberg Jan 27 at 17:04
    
What about using a pdf icon with a new window icon? But then you need to ask yourself if the icons could carry the message on their own. I think the pdf icon is understood universally. –  Courtney Jordan Jan 27 at 17:48
show 5 more comments

Tl;dr: Use the PDF iconenter image description here or enter image description here, and drop the text.

Update:

Given your comment (thanks!) the icon tells users it is a PDF, and is, practically, universally recognizable (not meaningfully increasing cognitive debt).

Opening in a new tab is appropriate for PDFs because:

  1. Research showed the standard user action after finishing a PDF in a browser window is to close the window.
  2. Often, the browser will launch the default PDF reader on the machine and abort opening the new window.

Both of these feel the about the same to the user, and are expected behavior. "Opens in a new window" will actually be confusing for users if their browser is configured to open files in a desktop application automatically.

The icon prepares the user that something uncommon will happen when the click the link. It is both communicative and inconspicuous.

Orig:

The better question may be to ask why the link should open in a new window as a default interaction.

Standard UX for browser links is to target SELF. Users right-click select "Open in a new Tab" or "... Window" when they want to open a new tab or window. This has been a commonly supported interaction on all major browsers for many major versions of each.

For further reading, see this SO question, Jakob Nielsen (#9), and a talk from Jared Spool.

The one exception I'd make, which Nielsen empirically observes, is that links to PDFs or non-HTML files (anything that isn't a web page) should be opened in a new window.

If it is necessary:

Adoption of the icon will likely be effected by the demographics of the site users. Browser demographics can help:

  • If the majority of users access using modern, latest-version browsers, the users may be younger or more tech-savvy.
  • If the majority of the users access using older browsers, the user base may be older or not "digital native".

However, as pointed out here, browser demographics cannot be the only metric by which you make decisions.

The middle ground for your client may be to add "Opens in a new window" as the roll-over text for those links, in addition to using the icon.

And, since you're only using these links for PDFs and other documents/files, use the icon for the most recognizable application that will open that file (the Word logo, PDF logo, etc). That will be instantly recognizable.

share|improve this answer
    
Whoops forgot to mention this is for a PDF link. –  Courtney Jordan Jan 27 at 14:53
    
Considering how often application's logos change, I'd suggest using something more permanent. Even PDF would work in this case –  bfred.it Jan 29 at 1:28
    
@bfred.it, interesting thought, but better to stick to the trademark owners style guides. Also, I'd argue that adding a text link as such doesn't necessarily add anything other than making a style choice. I can't find an example of the PDF logomark that looks much different from either above. –  Matt Jan 29 at 8:15
    
Consider OS X, you won't see that icon anywhere, the system can read PDF autonomously. The icon is different and not even red. The program you use to open it, it's not necessarily the best way to represent the format. –  bfred.it Jan 29 at 16:23
    
Except this is for a web site, not for files on the operating system, which are two very different UX contexts. PDFs are a standard brand on the web, and that logo has been the common mark for them for decades. In the US, facial tissue is commonly called "Kleenex". Doesn't matter whether it's technically correct, it's colloquially used because it has the widest reach and recognition. –  Matt Jan 29 at 21:56
show 2 more comments

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.