Dickbars and Other Readability Excrement

John Gruber in Medium and the Scourge of Persistent Sharing Dickbars:

Medium seems to continue to grow in popularity as a publishing platform, and as it does, I’m growing more and more frustrated by their on-screen “engagement” turds. Every Medium site displays an on-screen “sharing” bar that covers the actual content I want to read. This is particularly annoying on the phone, where screen real estate is most precious. Now on iOS they’ve added an “Open in App” button that literally makes the last 1–2 lines of content on screen unreadable. To me these things are as distracting as having someone wave their hand in front of my face while I try to read…

This is now a very common design pattern for mobile web layouts. Medium is far from alone. It’s getting hard to find a news site that doesn’t put a persistent sharing dickbar down there.

I had quite forgotten about the elegantly evocative appellation Mr. Gruber coined lo these many moons ago: the dickbar.

I’ve periodically collected screenshots of especially egregious examples of readability excrement over the last couple of years. For this post, I’ve cropped out OS or app interface cruft to show only content. Or should that be “content”?

While Gruber’s recent rant about the dickbar was triggered by Medium’s mobile site, which is supposedly mobile-friendly and well-designed — and which should presumably strive to do better than the norm — a similar set of problems has been at least as bad on desktop versions of sites for a long time.

 Wall Street Journal, Mobile Site

Wall Street Journal, Mobile Site

On mobile, or on desktop websites, financial news usually seems to be among the worst offenders.

The Wall Street Journal wants me to whitelist their site and not use a blocker, and in return they generously give me about 3/4 of my screen with which to read their articles. It’s like trying to read through the slit in the top of a Kleenex box.

How about the generositiousness[1] of of Fortune, who use a vastly larger desktop display to spray ad bukkake in your face while serving up a content column that’s basically the same width as my ancient iPhone 5s. Actually, it’s more readable on an iPhone since more than 3–4 words a line fit on the screen in mobile view.

 Fortune’s Ad B ukkake .

Fortune’s Ad Bukkake.

Tech sites are also terrible. Cnet is basically unusable.

 Cnet, y u no lt mi c?

Cnet, y u no lt mi c?

Where the #^¢* is the actual content? You can’t even read the full headline covering the absurdly large “hero” image without a host of popups, pop-ins, and other “look at meeee!!11!eleven!” elements partially covering it. Add a “bonus” autoplay video for flavor. Fun!

Here’s a slideshow on Cnet.

 Ultimate(?) iPhone Quiz

Ultimate(?) iPhone Quiz

Quick, how do you advance the slideshow? The forward arrow didn’t appear for several seconds, then worked intermittently, failing about one time every five clicks, and the thumbnail images were unresponsive for several more seconds when I accessed the site.

And how about that sidebar? Wait, sidebar? You thought that was an ad section? Yeah, that’s what I thought too. It’s supposed to be the caption. Oh, you can’t read the caption? Let’s just scroll that a bit… Except, scrolling within that bar is so broken as to be completely useless.

Don’t believe me, try it yourself. Shitshow doesn’t begin to cover it. I took those screenshots about two years ago and have avoided ever going back to Cnet for any reason since.

Surprisingly, one of the really bad websites I found was the Cambridge Dictionary.

 Cambridge, Just a Hint: Dictionaries Contain  Words.

Cambridge, Just a Hint: Dictionaries Contain Words.

Dickbar + persistent navigation toolbar + share button turds + ads + ads + ads + provide your email for spam[2] + a topper of the “required” EU cookies notice = a shitty user experience.

Even on an “unlimited” data plan, I’ve run into rate limits before the end of a month when I’m doing nothing more data intensive than using my iPhone normally and occasionally tethering for data access for work when I don’t have wi-fi access. Rate limits for my plan on DoCoMo kick in at 7GB, and I don’t watch goddamn YouTube tethered through my phone.

When tethered, besides web access, I sync primarily text files and occasional images through Dropbox, and Numbers or Pages documents through iCloud. I’m pretty damn sure it’s not syncing my actual work that’s eating up data.

Publishers, if you want me to stop running an ad blocker, stop doing shit like this:

 Wait, How Many #^¢*ing Scripts Is That‽

Wait, How Many #^¢*ing Scripts Is That‽

  1. Don’t tell me this isn’t a real word. It’s a perfectly cromulent word. In fact I made it up just now to explain the truthiness of my argument. So there.  ↩

  2. Oh please, oh please!  ↩