What is best method to link PDF(with icon)?

What is preferred method to link PDF(with icon) on a page in terms of semantic, accessibility, usability and SEO?

for example

• this is a name of PDF "01ccc5.pdf" but inside PDF this is the title of PDF "How to search in long PDF" Should i use PDF subject as a file name like "How-to-search-in-long-PDF?
• and I want to show link of PDF as a PDF icon on the page, What is the best way in terms of accessibility and usability.
• Should i insert pdf icon as a inside or i should use as a css background?

---

Which method is better? this

a{开发者_开发知识库text-indent:-99999px}

<a href="How-to-search-in-long-pdf.pdf" title="PDF, 25KB, Opens in a new window">
How to search in long PDF 
<img src=pdf-icon.jpg" alt="How to search in long PDF" />
</a> 

---

or this

  a{text-indent:-99999px;background:url(pdf-icon.jpg);width:32px:height:32px}

or this method http://www.askthecssguy.com/2006/12/showing_hyperlink_cues_with_cs_1.html

<a href="How-to-search-in-long-pdf.pdf" title="PDF, 25KB, Opens in a new window">
How to search in long PDF </a> 

I have to link multiple PDF

---

Note:

Title of PDF is also will be available before PDF but without any link

like this:

Title                                      PDF

How to search in long PDF                  PDF icon (with link of PDF)

How to search in long PDF                  PDF icon (with link of PDF)

How to search in long PDF                  PDF icon (with link of PDF)

---

Easy way to bring pdf or other icon with each link using CSS3:

1. icon through background image -> CSS Code:

a[href$=".pdf"]
{
  background:url("your-pdf-image.png") no-repeat left;
  padding-left:25px;
}

2. bring icon from FontAwesome -> CSS Code:

a[href$=".pdf"]:before
{
  content:"\f1c1  ";
  font-family: fontawesome;
}

---

The last one is the best since everything is in the CSS. However, it doesn't work in IE6- and as much as we would all like this browser to die, it is still well used.

So, I'd use the second one, with a special class (e.g. a.pdf). And if you have multiple links with different file types, use sprites.

Edit: I've just understood why you used a negative text-indent. I'm not sure it will work properly with a background. In that case, I'd probably use an img with an alt text and no text content for the a. I nearly always favor using a text and an image, especially for download links.