We’ve all been there: sitting in front of a new design layout, we realize that something doesn’t fit, is even disturbing, but we have no idea what it is and how we should improve the page. Sometimes, line-height can do the job and sometimes background can completely change the impression on the visitors – in fact, sometimes the smallest design elements we overlook can drastically improve the readability of a given text.But if your attemps to change the layout haven’t beart any fruits, maybe you were looking in a wrong place. To improve the usability one can use a variety of methods and techniques – in fact, many of them will be presented in the next articles on the Smashing Magazine.
One of them – an easy-to-use one – is using of professional symbols, buttons and icons, which give the information a structure and simplify its readability and understanding. We’ve googled searching for them. And we found them: symbols, buttons and icons – for free download and free personal and/or commercial use.
However, before using the icons, don’t forget to check out the license agreement – they are changing all the time.
Don’t forget to bookmarks this page. It will be instantly updated once a new icon-site comes along and hits the blogs of the fellows web-developers. Links checked: May/13 2008.
You might want to take a look at our newer Collections:
- 35 (Really) Incredible Free Icon Sets1
- 20 Free And Fresh Icon Sets2
- Icons For Your Desktop and Icons For Your Web Designs3,
- Freebies Round-Up: Icons and Templates4
- More Symbols, Buttons and Icons For Free5
Where to start?
Ironically, icons can be used everywhere and every now and again, just because they are extremely simple to use. However, one should know how to use them, so the users don’t get confused and have a besser overview of the options given to them. One of the fresh professional quality icons are Mini Pixel Icons6, provided by ndesign-studio. A colorful collection of transparent 14x14px icons is supposed to be used for both web-sites, blogs and eCommerce. Nice, clean and intuitive, the set can be used for every web-site, replacing unnecessary text links or buttons.
Even if you can’t use fresh professional freebies for your current work, it’s important to make sure that you’ll be able to find them once you are looking for them. In many cases a single professional collection will suffice. To save its own time a web-developer shouldn’t have overlooked the Stylegala’s Icon Set8 – an impressive collection of more than 200 professional mini-icons, a small paradise for icon-hunters and collectors.
Web-sites with free icons emerge almost every day, but not all of them provide both quality and quantity; in fact, usually, quality is far more important for presentation. Sweetie10 is a collection of over 100 Icons for web-sites and web-presentation. They are licensed under the Creative Commons License and can be downloaded as .png and .gif-images. Besides, the set includes a .psd-file, which makes it possible to modify the existed icons or extend the collection, driven by the inspiration provided by the collection.
Some web-sites offer hundreds, and just a few provide literally thousands of icons in a one single set. An enormous collection of over 3800 free icons and symbols is available at the Mini-Image-Box12. You don’t have to spend hours looking for the best ones – the set is directly shown in the main menu, which is, by the ways, quite a nice solution of the quantity-vs-readability-problem. Mini-Image-Box offers handy templates for creating sitemaps and a variety of sketches; it delivers thousands of symbols, buttons, arrows, pictogramms and small graphics for your web-sites. An amazing goldmine and inspiring, rich source for creativity – for newbies as well as professionals.
Further impressive collections of icons have been recently created by Mark James14. Set Nr. 1, called Silk15, contains 300 icons (16×16, .png). Mini16 delivers 140 mini-icons (.gif). Furthermore, the designer offers a stylish suite of flags17. All sets can be used according to the Creative Commons License.
Collections icons over the last few years, Gtmcknight Buttons19 has meanwhile over 3000 images in its collection. The icons are sorted out and placed in different categories, such as Software, Operation Systems, Services, Blogs, Navigation etc.
Buttons for every occasion
Whether you believe it or not, pixel-buttons are still getting popular, and not only bloggers make use of them with or without any reason at all. However, if you’d like to create fresh badges or buttons, without monotonous Photoshop actions, online-generators are the tool which could save you a lot of time. Colors, texts and borders can be adapted with few mouse clicks – just the way you’d like it to be. With Kalsey’s Buttonmark21 one click is enough to generate a fresh 88×31 button.
Looking for even more icons?
An enthusiast Ro London22 has collected and presented a variety of mini-graphics such as arrows, e-mail icons, shopping carts and printer symbols. Once you’ve found yourself fighting against your next creativity block, 300images can offer you fresh starting points. One can’t copy the icons directly; however, that’s not the point, actually. The collection is supposed to inspire web-designers seeking for innovative and creative approaches.
Single-Pixels-Graphics have been known for their use in table-based-layouts. With CSS today they become less and less important. However, sometimes you just need them – whether you’d like to present delimiters, separaters etc. on web-sites or web-demonstrations. Fernбn Agьero24 has collected web-safe all, color-web-safe single pixels graphics and presented them in a nice, tiny .zip-package. 217 images can be downloaded from his web-site. Nuvola25 KDE-Icons and Neu! Icon Theme26 are further libraries which look nice, stylish and fresh.
Silvestre, an Argentinian designer, presents severals sets for download. Called Dropline Nuovo!28, Yasis29, Dropline Neu!30, Dropline Etiquette31, they deliver quality and impress with their simplicity. Tiny Little Icons is a small collection of mini-icons in .png-format for use in web-sites and blogs .
The icons are thematically sorted (Computer, Music, Food etc), provide good quality and can be used for private projects without any restrictions whatsoever. The seit is also available for Mac and Linux.
Icons for Internet Explorer: Austrian developers have written a tool which marks the version of Internet Explorer being currently in use35. If you use many versions simultaneously, what a web-developer usually does, checking the code consistency, you know, how important is to keep in mind, which version you are working on at the moment.
New icons for web-developers, designed by Bjoern Seibert. A set with black buttons45 has been released. There are all in all 10 small collections, which can be used freely for private and personal projects.
- 1 http://www.smashingmagazine.com/2008/03/06/35-really-incredible-free-icon-sets/
- 2 http://www.smashingmagazine.com/2007/08/25/20-free-and-fresh-icon-sets/
- 3 http://www.smashingmagazine.com/2007/11/29/icons-for-your-desktop-and-icons-for-your-web-designs/
- 4 http://www.smashingmagazine.com/2007/05/24/freebies-round-up-icons-buttons-and-templates/
- 5 http://www.smashingmagazine.com/2006/12/03/more-symbols-buttons-and-icons-for-free/
- 6 http://ndesign-studio.com/resources/pixel_icons.htm
- 7 http://ndesign-studio.com/resources/pixel_icons.htm
- 8 http://www.stylegala.com/archive/bulletmadness/
- 9 http://www.stylegala.com/archive/bulletmadness/
- 10 http://sweetie.sublink.ca/
- 11 http://sweetie.sublink.ca/
- 12 http://www.web-toolbox.net/imagedownload/index.htm
- 13 http://www.web-toolbox.net/imagedownload/index.htm
- 14 http://www.famfamfam.com
- 15 http://www.famfamfam.com/lab/icons/silk/
- 16 http://www.famfamfam.com/lab/icons/mini/
- 17 http://www.famfamfam.com/lab/icons/flags/
- 18 http://www.famfamfam.com/lab/icons/mini/
- 19 http://www.gtmcknight.com/buttons/index.php
- 20 http://www.gtmcknight.com/buttons/index.php
- 21 http://kalsey.com/tools/buttonmaker/
- 22 http://www.intersmash.com/300images/
- 23 http://www.intersmash.com/300images/
- 24 http://genoma.unsam.edu.ar/%7Efernan/web_safe.html
- 25 http://icon-king.com/?p=15
- 26 http://www.opentux.com.ar/lordcrow/packs/kneu.html
- 27 http://icon-king.com/?p=15
- 28 http://www.silvestre.com.ar/?p=5
- 29 http://www.silvestre.com.ar/?p=6
- 30 http://www.silvestre.com.ar/?p=4
- 31 http://www.silvestre.com.ar/?p=3
- 32 http://mentalized.net/activity-indicators/
- 33 http://www.electriconland.com/
- 34 http://www.electriconland.com/
- 35 http://blech.home.pages.at/iepara.html
- 36 http://blech.home.pages.at/iepara.html
- 37 http://www.graphicpush.com/index.php?s=icons
- 38 http://www.graphicpush.com/index.php?s=icons
- 39 http://www.brandspankingnew.net/archive/2005/06/doc_type_icons.html
- 40 http://www.brandspankingnew.net/archive/2005/06/free_mini_icons.html
- 41 http://www.brandspankingnew.net/archive/2005/06/free_mini_icons.html
- 42 http://somerandomdude.net/srd-projects/bitcons
- 43 http://somerandomdude.net/srd-projects/clearbits
- 44 http://somerandomdude.net/srd-projects/clearbits
- 45 http://bs-markup.de/iconsets
- 46 http://bs-markup.de/iconsets