Before leaving for an evening out, many folks put a finishing touch on their outfits with accessories—jewelry, watches, handbags, the right shoes or a scarf, perhaps. In much the same way, smart web designers and site owners add icons to a newly designed site before launch.
Icons and accessories both provide that buttoned-up sense of completion (pun absolutely intended) and help communicate an underlying sense of style or personality to others. In the case of the accessories, that’s the other people you meet on your night out on the town. In the case of your website, it’s your users and visitors, and they’re the most important people you need to impress.
Here’s how icons do just that.
Table of contents
Benefits of Icons
They may seem small and even inconsequential, but icons are actually fairly significant design components for any website, serving up a number of benefits to smart site owners. In fact, they can be an important, if pixel-small, aspect of good site design.
First and foremost, a good set of icons helps you communicate essential information about your site and your brand to your users. By associating key content with a unique icon, you help you users understand better what kind of content you’re sharing, what type of audience that content is designed for and what your site (or specific page) is all about.
In fact, well-designed icons actually become visual cues to your users, communicating where they need to go next much more quickly than a text description alone. The icon operates as a kind of shorthand or instant communication. This helps improve the user experience on your site, which increases time on site, conversion rates and other metrics that boost your search engine results.
For example, if you have content that you’d like to direct to specific segments of your audience, you can create separate icons for each segment. You can also use icons to designate different areas or pages based on the tasks your user wants to accomplish on your task. A great example of this is the small icon set on Origin Energy’s home page.
A well-designed set of icons can also help you communicate more about the personality behind your brand or organization. Playful, colorful icons in shades that pop and designs that amuse will convey your brand’s light-hearted sense of whimsy. On the other hand, somber, classical designs in muted greys and dark blues convey a more traditional and serious brand personality.
Icons also help maintain the consistency of visual branding throughout your site. Instead of varied images, a well-chosen set of icons in your color scheme that adhere to a single style or look look help you set and amplify your brand.
Finally, icons help convey a sense of trustworthiness and longevity. Fly-by-night brands that disappear in weeks typically don’t invest in icon design as an extension of branding. Doing so and using your icons strategically on your site communicates to your audience that you’re serious about your mission and intend to be around for the long haul.
Where to Use Icons on Your Site
Icons should be used sparingly and in high-impact places on your site. As with images, a too-heavy reliance on icons reduces their visual impact, thus reducing the benefit to your site.
Start by looking for places that can use some visual context to your written content. Key examples are any navigational elements to top-level pages in your site’s information architecture as well as links to landing pages or pages with content organized around major topics, audience segments or user tasks.
Remember that if you’ve organized your site’s information architecture around specific tasks or audience segments, using icons will help users who aren’t familiar with your site yet get where they need to go. When you help users find what they’re looking for easily and quickly, you build trust and goodwill in your audience towards your brand.
Also look for links that are intuitively associated with icons, such as telephone numbers (the perfect place to also provide the telephone icon), the email address (the “@” icon or a stylized envelope) and social media icons.
What to Look for in a Great Set of Site Icons
Whether you end up commissioning a unique set of custom icons from a designer or downloading a free set off a website, you should put your site’s needs first. Look for icons that meet the following criteria:
- They need to be homogenous. In other words, they should look like a matching set (or like each other).
- They need to match your color scheme. Close isn’t good enough. Sometimes slight differences in shades can create a visual disconnect on your page that’s jarring to the human eye. This doesn’t necessarily mean they have to be the same shade, by the way. In fact, choosing complementary colors is often the smarter, more distinctive choice.
- They need to coordinate with the other visual elements of your branding including the overall “feel” or personality of your brand. You don’t want the staid, conservative blue icons when your brand would be more aligned with the lighthearted, gradient blue icons.
- They need to be available in SVG format and look great at all sizes, including very small and very large, because not every user will render your page at 100%. Some prefer other sizes for various reasons (including visual impairments).
Where to Find Great Icons to Use for Your Website Pages
Many site designers will include a set of commonly utilized icon designs in their packages. For example, you’ll get color-coordinated and themed icons for email, telephone numbers, mobile site versions or apps, and the major social media networks (i.e., Facebook, Twitter, Instagram and YouTube, if not more). If the designer does not include a set of icons in the site design package, you may also be able to purchase one for your site as an add-on service for an additional fee.
Typically, icon sets purchased from designers as add-ons or as part of an existing design package will not be customized. In other words, your icons will (or should be) color coordinated to your site’s color scheme, but they won’t be unique to your brand. Some other brand who purchases the same package or add-on could use the exact same icon set on its site. So, while this option gives you more customization and control over the aesthetics of the icons than, say, downloading a free set off the internet, it’s not a completely custom solution.
To get that, you’ll either need to create your own customized icons or hire a designer to do that for you. Be warned, however, that a custom design will set you back a few hundred dollars or more. On the other hand, downloading free icon sets gives you very little control over the aesthetics of the set. Decide what your budget will support, then pick the best choice available within that price range. You can always upgrade later when your budget allows.
Website to get free icons for Commercial use
Whether you are creating a slideshow presentation or a business card, you will have to look for the catchy icons to complete your projects. You should know that the internet is filled with the free stock of images and icons that you can use in any design projects. Most of web or application designers require a huge list of these icons to create templates. If you are looking to create a specific app or a website template, you will have to look for the perfect resource that will provide you with the free icons that you can use.
To choose the best quality icons for your commercial project, you can start your research and find the websites where you can easily download these icons. We will be sharing a few resources that you can use to get free icons for commercial use. Let’s have a look at the websites where you can easily download the free and premium icons for commercial use.
5 Free Sources for Icons
There are tons of free sources that you can explore to find the best quality icons for your design projects. Here are few to be considered.
IconStore
Icon Store is considered one of the best free sources for finding the best icons for your professional project. You will find a range of free icons on this website in multiple categories. Whether you are searching for the icons for your online store or food website, you will be able to find catchy icons. Icon Store also offers premium icons that you can use for your design project. You will be able to find more than 20 categories in which you can locate your desired icons. It is necessary for every web designer to have access to such resources and this website will provide you multiple options.
Streamlineicons
Here is another great source for finding the top quality icons for your custom web design project. To locate the best icons, you will have options to choose from more than 30,000 icons. The website also features ‘icons in action’ and “Brand Love’m” options that will help you find excellent icons for your project. You will be able to find multiple categories as well including ‘user interface’ and ‘social media’ where you can find your favorite icons. The website also offers premium level icons that you can use for your professional projects.
Softicons
Softicons is also considered a pioneer for getting icons for your professional projects. You will be able to find tons of free icons that you can use for your web design or any other professional project. There are creative categories that you can explore including android icons, business icons, game icons and much more. Moreover, the website will also provide you multiple services including an image to icon converter, favicon generator, and multiple premium icons. If you are looking for high-quality icons for your project, then you should consider using this specific website.
1001 Free Downloads
Here is one of the largest resources available online for downloading icons, vectors, and photos for your professional projects. You can easily search for the best quality stock icons that will provide you excellent value. You can download photos, vectors, icons, fonts, gradients, patterns, textures, and much more using this specific website. If you are searching for the best clipart, then you should consider visiting this website for your commercial project. The website offers the best quality free icons and vectors for commercial use.
FreePik
If you are searching for high-quality icons for commercial use, then you should consider this specific website. It has a large database of professional icons that you can use in your commercial web design projects. Moreover, you will be able to find tons of premium icons that you can use on your client’s website. You can also find vectors, photos, PSDs and much more on this website. You can download free licensed icons and vectors. However, if you are looking for premium products, then you will be able to find the desired products.
Premium Sources for Icons
If you are focusing on creating a commercial project with premium icons, then you will find multiple websites where you can purchase premium quality icons for your project. Here are few mentions that you should check out.
Picons
If you are working on a presentation or creating a professional web design, then you can check out picons to find premium level icons. It is considered one of the most popular icons stores where you can find tons of premium level icons for your commercial project. You will also be able to explore the bundle offers in which you can get access to thousands of icons for commercial use. Whether you are thinking of creating an online store or creating a creative design for a website, you will be able to choose from thousands of creative icons from this store.
Iconfinder
If you have been working in a web design industry, then you must be familiar with the Iconfinder. It is one of the best sources for finding premium level icons. If you are not sure how you can create stunning web designs with premium level icons, then you should consider visiting this website. You will be able to find tons of great icons that you can use for professional and commercial use. There are more than 50 categories that you can explore to find creative and useful icons for commercial use.
Font Awesome Pro
You must have heard about Font Awesome and you must be familiar with the stock available there. If you are looking to find premium icons for the commercial use, then you should also check out Font Awesome Pro. Font Awesome Pro can provide you high-quality icons for the commercial use in yearly membership. You can get as many icons as you want in just $60 per year. You will also receive premium support from this website as well.