UX Best Practices: Include Labels with Icons

Include label icons to help users understand your digital product

In most cases, include labels with icons, even when your team considers an icon to be “universal.” Providing a label name on hover isn’t enough. With mobile experiences, hovering over an icon isn’t an option.

Why? Because icons that your team consider to be universal are actually confusing to users. This is true for both new and returning users. New users are just getting acclimated to your product and shouldn’t be expected to immediately understand what your product’s icons mean. Returning users may use your product infrequently or only one particular aspect of your product. They shouldn’t be required to relearn the product each time they come back.

If you observe people using digital products you know that people tend to avoid clicking or tapping on anything if they don’t know where it will lead them. Because of this, people are less likely to interact with icons that don’t have labels—they aren’t sure what the labels mean or where they will take them. Including a label on hover (if the device supports it) is not an adequate solution and assumes that users will hover over the icons in the first place.

Yes, icons are tempting to use, especially when space comes at a premium. But the tradeoff is potentially confusing users and limiting the full benefit they may get from using your product. In most cases, include labels with icons or consider removing the icon and simply using text or a button. If your team insists you just use icons, perform a usability study to see if representative users understand what the icons represent.