Iconize Your TextLinks Via CSS

I came across this nifty CSS trick today on Pooliestudios.com that adds an icon to the end of a link to let you know what sort of link it represents. For instance, if you link to a PDF file, a small adobe PDF icon will appear at the end of the link. Or, lets say you link to a .TXT file. A small TXT icon appears at the end of the link.

Icons At The End Of Links

According to the directions you’re supposed to:

Download the .zip file, upload the CSS and the icons to your webspace and integrate the CSS in your Website, Blog or whatever. Done. You can easily replace the icons or add more extensions and sites. Enjoy!

If adding icons to the end of links would help YOU out in terms of reading this blog, let me know and I’ll be glad to implement this into the site.

2 thoughts on “Iconize Your TextLinks Via CSS

  1. Nice find Jeffro. I’ve actually been meaning to do something like this for my external links but haven’t gotten around to it. This will make it much quicker!

    I think it’s a nice effect that helps usability and readability a fair bit.

  2. @John Kolbert Thanks John. I know what you mean by readability. I think in my next blog theme, I’ll use icons extensively to convey a function of the blog.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s