4 Oct 2014

Messing Up the Web

(Disclosure: I work for Google, but these are my personal views.)

More and more web sites are adopting user-unfriendly designs, such as headers that lock to the top of the screen as you scroll. This used to be reserved for old-media newspaper sites, but even tech sites like Ars Technica seem to have caught on:

(Please Cmd-click to open the screenshot at full size.)

And The Verge:

Notice how it’s blocking the photo I wanted to see.

Even blogs like Rackspace:

This is unfriendly because the locked header results in a smaller viewport for me to actually see the content. It makes for a claustrophobic reading experience, and the header covers the content I wanted to read. It also distracts.

Notice in the Rackspace example the crap on the right in addition to the crap at the top (in the locked header).

And if you thought that was bad, here’s another screenshot from The Verge:

Again, cmd-click the screenshot to see it at full size. Notice that this page has so much crap all over the viewport, every inch of it, that there’s no room for the actual text of the article above the fold. Not even the first line of it. Notice the nine layers of headers and crap on the top, which I’ve annotated in cyan in the left margin.

Maybe sites think that they more they shove in my face, the more I’ll read. In reality, I’ll get distracted and read less, saving the page to Instapaper to read in a readable manner. That gets rid of the branding of the site, and the opportunity to click on links, and basically extracts the content from the site and into Instapaper. That’s not good for the site, but by going overboard with these annoyances, they’re hurting themselves. 

If a site has a locked header [1], I usually save it to Instapaper and close the tab. Or if it has crap on the left or right that stays on screen rather than scrolling away. Or, even if it scrolls with the page, if there’s a lot of it. Or anything that animates anywhere on the page. Or content that can begin only below the fold because of you going overboard with headers.

Play any of these tricks, and I’ll read your article in Instapaper. Or ask myself whether I’m really benefiting from reading your site and try to cut back.

Notice also the subject of the article in the screenshot, which is an indication of the kind of dumb, crude stuff The Verge often publishes nowadays. It’s a reflection of the worst part of tech culture.

Here’s the deal: let me read the article from beginning to end without crap that locks at the top, left or right of the article. Whatever is on the right should scroll, and it should be no more than a few inches high. Let me focus on the article. And then, when I’ve read all the way to the end, you can offer me related articles that I might consider reading. If I read many great articles on your site, I’ll develop a positive feeling towards your site. But if you play these hostile tricks on me, you’re devaluing your own content, and I’ll read the article in Instapaper, or not at all. And end up with a negative opinion of you guys rather than a positive one. I’ll end up thinking of your site as crappy rather than useful. Is that the feeling you want to create?

Let’s not kill the web via these reader-hostile designs.

[1] To say nothing of two headers that lock at the top.

No comments:

Post a Comment