Rants, Usability & Accessibility, Web Design, Web development

On usability and accessibility – please display PDF links properly!

Please display PDF links properly! - Whatwasithinking.co.ukOver the last couple of months I have been working on a great number of design, usability and accessibility reports for clients of mine. Some of the sites I worked on are pretty good, and all you can recommend is maybe tightening up their call-to-actions or look at a couple of points of Section 508 to validate properly. Then there are some that need a bit more help than that. That is natural, some of the sites have been up for years and could do with a new design or will need some more development work.

But what gets me going of late is the inability of some websites to display their PDFs properly…

.

The problem with PDF links

I was reviewing a website a few days ago using my usual set of browsers (IE 5.5 – IE7, FF2 FF3, Opera 8 – 9.5, Safari) then I was going through a product page and clicked on a link to read more about a link called “Course documents”. This was when my old test machine’s fans started spinning up and the task manager showed a significant increase of Memory and CPU usage. Acrobat was loading up while IE6 and IE5.5 came to a grinding halt. After about a minute of nothingness the browsers displayed a 3 page PDF with a 1 page full-size image and 2 pages of information about the course.

Now in that time I, the average user, could have been under the impression that the site is crashing my browser, so I would have tried to close the browser forcefully. Or I could have been saying “F*** this, I’ll go elsewhere”.

Not showing your users what link opens a PDF is one of the most annoying things you can do to your users! Not only that, it is a usability and accessibility issue!!!

So I wrote my report to the client, asking them to indicate their PDFs properly. This is what they came back with:

The client\'s amendments to show their PDF links

Well done, at least you have the word “Download” appearing within the link. Still not best practice, but at least something – if you are f***ing lazy. So I sat down with the client again and suggested a couple of ideas to his development team:

.

Best practice for PDF links

  1. Link location: think about moving PDF downloads either into another location entirely, or – if that is not possible or not wanted due to the design and layout – distance the PDF link from other links.
  2. Show a file size: here in the EU we still have quite a number of users with dial-up or very slow connections, so it is best practice to show your users what they can expect and how long it may take them.
  3. Display a PDF icon: the best visual reference that the link you will be clicking on will be a PDF

In the end the problem was finally solved:

PDF download link - the best practice solution - Whatwasithinking.co.uk

.

Conclusion

This was an interesting exercise with that client. And I really wished everyone would do this. Displaying PDF links properly isn’t difficult, it makes you look a lot more professional and you make your site a hell of a lot more usable and accessible. Come on, do your part!

Share

2 Comments

  1. Martin Vogel

    Thank you for your article, I agree, .pdf links should be clearly visible. I am browsing most sites on my iPaq as I travel a lot and it usually crashes the moment it encounters a pdf.

    Regards,
    Martin

  2. Sound advice – even on high-speed, it’s a nuisance to find a link wants to fill your browser with something unexpected.

    Sometimes it’s not just unexpected, but unwanted. Even 3 pages of someone else’s (no doubt carefullly crafted) publicity material may be a lot more than I want to print or read.

    Why should I pay for Company X’s printing costs? Did the designers bother checking how their on-screen PDF will come out in monochrome?

    And sometimes all I want is web page content. It makes it so much easier to cut-n-paste a couple of details into an email to pass to colleagues.

    Meanwhile, back in the land of reality… yes to proper PDF links!

    By the way… decent link text is useful. Althought this is out-of-context in the image, I’d wonder if the “course documents” were a description? application? package?

Comments are closed.