homepage Welcome to WebmasterWorld Guest from 54.226.180.223
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderator: open

CSS Forum

    
Big Players Start to Move to CSS
espn.com
gethan




msg:1195084
 2:08 am on Apr 3, 2003 (gmt 0)

ESPN.com moved to a css based design recently, I found this interview on devedge.netscape.com...

[devedge.netscape.com...]

It's really worth a read... issues like: the benefits of the new design, selling management on the move, browser testing, the ethics of upgrade requirements are covered.

With around a billion page views per month ...
The Savings Add Up

* Page reduction (est.): 50KB
* Page views/day: 40,000,000
* Projected bandwidth savings:
o 2 terabytes/day
o 61 terabytes/month
o 730 terabytes/year

aside: looking at the source of ESPN they could easily save another couple of 1000 terabytes again :)

When we saw that only 2% of our users were not equipped with standards-compliant browsers, the decision was a relative slam dunk.

The first important part of this statistic is that the 2% number is only going to go down.

Ok... no more quotes - read the article - full of really useful information on an issue that a lot of us will be facing soon.

 

grahamstewart




msg:1195085
 2:14 am on Apr 3, 2003 (gmt 0)

Good news indeed - hopefully when those remaining 2% find they can no longer view major websites like espn as they are supposed to then they will finally get with the program and upgrade their browsers.

msr986




msg:1195086
 2:44 am on Apr 3, 2003 (gmt 0)

*ducking from the possible outcry*

The best part about espn's upgrade to css is that they have essentially dropped support for NN4.x. If more big players did this, it would finally kill off NN4.x.

grahamstewart




msg:1195087
 3:12 am on Apr 3, 2003 (gmt 0)

Yeeeugh... dont look at their source code though..

Someone should really tell them about external javascripts (more bandwidth savings!)

Plus they use absolute positioning on everything.

Standards purists always recommend that you don't design with pixel precision, but we have done just that... with no code forking, no alternate stylesheets, and no box model hacks.

Woo-hoo - good for you - that'll be why the site runs off the side of the browser when I resize the window then.

And the W3C validator currently shows 288 errors [validator.w3.org] in their page.

He says..

Telling me my site needs to validate in order to be standards-compliant is like telling me I need a flag in my lawn to call myself an American. For a simple, small, text-heavy site like a blog, validation may come relatively easily, but when you have a site like ours which dynamically writes out a lot of content, uses third-party statistical tracking, makes liberal use of Flash, and offers complex and flexible advertising modules, validation is simply a pie in the sky.

Hmmm.. perhaps not such a great advert for CSS after all then.

bcolflesh




msg:1195088
 3:18 am on Apr 3, 2003 (gmt 0)

Telling me my site needs to validate in order to be standards-compliant is like telling me I need a flag in my lawn to call myself an American. For a simple, small, text-heavy site like a blog, validation may come relatively easily, but when you have a site like ours which dynamically writes out a lot of content, uses third-party statistical tracking, makes liberal use of Flash, and offers complex and flexible advertising modules, validation is simply a pie in the sky.

Translated:

I couldn't do it.

;)

Regards,
Brent

gethan




msg:1195089
 3:34 am on Apr 3, 2003 (gmt 0)

> Someone should really tell them about external javascripts (more bandwidth savings!)

Exactly what I was referring to with the aside comment ;)
--

I know the design isn't perfect, it isn't fully compliant blahdy, blah. But the thing is that it is a really big site moving from tables to css - and the article will give us some really good examples to use when we are in the situation of making the same recommendations to our bosses or clients.

Brett_Tabke




msg:1195090
 9:27 am on Apr 3, 2003 (gmt 0)

<.02>
ESPN has historically been one of the lowest quality HTML sites on the web. It has regularly had problems with most browsers not designed in redmond. It was barely usable 99-2001 in netscape and was not usable in Opera. Now that they have done the big sellout to ms, it is probably going to get worse not better. I can't think of any other big site that has as low quality code as ESPN. Their current homepage has in excess of 200 errors with 20-30 of them non-trivial. Using espn as an example for anything related to development, is an example in how not to code.
<.02>

MWpro




msg:1195091
 3:50 am on Apr 4, 2003 (gmt 0)

I love how they shut out netscape 4 users, it totally made my day :-)

Hopefully this trend will catch on and eventually netscape 4 will be phased out, since netscape obviously isn't taking that responsibility on themselves.

jimbeetle




msg:1195092
 4:26 am on Apr 4, 2003 (gmt 0)

I'm in the "thinking" phase of planning a new CSS site and this is a great example. It's more than 67K with only a couple of hundred words of real content, and it's just about impossible to find where that content actually starts.

My model.

gph




msg:1195093
 5:12 am on Apr 5, 2003 (gmt 0)

