Naming Elements So Click Events Are Readable

Analyze names every click event automatically, using whatever it can find on the clicked element. Build decisions therefore determine whether the event reports are readable or useless. This article is for anyone building or refactoring pages and components.

How Analyze Builds a Label

Analyze checks the clicked element in this order and stops at the first thing it finds:

• The inner text of the element, such as the words on a button.
• The aria-label custom attribute.
• The element id.
• Alt text, if the element contains a single image.
• A valid href.
• The image src, if the element contains a single image.

If none of those exist, Analyze generates a label such as Unnamed button, using the element type. A report full of unnamed entries is a build problem, not a reporting problem.

What This Means for Building

• Text buttons and links are already fine. The visible words become the label.
• Icon-only controls need an aria-label. This is already required for accessibility, and it doubles as the Analyze label. An icon link with no accessible name reports as unnamed.
• Image links need meaningful alt text. Alt text is the fallback label when there is no text and no aria-label.
• Avoid generic link wrappers with no accessible name. A link block wrapping a whole card with no text and no label falls all the way through to a URL or an unnamed entry.
• Reuse consistent wording inside components. Two buttons that do the same thing but read differently produce two separate entries that have to be added together by hand.

These rules overlap almost entirely with the existing requirements in Client-First v3 Class Naming and the site accessibility rules. Meeting the accessibility requirement generally produces good Analyze labels for free.

Labels Change Over Time

Analyze reads the current inner text of an element, so a label reflects the most recent wording for the date range selected. Rewriting button copy changes how historical clicks are labeled, even though the click counts are unchanged.

When comparing month over month, check whether the copy changed before concluding that behavior did.

Collection Lists

Each Collection item has its own id, so each item that visitors click gets its own entry in Analyze. Two consequences follow:

• Item level reporting comes for free. Individual articles, webinars, and case studies can be compared by click volume.
• Labels follow the current item in that position. Publishing a new item into a Collection list can attach an existing click history to the newest item name. A top event with a large count and a brand new item name is usually this behavior rather than an overnight success.

Checklist Before Publishing a Build

• Every interactive element has visible text or an aria-label.
• Icon-only buttons and links have accessible names.
• Image links have descriptive alt text. See Image and Media Guidelines.
• Repeated calls to action use consistent wording across components.
• Any goal attached to a rebuilt element has been re-checked.