Icons Nobody Recognises

How many icons are actually universal

Fewer than designers assume, and the list is short.

A magnifying glass for search, an envelope for email, a telephone handset for calling, an arrow for direction, and a printer for printing.

Beyond that, recognition drops sharply and varies with age, familiarity with software, and cultural context.

A floppy disk means save to anybody who used computers before about 2005 and means nothing to anybody who did not.

Which means an icon set is effectively a language, and a page using it fluently is assuming a reader who happens to speak it.

The hamburger

Worth examining because it is the most consequential icon on most small business sites.

Three horizontal lines, meaning the menu, and recognition is high among younger and frequent users and noticeably lower among older ones.

Which matters enormously for a trade whose customers are homeowners over fifty, because failing to find the menu means failing to find anything.

Adding the word Menu beside or beneath the icon measurably improves how many people find it.

That is a small change with a real effect, and the objection to it is aesthetic rather than functional.

Where icons genuinely help

• Alongside a label, where they speed recognition of a familiar item.
• As visual anchors in a list, making it scannable.
• Where space is genuinely constrained, such as a toolbar.
• For universally understood actions like search or print.
• To reinforce meaning already carried by text.

The first is the reliable use. An icon plus a word is faster to recognise than either alone, and it fails safely if the icon is unfamiliar.

A worked example

A site whose contact page used three icons in a row with no labels: a handset, an envelope and a pin.

Two were reasonably clear. The pin was a map marker meaning the address, which several people read as a location they were expected to click.

An older customer phoned to ask where on the site the address was, having looked at it.

Adding the words Phone, Email and Address beneath each icon resolved it entirely.

The design was marginally less clean and the page became usable by everybody, which is the trade that this whole subject comes down to.

Nobody complained about the labels, which is the usual outcome.

Icons and screen readers

A separate failure with the same fix.

An icon rendered as an image needs alt text describing its function, not its appearance.

An icon from a font renders as a character, which a screen reader may announce as a meaningless symbol or skip entirely.

Either way, an unlabelled icon button is announced as a button with no name, which tells somebody nothing about what pressing it does.

A visible label solves this automatically, which is another reason to prefer one, and where a label is genuinely impossible, hidden text serves the same purpose.

Where the icons come from

Worth knowing, since it affects both weight and licensing.

An icon library loaded as a font brings hundreds of symbols to display six, which is a substantial file for very little.

Individual files for the icons actually used are far lighter, and most libraries allow downloading a subset.

Licensing is usually permissive for the common libraries and is worth checking once for anything used in printed material or a logo.

The counter-case

Where icons alone are acceptable.

An interface used repeatedly by the same people, where the icons are learned once and efficiency then matters more than first-time recognition.

Genuinely universal actions in a constrained space, such as a search icon in a header.

And decorative use, where the icon carries no meaning and the information is in the text beside it.

What is not a counter-case is that labels would spoil the design, since that is a preference being weighed against people being unable to use the page.

Icons as the only content in a button

The case where the cost is highest, because a misunderstood icon means a misunderstood action.

A button showing only a symbol asks the visitor to guess what pressing it does, and guessing wrong may delete something or navigate away from a half-completed form.

Which is different from an unlabelled decorative icon, where the cost of misreading it is nothing.

For anything with a consequence, the label should be visible: not a tooltip, which requires hovering and does not exist on a phone.

The close button on a popup is the everyday example, and an X is one of the few symbols with genuinely broad recognition, which is why it survives unlabelled.

Almost nothing else in that position does.

Consistency within a set

A smaller point that affects how professional a site looks.

Icons from different sources have different stroke weights, corner styles and proportions, and mixing them is visible even to somebody who cannot say why.

Which happens very easily, since one set arrives with the theme, one with a plugin, and a third was downloaded separately by somebody.

Using a single set throughout costs nothing and removes a subtle untidiness.

It also reduces the number of icon sources loading on the page, which is a weight question as well as a visual one.

Social icons specifically

Worth a note because they are on nearly every site and rarely examined.

Platform icons are widely recognised, which is one of the few places icons alone genuinely work.

The failures are elsewhere: a row of five packed too tightly to tap, icons for platforms the business has not posted on since 2017, and a set that includes a platform the business does not use at all because it came with the theme.

Worth removing anything dormant, since a link to an abandoned profile is worse than no link.

And spacing them adequately, since they are among the most commonly mistapped elements anywhere on a page.

What to check

1. List every icon used without a label.
2. Ask somebody over sixty what each one means.
3. Add labels to anything they hesitate over.
4. Label the menu icon with the word Menu.
5. Check icon buttons have accessible names.
6. Remove social links to dormant profiles.

The second is the only test that genuinely matters, and it takes about two minutes with somebody who does not work in the business.

The tap size question is covered in buttons that are too small to hit.

Frequently asked questions

West Coast Media Solutions Inc. provides web design, web development, hosting, digital marketing, and business consulting to organisations across Canada, drawing on more than twenty-five years in the field.