Download link warning icon needed 11:06 on Friday

I hate surprise links to PDFs, EXEs and other downloadable content. When I click, I want to get to another page — preferably in the same window thank you.

I’m not sure if other browsers have this feature, but Safari could do with a feature that pops up a small icon next to a link I’m about to click, if that link would start a download instead of a page load. If the link is a direct link to a file, the browser knows what to do from the file extension. (Doesn’t it?)

Maybe this could be even done with a local CSS hack. Anyone care to try?

6 Responses to “Download link warning icon needed”


  1. Visa Says:

    That would only work if the URL has a file extension. However, this is not always the case.

    And anyway, it can’t be done with a basic CSS hack since it can’t be determined in CSS which files are downloaded to the disk and which are displayed in the browser. For example, PDFs are displayed in the browser if you have installed a PDF plugin and downloaded if you haven’t.

    There are ways to change the link’s appearance by its URL. See an example at http://www.visakopu.net/misc/css/url_icon/. Works at least in Safari and Firefox.

  2. Visa Says:

    XML.com has a tutorial on CSS3 selectors. There you can learn that instead of using a:link[href*=".zip"] like in my example, you can also use a:link[href$=".zip"] which will only match URLs that end with “.zip”.

  3. niko Says:

    So now all I need is a rule that says “select all elements that include string .pdf after the first / character and before the first encountered ? character, and I’m all set. ;)

  4. Visa Says:

    How about this:

    a:link[href*=".pdf?"], a:link[href$=".pdf"] { ... }

  5. Visa Says:

    Oh, and make it a[href=...] instead of a:link[href=...]. Otherwise you lose your styling after visiting the link.

  6. niko Says:

    The problem comes with URLs where “something.pdf” is included in the last parameter name, for example: http://www.url.com/something.php?param=moreSomething.pdf

    I made it a:hover so I get warned when I’m about to click the link.