The Robservatory

Robservations on everything…

 

Why I hate the CNN redesign, quantified

Yesterday I ranted on Twitter about CNN’s redesign:

This led to an exchange with a CNN staffer, and a couple people saying “me too!” But it felt it a bit unfair to criticize without specific data. So this morning, I gathered the data, and can now quantify my distaste for the new design.

I compared the current CNN homepage to the latest available on the Internet Archive, calculating how the space was used for each version of the site. The results were eye opening in many ways.


tl;dr summary: The new CNN design displays half as many clickable stories in the same space, with an image that takes 20% of the available screen, and sucks down over 20% of my CPU just to display its home page. Read on for the gory details.

Note: This follow-up entry details my post-CNN news sources and reading methods.


Please leave feedback for CNN if you share my frustrations.
Thanks to Raymond for posting this address in the comments.

I opened a window that was 1,148 x 1,186 pixels in size, and loaded both the new and old CNN sites in tabs that window (with an ad blocker running, so I saw only content). I then grabbed screenshots, cropped to the visible page area, and started marking sections using color overlays in Acorn. I was most interested in what appears “above the fold,” that is, that can be seen without scrolling in either direction.

I split each version of the site into four different area definitions: Content, Images, Navigation, and Admin. (The split between the last two is somewhat arbitrary, but I used the same methodology on both versions of the site.)

Here’s how the two sites looked, mapped out into those area definitions (click either page for a much larger version).

Old Site New Site

Once the page was mapped out, I created a simple spreadsheet that calculated the area of each type of content, based on its pixel dimensions. Here’s how the two versions of the site compare:

OLD NEW CHANGE
Content areas 21% 22% +5%
Image areas 13% 28% +115%
Navigation areas 19% 10% -47%
Admin areas 9% 7% -22%
White space areas 38% 33% -13%

At first glance, this doesn’t look so bad—the content areas’ size is actually a bit larger than before, while the image areas’ growth has come from reductions in the navigation, admin, and white space areas. If that were the full story, I’d be fine—I still think it’s too much big imagery, but the content areas are actually larger than before.

Look beyond the summary, though, and things are really ugly:

OLD NEW CHANGE
Visible clickable stories 41 19 -54%
Largest image 7% 20% +186%
Average CPU usage 3% 20% +567%
Page length, pixels 3,770 10,452 +177%

The content areas—despite being larger than before—display less than half the previous number of stories. If you compare the screenshots above, you can see the cause: huge text with large gaps between story headlines. And then there’s that image, pushing everything down the page.

About that image…it’s now massive, sucking up a full 20% of the visible space on the page. 20% of 1.36 million pixels—that’s insane!

Why do we need to see such a massive image? “But an image is worth 1,000 words!” you say? Not when said image replaces words that used to lead to many stories; now the one massive image leads to but one story.

The other eye opener was the CPU usage; cycling amongst four of those large images (and providing a scrolling news ticker?) is apparently a hard thing to do. While the old site barely moved the CPU usage meter, the new site is consistently over 20% on my 2014 Core i7 Retina iMac—and that’s while it’s just sitting there; I’m not interacting with it in any way. If I were on a laptop, this kind of CPU usage would drive me crazy. 20% of my CPU to view a news page?

Finally, as you can see, the new page is nearly three times as long as the old page. That means lots of scrolling if you want to get to the bottom of the page (where, as it turns out, you can see yet more massive imagery). Ugh.

To summarize, the new CNN site (at least, the “use without scrolling” portion of the site) contains half the data as before, with an image that takes up nearly three times as much of the page. The site now takes 20% of the CPU on a brand-new Core i7 iMac just to display and sit, and it’s incredibly long, making it tedious to scroll through.

This is not what I would call a successful redesign. Pretty? Sure. Usable? No.

480 Comments

