Use icons with care
Icons can benefit the user experience but can also cause usability problems.
The advantages of using icons are:
- well-designed icons can be quick to recognise at a glance
- they can enhance the aesthetic appeal of a product
- they can be a good touch or click target
- they can be understood by people who speak different languages
The disadvantages of using icons are:
- icons that are universally recognised are rare
- if icons are not easy to understand, people might not discover what they do
- redefining the meaning of familiar icons can cause confusion
The only icons that are used on Turas without an associated text label are:
- home
- search
- close
All other icons should be used sparingly and with caution. Their associated text labels should be in close proximity to the icon in order to minimise ambiguity. Both the text label and icon should be hyperlinked.
Font Awesome
Most icons on Turas reference Font Awesome icons. Specifically Font Awesome 6. All icons are available to use including the 'Pro' icons.
We strive to use easily recognisable icons, but remember that universally understood icons are rare. Therefore, we limit the use of icons to very specific situations.
Bespoke icons
Turas has a small number of bespoke icons.
References
Nielson Norman Group
Icon Usability
By Aurora Harley on July 27, 2014
Nielson Norman Group
Touch Targets on Touchscreens
By Aurora Harley on May 5, 2019
Smashing Magazine
Icons As Part Of A Great User Experience
Nick Babich
October 20, 2016
Smashing Magazine
Designing For User Interfaces: Icons As Visual Elements For Screen Design
Manuela Langella
February 16, 2018
Medium - UX Planet
Checklist for Using Icons In UI
Nick Babich
Jan 18, 2019