Identifying PDF/Word links

30 Sep 2008 - 10:34am
6 years ago
3 replies
719 reads
kimbieler
2007

I built a site for a client a while back with a lot of links to PDFs,
Word docs, etc. At the time, I understood the best practice was to
identify the link type and document size in parens after the link:

2007 Strategic Report [256kb PDF]

but I'm starting to feel like this junks up the screen a lot when
you've got a long list of links. I've seen other sites that put icons
next to each link, which seems useful for quickly identifying the link
type, but a ton of little icons is just as junky as text, if not more
so.

I'm considering dropping the file size information, since download
times aren't such an issue any more (although my client does have a
certain number of visitors from developing countries) and maybe
putting the [PDF] tag in grey, so it's less obtrusive.

Is there a better way? Maybe I'm overlooking something obvious that
would be much more elegant.

-- Kim

+ + + + + + + + + + + + + + + + + +
Kim Bieler Graphic Design
www.kbgd.com
+ + + + + + + + + + + + + + + + + +

Comments

30 Sep 2008 - 11:08am
Carolynn
2008

Is the file type and size going to be a decision factor as to which
file they download, or is it just informative?

What about hiding them until mouseover? I just did a quick CSS
experiment using a span inside the to make the file type and size
and same as the bg colour, and therefore invisible, then making the
'a:hover span' match the 'a:hover' colour. Only the file name is
visible at first glance but on MO the size and type appear as well...
works in FF, IE6 & IE7.

This should work well for accessibility too as the info is still
there, just blending into the background...

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=33697

30 Sep 2008 - 11:14am
mauropin
2007

Kim, you may consider using a 'mouse over' effect, in such a way that
the information about the file type and it's size would appears only
when the mouse pointer is over the link.

This way you would still have the information, but it wouldn't
"clutter" the interface. The 'cons' of this solution is that you won't
have the information at a glance, only when you pass your mouse over
the link...but seems to me that it's better than the previous solution
you have.

Besides, it's not so relevant in the first place to know what kind of
document you're downloading, if all documents are supposed to be a
downloadable file. It would matter if you have different behaviors for
the links, like HTML files or PDF/DOC files...the previous would open
a page within the browser, and the others would lauch an application.
Different behaviors should be noticable and very clear distinguished.
But if all links are supposed to point to downloadable files, I think
you could "clean" the interface like I suggested.

I saw this approach recently on Twitter. They have "cleaned" the
interface, and some icons (favorites and reply to) are only visible
when you pass the mouse over the post.

all the best
mauro

--
prof. mauro pinheiro
universidade federal do espírito santo
centro de artes
depto. de desenho industrial

On Tue, Sep 30, 2008 at 12:34 PM, Kim Bieler <kimbieler at mindspring.com> wrote:
> I built a site for a client a while back with a lot of links to PDFs, Word
> docs, etc. At the time, I understood the best practice was to identify the
> link type and document size in parens after the link:
>
> 2007 Strategic Report [256kb PDF]
>
> but I'm starting to feel like this junks up the screen a lot when you've got
> a long list of links. I've seen other sites that put icons next to each
> link, which seems useful for quickly identifying the link type, but a ton of
> little icons is just as junky as text, if not more so.
>
> I'm considering dropping the file size information, since download times
> aren't such an issue any more (although my client does have a certain number
> of visitors from developing countries) and maybe putting the [PDF] tag in
> grey, so it's less obtrusive.
>
> Is there a better way? Maybe I'm overlooking something obvious that would be
> much more elegant.
>
>
> -- Kim
>
> + + + + + + + + + + + + + + + + + +
> Kim Bieler Graphic Design
> www.kbgd.com
> + + + + + + + + + + + + + + + + + +
>

30 Sep 2008 - 11:38am
kimbieler
2007

These are good points. I always like to know whether I'm about to
download something before it happens, which is why I wanted to
distinguish between links that go to another site versus links that
have a file behind them. Since I don't know whether users have PDF
plug-ins to their browsers, I didn't want to treat PDFs as a site link.

I do like the mouseover solution, so thanks for that tip!

-- Kim

+ + + + + + + + + + + + + + + + + +
Kim Bieler Graphic Design
www.kbgd.com
+ + + + + + + + + + + + + + + + + +

Syndicate content Get the feed