Add a Comment
  1. Hopefully whoever the 27-year old narcissist is that came up with this garbage while proclaiming “I KNOW WHAT THE PEOPLE WANT” has been knocked down a notch or two so they won’t ruin their next company’s website.

    1. I hate the new CNN site… too many pictures. And, it doesn’t fully load on my tablet. I get a message that CNN isn’t responding due to a long running script. No problems with any other sites. Try NBC News.

    2. Whole new CNN.com format is based on typical media fear mongering… giant black bold text, screaming headlines and overtly large imagery = fear… hoping to lure you into a panic.

  2. I tried, I really tried to use the new CNN design but I can’t find the stories that interest me anymore. Their change in font and font color makes it difficult for me to read. If it isn’t broken, why try to fix something that was working? I’m still looking for an alternative site to get my news. I’m using BBC and the Washington Post now. I can’t waste time on CNN trying to find where their hiding the news I want to read! Good Bye CNN! I’ll be happy to take anyone’s suggests for other online news sites to visit!

  3. I really hope CNN reads comments like mine… I have been watching CNN on line daily for over a decade and switched to BBC this week. The opening of the first page of CNN is a monster…….. I want to see articles not a filler photo….. I feel as if I am looking at a page through a pinhole, that the true page extends way beyond my computer screen… it is irritation…. not to mention.. all the photo changing when you try to move your mouse.. personally I have been bitching about CNN the past year prior to its remake…….. it was just too visual and even the written articles below the visual contant was often nothing more than a transcript of the nearly fact free video.
    I also noticed the past year that CNN has filled every corner with ads … butr back to the new look…… please CNN, please create a new site where you give news with the occasional human interest story…… please hire actual journalists…. on that note I am going to BBC to READ some news ( but BBC is also changing for the worse).

  4. for all ex-cnn users, try BBC… its presentation is similar to old nn site and there are actually written words to describe major events….. and appears to be written by “real journalists”. Note that up until this week I had been a daily CNN on line user for perhaps 15 years!!

    1. Exactly. I started feeling embarrassed that I was considering them my news source. Moving on too.

    1. I have used CNN daily for many years but have to agree with the masses here that the new design takes a step backwards. My frustration in no longer being able to see multiple news threads at a glance is my primary reason for feeling compelled to find another source for online news. I have occasionally checked in at CNN the last week or so to see if the site has been “fixed” but it until then, after all these years of multiple daily use, it is no longer my source for news. I now actually hesitate to even “check in” so as not to provide misleading data to CNN which could inadvertently suggest that my visit counts as a viable “hit” and thus, a positive toward the new design. In reality, my check-in is to see if the site has become readable again. If it hasn’t, I immediately switch to another news website to actually get the news. Hopefully, their analytics show this. This reeks of the “New Coke/Classic Coke” fiasco of years back.

  5. I am with you all the way. It is impossible to glance at my mobile device and see any specific article much less a concise listing of many news items from which I can make a selection. They clearly did not test the design on actual devices with actual users. I am leaving CNN, which has been my home page for 15 years. Very, very disappointing.

  6. By the way, BBC also looks more crowded now and the newspapers all went this way a while ago. Even NPR crowds its pages with pictures. If someone finds a reliable news outlet that actually provides condensed listings of headlines, please let everyone know.

    1. Same here. I think they did this in part to get rid of people like me (and many others) who would go in and point out all the mistruths, bias, and outright lies. May they crash and burn (figuratively of course).

  7. Yep I agree wi th the group. The new CNN format sucks big time. Being overseas on limited wifi and a new format that is bandwidth hungry. CNN you lost me as a viewer.

  8. This new web page makes my laptop screen feel like the little screen on my iPhone. No thank you. Now I’m shopping for a new online news source. I tried this for a week and I hate it.

  9. The new CNN web redesign is terrible. It has been getting progressively worse year after year. In January 2015 when they made the switch to a MONSTER home page with blazing IN YOUR FACE titles, CNN officially lost me as a viewer. I can’t say their uninformative bicker-like news videos were ever really that great anyway. Actually come to think of it, CNN is a horrid news site and I’m glad I no longer have to stare at advertisements cluttering my computer screen because I refuse to access their site…. just so bad in every respect (including the typos in the written news stories)! Horrid!!!!

  10. This article seems focused on the rewrite of cnn’s tablet presentation. I’d like to chime in that cnn’s new iPhone presentation is equally unusable. The various fonts, and embedded photos make navigation painful and make performance untenable on my 2 year old iPhone. No, I won’t be upgrading my phone just to view cnn’s new “enhanced” website. Maybe the site is designed for the iPhone 6+ but that ignores the millions of previously deployed phones that are still in use.

  11. Now the format completely matches the content – Garbage! Let’s face it, pictures are always more important when spreading propaganda. Good riddance to them and their new business partners in Dubai.

  12. I just googled “I hate the new CNN website” and came across this site. Funny to read everyone’s comments. The new design is so horrid I can’t even stay on their site more than 5 seconds. And I used to read their site every day.

  13. I tried. I really have tried to adjust to it.
    Like so many things in life, when change happens the first reflex is to dislike it, but with time it grows on you, and you eventually feel good about the changes made.
    Give it time I told myself.
    I just cannot get in the groove of the new site. $15 million? For that? Where do I apply to design a website? I may not know squat about website design, but that may work in my favor.
    Add CNN to the list of news sites such as those owned by Gannett that have made their sites insufferable.

    Oh, and on a side note, I miss watching the trolls in the comments sections during my lunch break. :-)

  14. It’s annoying on a desktop and practically useless on mobile. Used to be my go-to news source because of its simplicity. Site design needs to be cut up with Occam’s razor.

  15. What this says is that the web design community is one big echo chamber. The site hits many buzzwords… it’s MOBILE FIRST and yada yada yada. No doubt there are many paradigms that are important to have on a website if you want to impress other designers. Not many paradigms though that seem to resonate with users that want to find a place to read news.

    Design always seems to be about designers and hitting checklists that will impress them. Meanwhile Google proved this all the first time around when all of the designers working so hard at the Yahoo and Altavista sites got blown away by Google. Why did that happen though those other sites had so much DESIGN and thought about the DESIGN AND THE DESIGN and DESIGNY DESIGN DESIGN going into it? Google had nothing. Just a box, type into it and get results.

    Because Google just had better utility. And utility trumps all this DESIGN, and in fact, the DESIGN, trying to cover all the checklist items (I saw one reviewer break down the CNN design in this way, “I can see that they went with a 16 column grid as the base blah blah blah”…) gets in the way of giving the user information. Other people saying it’s BOLD, it has GREAT USE OF COLOR, it has all this stuff, but you know what it does terribly?

    Telling people stories. This is why they come to CNN. To be told stories. They can’t find them. It’s harder to see what is available to access. The designers are standing there, between the user and the story, and twerking and saying, “Hey, look at me, look at me, look at me.” They are not stepping back and fading away and letting the story rise up front and center. This is where people have failed, so many armchair DESIGNERS saying that this was Apple influenced, but what Apple has been trying to do is to get out from in the middle between the user and the information. This kind of site is like being yelled at in a hurricane of VERY LARGE FONTS. Sites that break down and run slowly and have DESIGN that interferes with basic functionality in order to meet the checklist items to impress other designers fail at their basic and most essential tasks.

    So sad that so many websites are ending up with this. Vertically scrolling for 17 nautical miles to get to the bottom of the page. After three, blocky, halting, chunky jumps down the page, I give up. Please, give me something simple and clean with adult fonts, not for 6 year olds.

  16. have not been able to load site for three days. keep getting some bs message about long running script .cnn website ranks right up there with isil.

  17. BBC.com nails it – used it for the entire Je Suis Charlie coverage, and it rocks. Only went to CNN when I scouted all other news outlets to see if related video had surfaced. Did’t miss CNN at all. I’m a BBC user from now on!

  18. CNN’s web site redesign is terrible and looks like an amateur came up with the redesign.
    That redesign cost CNN $15 million!? Heh heh heh! Money not-well spent! I’d request a refund.
    The author of this article described and analyzed the problem perfectly, in my opinion.
    At this point, I’ve simply stopped using CNN’s web site and now use the FOX NEWS web site instead.

    1. Unfortunately I am willing to bet the “Designer” responsible took a business of design class so they had a contract that CNN agreed to which stated regardless of end result the designer keeps X (a high percentage of what they are paid) with no refund available or if any a very minor one. Fox will follow in their footsteps soon so you are better off going bbc sooner rather than later.

  19. i agree. the new format is horrible. i tried using it and gave up. i hope they go back to the old format. images are too BIG, news stories hard to find and site is difficult to navigate.

  20. A designer’s dream…user’s nightmare. As a designer for many years I fear that the new generation of designers has forgotten the keyword “usability”. CNN got sold a bill of goods. Like others, I’m switching.

  21. What disappointment when a much touted redesign makes a mess of my go-to source of news! This disaster takes forever to present itself on my iPad and then forces me to try and sort out the stories from the fluff. I’m off to search for something as simple as the old site. I so wish CNN had their 15 million back!

  22. My perspective is this new site is horrible, the layout itself is just a mess and usability is far too difficult. I know many websites are now in love with the huge images and videos they can use but the question isn’t if you can use it but if you should. Then again I’ve had to try to explain this to the sorts of people who probably designed this nightmare, and got laughed at.

    I really enjoyed the old cnn website, it had a very easy to navigate interface compared to others and most importantly you could choose between (and see the difference between) video and text based stories. Now it seems most of the stories are video based and the text bits look like a grade school wrote them up or they are just tiny snippets. I have seen the same changes on other sites as well, I understand that the new generation of designers has a love (addiction) to heavy image usage when making a website or layout but this is ridiculous. Good thing I already had the bbc on standby.

  23. CNN, really? The new web page isn’t very information friendly. If I had a choice in how the stories were presented, I’d chose the prior design. I want stories / links, not huge pictures. I have a 24″ monitor so I’m not starved for screen space. You know, it might be time to select another go-to news page.

  24. The new CNN site is just terrible. It makes it difficult to read the news. I will be reading the news somewhere else.

  25. I can’t even get it to respond quickly. It loads and loads and loads.
    I just want a list of stories I can click on quickly and read at work on my break. Fast. I don’t want the video. I want to read the story. Don’t these people have jobs?

    I have zero use for huge images that pretty much advertise that I am not on task . . . I knew they’d mess up a good thing eventually just like the New Coke debacle.

    Guess what ? Reuters is the same format we all preferred! GO there! Also, they are don’t cover all the Hollywood crap which isn’t even news in my book. Please Reuters, don’t change. All our local stations have gone to the same giant photo and ads format. It’s a nightmare.

  26. Agree. CNN went the same way as MSNBC – used to be good, now its crap. Dropped MSNBC went they went to a all pictures, no news or content format. I’d rate this “upgrade” as an “epic failure” – change for the sake change but nothing good in the design, execution or rollout. Reminds me of the MS Office Ribbon Bar. Dropped CNN from my PC and mobile device and was a daily visitor, but not any more.

  27. So…I used to go to CNN.com on my mobile phone *all* the time, but I have to seriously wonder how much extra data this site now forces my phone to suck down every time I simply load the main page when not on WiFi, which for me is fairly frequent. There are huge videos and pictures EVERYWHERE, and every single actual story link only sends me to another page FULL of pictures. I sincerely doubt I’d be able to frequent this site even if I wanted to (which I don’t now) without paying enormous overage costs on my bill. How can CNN possibly claim that mobile users were one of their primary considerations in their redesign when they’ve made every single page a data explosion? I’m beyond ticked off.

    CNN needs to add a “classic view” option that we can toggle — PERMANENTLY — or I’m never coming back to that site ever again.

  28. The typeface looks hijacked from a 1984 computer. Hard to read, harder to understand that particular design choice. Layout is a clunker. What warranted change in the first place?

  29. And I thought I was the only one puzzled at the logic of CNN’s redesign. I can’t navigate on my iPhone 4, and on my desktop I feel like I’m looking at a picture book. I’m choosing a new news source!

  30. I hate the new CNN home page. I’m normally open to try new designs but this one is too busy with pictures. It takes to much scrolling around to find the articles that I want to read. I’m changing my news source.

  31. CNN website redesign is a FAIL. CNN TV channel is a FAIL. I feel sorry for Wolf as he’s the only serious newscaster. The joking around (Robin Meade) and pop-spinned news (Anderson Cooper) and the editorializing (Don Lemon) are an embarrassment to serious journalism (sorry Wolf). CNN is just another version of Entertainment Tonight and is contributing to the stupidfication of our nation.

  32. The problem for me is that the home page is no longer a summary page. In order to see all the categories, I have to scroll from one page to the next. The old design had boxes at the bottom for each category. That’s what I want: a news site with a concise summary page, like the NY Times and the Washington Post currently have.

    Has anyone noticed the redesigned Weather.com site? What was once a wonderfully concise and straight-forward site is now a mess not dissimilar from the new CNN site.

  33. The new layout is awful. If it isn’t chanf=ged back, Yahoo will be my new home page. I wasn’t to see news, MY weater firsr, the stockmarket & then I’ll pick the rest. I can’t find anyway to arrange my page to my needs

  34. I’ve used CNN as my homepage since the 90’s, and I’ve read it often. But the redesign is just terrible. Think back to a horribly over-designed car, say the Pontiac Aztek. Just because it was new, didn’t make it better (it was an eyesore). But apparently, web designers think that they have to prove their worth by changing a web page that was easy to use — into a monster with scrolling headlines, pop-up texts, and giant photos with less news links. Please CNN, “New Coke” was worse than the “old Coke”, and the new CNN is far worse than the old CNN. I’m sad to say that after 15+ years, I’m switching news sources. Farewell CNN, it was great while it lasted.

  35. I used to go to CNN daily, mostly for comment section trolling, but ever since the site redesign I simply can’t stand it. The dumbest news network just got dumber.

  36. My god, I am not the only one. This redesign is so freaking bad. The NUMBER 1 reason I went to cnn was the layout. It was easy to view multiple stories, is to go in and out and my screen was not cluttered. Now, it is cluttered and stressful to even look at it. You would have thought they would have screen tested the site and obtained user feedback first.

    I need a new site to use. BBC.COM is bloated. For now I am using news.google.com but don’t really like the way it feels either.

  37. I have an issue with this site and CNN.com. I have left 2 long write ups. Both times the white about rob contact rob rss feed ends up over layed on the white area of comment box! Both times I accidently touch screen where the invisible like links are it goes to new page comment gone!!!
    Anyways CNN.com used to be a site I went to regularly. Like several times a day. It would load page super fast I would do a quick scroll US news World News Politics Tech etc all with like 4 to 5 top story links underneath and usually one nice sized picture for each section. My phone screen is about 2.5 x 4 I guess. Galaxy model. So it was easy to navigate read etc. Then I had a nightmare well actually I was awake but I went to CNN.com few days ago and almost puked. I thought you have got to be kidding me!!! Who in the hell screwed my news site up????? Its awwwwfulllllllll.
    I do not like looking at websites with dark glossy black backgrounds with ultra white letters! I just left cnn.com. Theres a huge ass billboard sized picture and white letters. At first the damn title took up 90% of my phone screen. Then after about 10 seconds seem to adjust font size from huge to very large. Still about 60% of screen. The picture is huge and looks like it loaded on page over lapping other stuff. The big breaking news area at top is also very annoying. I feel like Im viewing it on dial up internet. Why did CNN change the website??? Until they change it to something better Im going to alternative sites that do not hurt my brain and eyeballs.

      1. sad thing is regardless of outcry and bad feedback cnn will continue with this because the person in charge won’t admit they screwed up so badly.

    1. i’d say no. the powers in charge won’t want to admit they made a mistake. besides, with the new ad scrolling etc. someone could easily skew the metrics to make it look like viewers haven’t been lost etc.

  38. I agree completely and have abandoned what was once my go to website for news, politics, money, business, etc. Old design was nearly perfect for scanning what’s happening quickly efficiently and catching up with the world after long day. New design stinks. Scroll scroll scroll. Too much time, headache frustration. I quit them cold turkey. Sadly many are going to this frustrating new design. AmEx Blue to name one. Got to scroll click all over to get simple details on my account, none of themon one summary page. I’m firing them too.

  39. It Sucks big time. I spend a tenth as much time on the site as I used to. The new borders and banners, as well as the moving text might be fine on a 50 inch TV, but have zero appeal on a computer screen for those of us who simply want to read the news. All the crap leaves a screen without space to read an article.

    CNN already had a TV channel, too bad they screwed up their website with so much garbage. They must have been expecting the negative feedback as they didn’t even leave a feedback button.

  40. I used to check CNN every day but I’m not so sure anymore. I normally use my phone to read news and this new layout and design could not be worse for that, I kind of new I wasn’t the only one so I Google’d it out of curiosity and found this. Didn’t they think about it beforehand? Most people use their phones more than a laptop or anything with a huge screen, mobiles are moving away from huge, bold text/pictures/effects, new design is all about flat and clean, not only it makes the experience better with navigation but also it saves memory and CPU usage, therefore battery. Bigger and bold is not always better; in this case Less distraction is More user-friendly.

  41. Just as well. Candy Nugget News, Communist News Network…. Setup and run by the CIA. The NEWS is buried in political propaganda. There has not been any REAL “network” news in decades, Im sorry your all blind.

  42. Well researched article. Cnn.com has been my go to for years. I’m talking 20 times a day. Now it freezes up my (new) device and I hate the new fonts and format. I gave up the website days ago and I am now trying out msn and bbc.

  43. CNN –the last two updates to their format have been ghastly…..they’re designed for people who don’t read–at all–just picture watchers. Moving on to BBC/Reuters/The Guardian.

Leave a Reply to Robert McKee Cancel reply

The Robservatory © 2018 • Privacy Policy Built from the Frontier theme