BadrWeb All Articles
Web Design

You Can't Get There From Here: The Modern Website's War on Its Own Users

By BadrWeb Web Design
You Can't Get There From Here: The Modern Website's War on Its Own Users

There is a special kind of rage that only the internet can produce. It's not the hot anger of a traffic jam or the cold fury of a cable company hold queue. It's something more disorienting — the feeling of being lost in a space that should be simple, clicking through menus that seem designed by someone who has never actually used a website, searching for a "Contact Us" link that has been hidden with the care and deliberation of a buried treasure map.

This is modern web navigation. It is a masterpiece of hostile design, and it was built for you on purpose.

The Hamburger Menu: Three Lines of Pure Contempt

The hamburger menu — those three horizontal lines stacked in a corner — was a reasonable solution to a real problem. Mobile screens are small. Navigation items are many. Something had to give. Fine. Acceptable. We move on.

Except the hamburger menu escaped mobile and colonized desktop, where screens are large and the only reason to hide navigation is because someone on the product team decided that a "clean" aesthetic was more important than users being able to find anything. You now routinely encounter full-sized desktop websites where the primary navigation is tucked behind an icon the size of a postage stamp, because the design mockup looked elegant in a Dribbble portfolio and nobody in the approval meeting asked "but how do people find the pricing page?"

The answer, it turns out, is that they don't. They bounce. And then the analytics team wonders why the conversion rate is low, and nobody connects it to the navigation that requires a user to already know what they're looking for before they can figure out how to look for it.

Sticky Headers: The Barnacle of the Modern Web

A sticky header is a navigation bar that follows you as you scroll, remaining fixed at the top of the screen at all times. The original argument for them was reasonable: users shouldn't have to scroll back to the top to navigate. Convenient! User-friendly!

That was before sticky headers became the default setting for every WordPress theme, Squarespace template, and custom build regardless of whether the site had enough content to justify one. Now the sticky header is just always there, eating 60 to 80 pixels of your vertical screen space permanently, displaying a logo you've already registered and navigation options you've already ignored, following you like a golden retriever that has been told it is helping.

On a laptop screen displaying a news article, a persistent header plus a persistent cookie banner plus a persistent newsletter popup leaves you approximately 40% of your screen for the thing you came to read. The rest is chrome. The rest is the website asserting its presence at the expense of its own content.

The Footer That Became Its Own Website

Scroll to the bottom of any major corporate or media website and you will find something that defies easy description. It is technically a footer. It functions as an archive, a legal document, a site map, a social media hub, a duplicate navigation system, a newsletter signup form, and an app download prompt, all simultaneously, across somewhere between eight and fifteen columns of links organized into categories that overlap in confusing ways.

"About" links to a page. "Company" also links to a page. "Who We Are" is a third link that may or may not go to the same page as one of the first two. There are links to press releases from 2019. There is a link to a careers page that currently has zero open positions. There is a link labeled "Resources" that goes to a blog. There is another link labeled "Blog" that also goes to the blog. Somewhere in this labyrinth is the link to unsubscribe from emails, and it will take you four minutes to find it.

The mega-footer exists because nobody ever deletes links. Every team at a company eventually demands their section be represented in the footer. The footer grows. No one prunes it. It becomes a sedimentary record of every internal political battle fought over website real estate for the past decade.

Dropdown Menus That Require Surgical Precision

Hover-activated dropdown menus are a classic of the hostile navigation genre. The mechanic is simple: move your mouse to a menu item, a dropdown appears, move your mouse diagonally toward a submenu option, the dropdown vanishes because your cursor briefly exited the hit area, start over.

This failure mode has been documented since approximately 2005. It has a known fix — a triangular hover detection zone that accounts for diagonal mouse movement, which developers have been writing about in tutorials for twenty years. Many websites have not implemented it. Many websites have implemented it and then had a redesign that broke it. Many websites have switched to click-activated dropdowns that now require two clicks to navigate where one used to suffice, because mobile compatibility was added as an afterthought.

The result is navigation that feels like it's testing you. Not in the gamified, here's-a-badge way. In the you-failed-and-must-begin-again way.

Search: The White Flag of Navigation Design

When navigation fails completely — and it does, routinely — users fall back on site search. Site search is, in theory, a safety net. In practice, it is frequently a broken promise.

Retail sites with thousands of products return search results that prioritize sponsored listings over relevance. Media sites return results sorted by date rather than quality, surfacing a 2011 article about your topic before the definitive 2024 piece on the same subject. Government and healthcare websites — the ones where finding the right information actually matters — routinely have search functions so poor that users abandon them for Google, type "site:agency.gov what I need," and get better results from the search engine than from the website's own internal tool.

At that point, the website's navigation has failed so completely that a third party has to compensate for it. The website is, functionally, not navigable on its own terms.

The Point Is to Keep You Clicking

Here is the uncomfortable truth that explains most of what's described above: session duration is a metric. Pageviews are a metric. The number of clicks a user makes before finding what they want is, from a certain analytics perspective, not a problem — it's engagement data. A user who clicks twelve times before converting has generated twelve pageviews. A user who clicks twice and converts has generated two.

You can see where the incentives point. Not consciously, not in a villain-twirling-mustache way, but in the diffuse, structural way that bad systems perpetuate themselves. Nobody in a product meeting says "let's make the navigation worse." But nobody in a product meeting is being evaluated on whether users found things easily. They're being evaluated on time-on-site, and time-on-site goes up when the path to the destination is longer.

The web was supposed to be a tool. Somewhere along the way, the tool decided you were the product, and it hid the exit behind a hamburger menu.