When designing a website, we often spend a good bit of time
considering which visual assets to use. Photos and illustrations, for example, can
have a large impact on a design. However, those aren’t the only assets we should
focus on.
One asset that can get easily overlooked is icons. There
are a lot of generic libraries floating around and they’re easy enough to use, but
there is something to be said for using a more custom solution. Indeed, the
right icons make for a more detailed and complete user experience.
So how do you go about deciding which icons to use? Let’s
take a look at some tips and best practices for making the right choice. We’ll include
some amazing examples that you can access with a subscription to Envato Elements, home to more than
5,500 icon sets, plus hundreds of thousands of top design resources.
1. Use Icons Relevant to Your Subject
So often we use icons that don’t really fit the subject
matter of our website. Thankfully, we don’t have to settle. Utilizing icons that
are relevant to an industry or concept is a better way to go. This provides a
more finished look while adding context for users.
The medical field is a great example. Medical Line Icons
includes fifty, fully-editable icons that are available in a variety of formats. Each
image illustrates an industry-specific concept in a simple and straightforward
manner.
More industry-specific icon sets:
2. Reflect Your Branding and Style
Icons should add to, not take away from, your style. Look
for images that mesh with the overall tone and messaging of your site. That
means a site with a more buttoned-down, corporate feel should opt for icons
that promote a professional look. Likewise, a more casual website won’t want to
get too serious when it comes to imagery.
30 Fresh & Modern Avatars could be a great fit for blogs or startups that want to reflect
a fun atmosphere. Choose from a collection of interesting characters and edit
them to fit your personality.
More laid-back avatar icon sets:
3. Think About the Number of Icons You’ll Need
One of the challenges in using custom icons is that some
sets may not be very deep. There might not be options to fill every need. Therefore,
you’ll want to consider the potential number of icons you plan to use. Having a
good idea ahead of time will save you the trouble of switching directions or
attempting to mix and match different sets.
If you require a deeper library of icons, check out Modern Flat Icons.
The set contains 200 icons that are categorized by subject. They’re a good
choice for websites that plan on using a larger number of images that span a variety
of industries.
More extensive icon sets:
4. Consider Size and Editability
When it comes to size, not all icons measure up. Many sets
are available in vector formats that scale to any size and are easy to edit. But
you’ll also find collections that are relegated to lower resolutions and can’t be tweaked. This
should be an important factor when browsing through potential options.
For example, with 26 Colorful Vector Ice Creams, you’ll find an icon set that offers unlimited
sizing capabilities. Since it’s available in both vector (Ai, EPS) and raster
(PNG) formats, these icons will be a great fit at any size. Plus, you can make any
necessary edits to better fit in with your style.
More fully scalable, highly-detailed icon sets:
5. Look for the Unexpected
Let’s try a quick experiment. Close your eyes and think of
what an icon should look like. We all
have our own specific picture in our heads. But the exciting aspect of custom
icons is that they aren’t one-size-fits-all. Sometimes, they can take
unexpected forms that help to push our designs forward. They may not work for
every use case, but these mavericks may be just what you need.
This set of Handwritten Social Media Icons is anything but standard. Coming in both sketch and
outline styles, these hand-crafted beauties will help you stand out. They may
even change your idea of what an icon can be.
More unexpected icon sets:
Little Details That Make the Difference
Though they can be small in stature, icons have the
potential to do big things for your website. The key is in choosing the right
ones for your specific needs.
Look for icons that match your subject and style. Then,
consider how deep of a collection you’ll need and if you’ll want to perform any
resizing or editing. Finally, don’t be afraid to use images that break the
boundaries of traditional icons.
Keep those factors in mind and use icons that will help bring
your website to the next level.