I like them so I can have an h1 that is written for SEO, but a head line that is more emotional. Also I work in pharma and we use them to clear some regulatory hurtles.
I’m working on the hero section shown in the attached image. Above the main headline, there is a small pill-shaped label (sometimes called an eyebrow, kicker, or badge). My concern is that it creates another visual stop without giving the user much useful information.
When do you think an element like this is genuinely useful? Appreciate any usability research, testing experience, or design-system guidance on this pattern.
I like them so I can have an h1 that is written for SEO, but a head line that is more emotional. Also I work in pharma and we use them to clear some regulatory hurtles.
I have no research on this, but I have an opinion based on years of experience. It appears your labels are applied to the article where a headline and image exist above the body copy. My opinion is, that makes them superfluous labels that are redundant and likely overlooked by readers. They add to the visual clutter of the page, increasing the visual complexity without contributing to the comprehension. Unless I'm missing or misunderstanding something, and my apologies if that's so, I don't see the value of function for the majority of users. Having said all that, I strongly suggest testing the value of those labels with readers to determine what works. Test the existence of the labels, but also test what characteristics of the labels are most effective to achieve the outcome you desire. Color, size, placement, massage, etc. may change how readers view and use those labels.
Eyebrows or kickers predate digital design and are generally a holdover from magazine design, but with some added benefits. In a magazine, a kicker is (usually) used to distinguish and categorize ongoing categories (like topics or features.) The benefit of digital, of course, is that those can be actionable. Say you have a column called "Ask a Chef." Select the eyebrow, the user can see ALL the "Ask a Chef" columns. For your example, an eyebrow might be useful if you are using it to categorize by industry vertical for case studies, where users can then navigate to see all examples in that industry. If it's just inactive text used as a superfluous label, it's likely that it's being misused and the concept you're trying to get across in the eyebrow can be communicated in the body (paragraph) text.
u/karenmcgrane I love someone has been around long enough to make the historical linkages from the ‘now’ to its roots.
Honestly, depends on execution. But most eyebrow labels I see are lazy filler, not clarity tools. When they work, it's because they add context the headline can't. Like if your headline is punchy but abstract, an eyebrow like "For B2B SaaS Teams" tells the visitor "this is for me" instantly. That's useful. But most of the time it's vague fluff like "WELCOME TO THE FUTURE" sitting above a headline that already says everything. Now you've got two headlines fighting for attention. That's not clarity, that's noise. My quick test: cover the eyebrow with your thumb. Does the headline still make sense? If yes, kill it or turn it into something functional, like a category tag or a stat. If no, keep it but make it quiet. Small, muted, tight spacing. Also, real talk. Eyebrows are often a crutch for a headline that isn't confident enough to stand alone. If you need three lines of copy just to make one point, fix the message first.
Content first!
A good rule for design in general: if you aren’t sure what purpose it’s serving, remove it.
Yes, but Claude keeps putting in these elements. It must be right! /s
Every context, and every audience are different. Nobody here can give you a meaningful answer outside of pure dogmatism ... Only your target user segment can answer this.
In my experience, people typically look at the headline first. Then they notice elements both above and below it. Where do they look next? A better solution is to have one clear path for users to consume the content.
all Ai-created home screens, like the one shown here, are using those. it's like the em-dash in Ai-written copy.
Yes. Eyebrow labels are a dead giveaway. LLMs use them like a shotgun and most of the time they don’t even communicate anything.
I use them in pitch decks to help investors understand what slide it is. For example I’ll use the eyebrow to say “problem” .. and then I can be more creative with the wording of the H1 under it.
It’s part of the shift of b2b sites copying Stripe-> b2b sites copying Linear