Work to be done
Smashing Magazine just launched their newly redesigned site. Personally, I think it looks pretty great. The ads are a little distracting perhaps, but other than that, the side content mostly gets out of the way leading to a pleasant reading experience.
And of course, it’s responsive. That adds another level of loveliness. The navigation adjustments in particular are kind of interesting to watch. My favorite layout is the last one to kick in before you hit 1020px. It’s clean, easy to read, and the ads are not yet there.
But….
There’s a catch here. For as lovely as the site looks, there’s a lot going wrong from a technical perspective.
Performance
For starters, the size. Even on my phone, the site weighs in at a massive 1.4MB. A large part of the issue is that those ads, the same ones that don’t display below 1020px, are still being requested and loaded on smaller resolutions. They’re just being hidden with a little touch of ‘display:none’.
When I tested, the site also made about 90 requests. That’s an awful big drag on page load time—no matter what device or network you are viewing the site on.
Advertising
Another potential concern is the advertising. I’m not sure exactly on Smashing Magazine’s business model, prices, etc., so it’s hard to criticize their advertising efforts too much. I do find it interesting that their ads are all hidden below 1020px though, leaving their ads visible to only a portion of their audience.
One reason for this may be the high number of ads they display. In their sidebar, I count 16 ads. They are distracting at large resolutions, so I imagine they got to be very overwhelming on smaller resolutions. Having to re-orchestrate 16 ads onto a small screen layout would be a very tall task.
Again, we’re talking business model here so there’s obviously much more at play than what an outside perspective grants, but I would love to see fewer ads. Not just for Smashing Magazine, but across all sites. Less ad spaces, more money per slot. (Roger Black talks about this in detail in his posts The holy grail, part 1 and part 2.) The result would be three key improvements:
- You would have a lighter, cleaner experience.
- The ads would provide more value to the advertisers—less ads competing for eyeballs per page.
- The smaller number of ads would be much easier to manage across resolutions.
Bigger picture
Now, having said all that, I could be guilty of premature condemnation. Perhaps this is the interim solution and a fix to these issues (performance in particular) is forthcoming.
Jason Grigsby put it nicely in two tweets:
When I have guests and don’t have time to clean, I shove things in a closet. No biggee. Everyone does it. But the house isn’t really clean.
The key is following through and cleaning the closet as well. Let’s hope others are better at it than I am at home. :-)
Of course he’s right. In fact, I have a few messy closets myself. (Both literally and metaphorically.)
And I don’t mean to pick on Smashing Magazine. They are far from the only site making these kinds of mistakes on the technical side of things and from a business perspective, the discussion about how to handle advertising is far from being resolved. And again, from a visual perspective I think they did an awful lot of things right.
We simply need to ensure that the discussion broadens. Responsive design is a fantastic approach, one that brings us closer to taking advantage of the inherent flexibility of the web. But simply being responsive is not the destination. To maximize the potential of a responsive approach, we need to focus not only on the visual components, but on the technical execution and business ramifications as well.
7 Smart Things Were Said
Wonderful post Timothy Kadlec.
Great job framing the conversation in a constructive way. I think viewing responsive design as a journey and not a destination is absolutely great. We absolutely need to continue the conversation and help more people realize this.
And I for one think it’s time for all of us to come out of the closet.
haha.
Looks like a lot of that pagesize comes from font files and large article images. If they implemented some sort of just-in-time image loading script as the viewport moves down, that would probably help a lot.
Dear Timothy,
Thank you very much for your very thoughtful critique. We will certainly address the size issue on mobile: actually, some things are already optimized, but I agree that we aren’t quite there yet.
In terms of advertising, unfortunately what works in theory doesn’t quite work in practice. At least it didn’t work out in our case. Also, at some point we need to carefully consider risk management for the ad revenue stream as well as our history with our advertising partners.
There are many changes to be done, and we are going to work hard over the next days to introduce further improvements to Smashing Magazine.
Ads with a mix of smaller images and text possibly? Although, even the thought of that – with the amount there are currently – makes the eyes squint!
Pity they couldn’t get less ads, and make them more prominent – like monthly sponsors. Would be great brand awareness exercise for those brands that could afford it.
Tech glitches aside, it looks great, nice job from @elliotjaystocks
Very constructively put, Tim. It doesn’t seem like it’s very often that someone puts as much respectful thought in their criticisms of other’s work.
I agree with you on all points, and I do wonder why the decision to turn on the redesign before it’s fully “tuned”. That said, I totally understand pushing out a design thats 90% complete. Sometimes you just want to get it out there and have the feedback/criticism/whatever from the rest of the community. Wasn’t it just a couple months ago that Gruber spoke out about The Next Web’s load size, something like 4.5mb? Since, they pushed that down closer to 1mb, a HUGE improvement.
I’m sure Vitaly and team will incrementally clean the closet of their baby. Also, beautiful work by @ellioyjaystocks.
Thanks for all the feedback and discussion guys!
@Neal: Some lazy-loading of images, and sidebar content for that matter, would certainly help.
@Vitaly: Thanks for the insight into the advertising decisions! I know there are a LOT of variables when it comes to making business decisions like that, and it’s never as easy as it sounds on paper.
@Todd: I’ve chatted with Vitaly a little bit, and I think it’s safe to say that you can expect to see a sizable improvement in Smashing Magazine’s performance as well. Sounds like the closet will get a good cleaning. :)
What's On Your Mind?
I will not tell anyone your email. Pinky swear.