The original title to this post was “Everything New, Sucks”, but I thought I’d be nicer as to not take a complete 180 considering my last post. My New Year resolution to be less grumpy is looking shakier by the day.
Beyoncé style = Whitney code?
I’m truly dismayed how some of the seemingly beautiful layouts are actually courtesy of HTML, CSS and JavaScript that look like the residue in a crack pipe. If the front page of your site is drafting more hobbled scripts than the average backend dashboard, then you’ve got problems son. It’s almost like no one really cares how it’s all put together as long as it looks good.
I know minimalism is the new in-thing in web design, almost to the point of being outright confusing or silly, but can we at least extend the sentiment to the scaffolding too? Or else, it kinda seems stupid, you know, hypocritical.
I also come across a lot of designers who quite loudly espouse their work is only meant for “modern” browsers and will actively block access from older browsers rather than encouraging them to upgrade or change them. The excuse is that older browsers “break” their carefully carved patchwork of copypasta.
“Break”?
If it makes your site unusable, go back and fix your work. It’s called pride in workmanship, you misanthropic troglodytes!
I know its fashionable to rag on the browser, but people aren’t going to change their browsers because your work doesn’t work on them. Deal with it.
Can I read the text? Can I see the images? Can I still “use” the site? Does your site have actual “content” that I can still consume? MOST websites will work in older browsers, even HTML 5 ones, once you stop giving it meaningless improvements, and “breaking” is acceptable as long as the content is still accessible. If you absolutely have to use the new functionality for something, then at least use Modernizr to make it usable on older browsers.
Which brings me to…
The HTML 5 Bug
Now slightly more infectious and deadly than H5N1. I’ve got nothing against it, but it seems it’s being abused by the same mindset that made the bad ol’ days of HTML 4 almost as unbearable. The fact that HTML 5 is new and hip doesn’t mean you stick every new tag in your design inappropriately and call it progress. The draft isn’t even finished yet and I’m already seeing designers making ridiculous uses of the footer, header and map tags.
I.E. I’ve seen <map> still being used being used as a navigation bar instead of… and here’s a shock… the bloody <nav> tag. I’m sorry, is this 1999? Ah, but it’s OK, because the rest of the page is HTML 5.
<map> Is meant to be used for image maps and can designate clickable areas on an image for page interaction like photos identifying people. I can accept that HTML 5 is here to stay and there’s nothing that can be done about it, but at least learn to use it properly!
I wouldn’t be this upset if it weren’t for the fact that the above abomination was the work of a “professional web designer”. Well, I’m not a professional web designer and even I know this. And if you still can’t get it, well then maybe you should be doing something else… like making soap.
Quit scripting your sites to death
There’s a post by Jim Dalrymple made last month that really puts into perspective how much rubbish is loaded asynchronously after the content itself has arrived. All the extra bloat just bogs down the browser until everything else arrives so even if the content is there, you can’t scroll to read it.
The real kicker is that the biggest load on that list was BGR and that’s a “minimal” layout. “The Biggest Letters in Tech”? Apparently.
And most of these aren’t even useful, but rubbish like Avalanche meant to drive traffic to content devoid of content. The rest are poorly engineered statistics widgets that have better use as browser stress tests than gathering user data on a production site. Or are ad widgets. These scripts are massively inefficient because they’re doing a lot of server-side work client-side in an effort to offload some of the burden on their own infastructure.
JavaScript isn’t C++ so quit treating it like so.
And what’s with designers and content managers not caring about what they include in the HTML sent to the visitor?
I checked the source on CNN.com and found the following buried in an HTML comment around line 200 :
Last snapshot: 12/12/2011 11:30 AM
IF auto generated include above stops working, uncomment the html below and manually update at hourly intervals:
<li class="pmNsStory">
<div class="pmNsHeadline"><a href="http://www.cnn.com/2011/12/11/opinion/graham-debate-romney/index.html">Opinion: How Romney blew it</a></div>
<div class="pmNsPopularity"><div class="pmNsPopImage" style="width: 98%"></div></div>
</li>
<li class="pmNsStory">
<div class="pmNsHeadline"><a href="http://www.cnn.com/2011/12/11/sport/ryan-braun-drug/index.html">Spokesman: Braun will be 'exonerated'</a></div>
<div class="pmNsPopularity"><div class="pmNsPopImage" style="width: 69%"></div></div>
</li>
<li class="pmNsStory">
<div class="pmNsHeadline"><a href="http://www.cnn.com/2011/12/11/us/pennsylvania-paterno-hospital/index.html">Panama's ex-ruler Noriega returns home</a></div>
<div class="pmNsPopularity"><div class="pmNsPopImage" style="width: 67%"></div></div>
</li>
<li class="pmNsStory">
<div class="pmNsHeadline"><a href="http://www.cnn.com/2011/12/12/world/meast/syria-unrest/index.html">Ex-Penn State coach Paterno hospitalized</a></div>
<div class="pmNsPopularity"><div class="pmNsPopImage" style="width: 59%"></div></div>
</li>
… Really?
And just for kicks, I went to MSNBC.com and discovered the actual “content” starts at line 716 :
And that's not even the real beginning.
Even after turning off word wrap, the first third of the source is nothing but inline JavaScript and CSS and so is a full half of the entire source.
Mind you, both are meant to be “minimal” designs far removed from their older, uglier, “less efficient”, versions.
I haven’t checked the mobile versions of these, but considering most people pay for their data plans by the MB, even if they’re half the size of their desktop counterparts, the designers of these and other bloated sites are doing a huge disservice to the very people who are paying their bills.
Any Browser is Dead. Long live bloat!
When did it become fashionable — respectable even — to design websites so poorly and with so much extra rubbish that it would be unusable? Forget people with special needs, I mean the average Joe with a decent computer, modern browser and a good internet connection would be in imminent danger of a face-full of glass shards or plastic splinters if he even dares to visit some of these sites.
The common excuse is that, well, you have to make sure that the site’s added features need a lot of capabilities that aren’t available on older browsers. I have news for you: The web has been around for longer than some of you designers have been alive and the core use is still the same. To consume content.
The vast majority of effort on any site should be on the backend. The core architecture, the security, the control panel, the security, the database, the security. Sort these out first and you will find yourself spending less time needing to make UI improvements. A good workflow will encourage a good UI.
This page intentionally left ugly 