It causes fatal errors in Opera 7 Win98 with JS enabled on page load. I'm guessing IE stuff that Opera can't handle. Looks pretty good with JS disabled.

This is also, IMO, a big step forward.

if (!document.getElementById) { top.location.replace('http://espn.go.com/browserupgrade.html');
}

Brett_Tabke




msg:1195094
 8:24 am on Apr 8, 2003 (gmt 0)

There is 65k of code, 2k of comments, 10k of css, and I don't know how much js because they have no caching on. Just the frivolous class and div statements are 3k alone. There are over 30 non-trival code errors and broken browser sniffing that doesn't work properly.

This is an example of quality coding? Slow loading incompatible pages that force feed the user?

There is but one - and only one reason ESPN.com is a major site - it is because of the offline pull factor of television. If this site had to stand on it's own legs, the decisions about how to build the site would be radically different. Afterall, they have what amounts to a captive audience.

SuzyUK




msg:1195095
 12:08 am on Apr 9, 2003 (gmt 0)

The "big players" are trying their best..probably too hard..but they have a mammoth task.. I wouldn't like to put myself under the kind of microscope they do.. most of us just keep working at something until it works for us, and if it's good enough it'll get recognised (or at least ranked higher ;)) if not, no one notices and, we get on with trying to improve it...

Brett wrote the thread on how to optimise, but from I'm learning that there is no single way that is correct.

CSS offers a way to dramtically reduce the page size,(yes after the initial page load before everyone starts, do you remember those tables? If not try the control panel page of this site - not a criticism just an observation - for an example, no matter how many times it's loaded).

In Bretts own words "the smaller the page the better" - can't find the thread - CSS is one way of doing it... You can't lump together bad markup and JS with CSS to call it a bad job (well you can if you want...but you can't blame the CSS alone)

I really would like to know the espn stats before this changeover..then we'll be able to tell if there is actually any "improvement" or not.

generally my feeling is good on them, they can keep working at it now, after all they've now got the initial criticism out of the way :)

maybe the web team at espn are trying to pacify their bosses who told them No changes to the design so they're working against all sorts of crossbrowser compatibility issues in order to produce this layout..but at the same time they're thinking if only...

I don't care how "credible" a company they are I only want to
read/hear/feel the news... and if I found their site site first (cos I'm only a surfer!) do you think I know (or even care) why it's faster than/not as fast as (delete as applicable) your average news site at loading?

Suzy

madcat




msg:1195096
 6:15 pm on Apr 9, 2003 (gmt 0)

This is an example of quality coding? Slow loading incompatible pages that force feed the user?

Absolute. But, this is about major players moving away from legacy browsers. ESPN pulls weight- the more people surfing for sports or major items of interest- the better potential to expediate the masses transition to newer browser versions.

Brett_Tabke




msg:1195097
 1:00 am on Apr 10, 2003 (gmt 0)

Going through archive.org's espn listings. I found that the old espn.com homepage was 79k total. The current page with css and js is 91k.

They went CSS and it added 12k. So much for the myth of css saving bandwidth.

grahamstewart




msg:1195098
 1:11 am on Apr 10, 2003 (gmt 0)

Wow Brett you really have a bug bear about this don't you :)

Well they claimed to have made a good saving in that interview. Of course maybe they are just keeping management happy ;)

Its probably a little unfair to count the size of the Javascripts as part of the change to CSS. That is their (bad) choice. They are not required for a CSS layout and most sites manage just fine without them.

(espn actually requires you to have Javascript turned on, otherwise it bumps you to another page... that is really quite sad)

SuzyUK




msg:1195099
 1:40 am on Apr 10, 2003 (gmt 0)

Brett...

duh..I forgot I could've checked that way...

However I checked 2 x older pages (dec 2nd and oct 23rd) which showed 76K and 72k respectively (so I concur with the first statement)

However their present page is showing 61K (10-15K less)..?

by adding on the CSS and JS to this it doesn't seem to be the same comparison ...once the CSS (even if it's 10K, now that is their fault!) has cached the bandwidth saving after that must be worth something..

I also note...strangely enough that the Text to HTML Ratio is virtually unchanged @ 20%, I consider this figure to be more important..so I guess that speaks for the "bad code" in itself.. (content is king ;))

btw figures from the SEW checker....

Suzy
:)

Interesting excercise this, those of us who know that CSS is better ;) are learning how not to do it!

ricfink




msg:1195100
 2:31 am on Apr 10, 2003 (gmt 0)

I'm with Madcat on this. If the folks at ESPN made a botch of the HTML/CSS/Javascript mix, well shame on them but what I find significant is that they made the move knowing they would leave two out of a hundred of their visitors behind - at least as far as page design goes.
It amazes me how NN4 just clings on and on.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved