473,883 Members | 1,638 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Coding practices of large sites

I've seen a few attractive multi-column sites whose geometry is based
on pure CSS-P, but they're what you might call "code afficionado"
sites, where the subject matter of the site is "coding practices." (One
example of this is alistapart.com. ) However, the project/development
realities for small boutique sites are completely different from those
of large commercial or institutional sites -- and I was curious to see
what coding approaches are currently in use at the latter. So I made up
a list of big commercial sites off the top of my head, visited each
site on the list, and looked at their code. The quick summaries of what
I found are below. (I looked at home pages only. Add ".com" to each
name for site location.)

Even if you just skim through the results, please notice at the end of
this post: my very brief comment, and my two questions coming out of
all this.

---------------------
_Amazon_
No doctype.
CSS styles and JavaScripts defined in head and body.
Body a mix of absolute positioned CSS, tables, and JavaScripts.
---------------------
_Apple_
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
Mostly table code; some CSS; inline JavaScripts.
---------------------
_BBC_
<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
Tables; CSS; CSS classes applied to table elements.
---------------------
_CNN_
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html
lang="en">
Tables; CSS; CSS classes applied to table elements.
---------------------
_Ebay_
Unbelievably long and complex code: loading the home page loads 31 (!)
additional text files into the cache (one is a CSS file, the others are
all JavaScript files). HTML file features:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML XMLNS:IE>
Mostly table code with old-fashioned tags like <font...> etc. Many tag
constructions like <BR><BR><BR> and &nbsp;&nbsp;|&n bsp;
Numerous inline JavaScripts.
The only external CSS file ("homepage.css" ) is incredibly short and
completely incomprehensibl e to me. Here are its entire contents:

@media all {
IE\:HOMEPAGE {behavior:url(# default#homepag e)}
}
---------------------
_Google_ (simple search)
No DTD. No external linked files. Extensive inline JavaScripts.
Uses table code with old-fashioned tags like <font...> etc.; some
inline CSS.
_Google_ (advanced seach)
No DTD. Code similar to simple-search, except more CSS defined in head.
---------------------
_IBM_
<!DOCTYPE html SYSTEM
"http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dt d">
Mostly table code, with some CSS classes applied to table elements;
uses code constructions like &nbsp;&nbsp;|&n bsp;&nbsp;
---------------------
_Microsoft_ No DTD. Mostly table code, with CSS styles applied to
table elements.
_Slate_ No DTD. Mostly tables; some CSS. Weird code.
---------------------
_NYTimes_
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
Note linked script name: <script src="/js/csssniff.js"></script>
Table code, use tags like <br><br> and <font face...
---------------------

Summary - what I found:
Every large commercial site I looked at used table code, not CSS-P, to
define its page geometry. (Amazon was a partial exception; they used
both.) All used CSS to define typographic styles, and sometimes other
things, at least to some extent; although <font... and other deprecated
tags were also common.

Two questions:
Large sites typically have separate job functions for Web developers
(coders) and designers. Logically, I have to assume that at least
*some* of these sites have knowledgeable developer teams; and for that
matter, even graphical editing programs like Dreamweaver have
increasing levels of CSS support. So why these results? Specifically:

1. If, as the regulars in this newsgroup believe, CSS is clearly
superior to table code for defining page layout, why are *none* of
these sites relying on CSS for that purpose?

2. Can anybody provide links to any large commercial or institutional
sites (whose subject matter is not "coding practices") that *do* use
CSS to define their page geometry, so that I can look at their code?

These questions are not rhetorical arguments-in-disguise; I really
haven't made up my mind yet, and I'm certainly not trying to start an
argument. I look forward to your replies.
Jul 20 '05 #1
55 5214
Jonas Smithson <sm************ @REMOVETHISboar dermail.com> schrieb:
1. If, as the regulars in this newsgroup believe, CSS is clearly
superior to table code for defining page layout, why are *none* of
these sites relying on CSS for that purpose?
i think this is because they are afraid of how older browsers would
deal with the css. i am building a site at
http://tomasio.laudatio.com/jobs/Cla...gallery_ba.php
and although it is validated as XHTML and CSS 2, i still get the wrong
display (background-color of div.Description does not extend until the
bottom of the browserwindow) in firefox 0.9. i would not take the same
efforts of code-hacking for a large site to be built.2. Can anybody provide links to any large commercial or institutional
sites (whose subject matter is not "coding practices") that *do* use
CSS to define their page geometry, so that I can look at their code?


hm. it's ashaming, but i don't know any ; )
--
kind regards,
tomasio
"describing an issue reveals the way to solve it"
Jul 20 '05 #2
Jonas Smithson wrote:
Every large commercial site I looked at used table code, not CSS-P, to
define its page geometry.
[Insert CSS purist "because they're not as smart as us" rant here]
1. If, as the regulars in this newsgroup believe, CSS is clearly
superior to table code for defining page layout, why are *none* of
these sites relying on CSS for that purpose?
Just because something is "superior" doesn't mean it will actually _work_!
Big sites need to support as many browsers as possible, including older ones
which don't support much CSS. Delivering ugly pages to them probably
translates to lost sales, etc. If tables can be used to create a
presentation which looks good for old browsers and _still_ looks good for
newer browsers, isn't the choice obvious?

CSS is slick and obviously a superior way to design for the web. If all
browsers supported it, and all the features actually worked, and
implementations were actually consistent, then everyone would be flocking to
it, IMO. But that's not the case, and Real Sites (tm) realize this.

That's why it's wise to listen to the purist mantras and consider them (with
regards to any technology, not just css, because they exist for every topic)
but then hedge them with a reality check. Sometimes purists have blinders
on, and are so focused on the technology and having everything validate and
line up perfectly, that they miss the bigger picture - that these
technologies are worthless without being _used_ in the real world. It's
great that there are people who focus on the details and hammer out "the way
things ought to be" because it advances technology in a positive way. But
they are often frustrated that the real world doesn't allow for adopting
those advances as quickly as they would like. Looking to the giants of the
web - who surely employ very intelligent and experienced developers - is a
good litmus test for how far "reality" is behind "ideal".

All IMO.
2. Can anybody provide links to any large commercial or institutional
sites (whose subject matter is not "coding practices") that *do* use
CSS to define their page geometry, so that I can look at their code?


I would be interested in this also.

--
Matt Kruse
Javascript Toolbox: http://www.JavascriptToolbox.com/
Jul 20 '05 #3
*Jonas Smithson* <sm************ @boardermail.co m>:

1. If, as the regulars in this newsgroup believe, CSS is clearly
superior to table code for defining page layout, why are *none* of
these sites relying on CSS for that purpose?
The first reason is probably that the code has grown over the years and was
never substantially changed. The second one is that there is this undying
wish of many decision makers to have the site look the same in all
environments that have or had some significant importance during the site's
lifespan. That means NS4 and IE4 usually shall still work, but Opera 7 and
Lynx don't matter (the latter at best due to some usually misunderstood
accessibility initiative).
Nevertheless, if I were to build such a mutli-million visitor site, I'd also
use a *basic* layout table, but cleaner, more separated and valid code.
2. Can anybody provide links to any large commercial or institutional
sites (whose subject matter is not "coding practices") that *do* use
CSS to define their page geometry, so that I can look at their code?


<http://www.stern.de> (a German weekly magazine), not the best code, though.
I don't know if you'd accept <http://www.opera.com> and
<http://www.mozilla.org > as valid examples.

--
Only wimps use tape backup: _real_ men just upload their important stuff on FTP,
and let the rest of the world mirror it. (Linus Torvalds)
Jul 20 '05 #4
/Jonas Smithson/:
2. Can anybody provide links to any large commercial or institutional
sites (whose subject matter is not "coding practices") that *do* use
CSS to define their page geometry, so that I can look at their code?


May be http://www.theregister.co.uk is good example, too, although
they use a single TABLE element for the general layout (the middle
part). Note, they serve different stylesheets for IE and the other
browsers.

--
Stanimir
Jul 20 '05 #5
/Stanimir Stamenkov/:
/Jonas Smithson/:
2. Can anybody provide links to any large commercial or institutional
sites (whose subject matter is not "coding practices") that *do* use
CSS to define their page geometry, so that I can look at their code?


May be http://www.theregister.co.uk/ is good example, too, although they
use a single TABLE element for the general layout (the middle part).
Note, they serve different stylesheets for IE and the other browsers.


One more - the Macromedia's site <http://www.macromedia. com/>.

--
Stanimir
Jul 20 '05 #6
Jonas Smithson wrote:
the project/development realities for small boutique sites are
completely different from those of large commercial or
institutional sites
Are they? They use the same web; their visitors use the same
browsers. Perhaps the only "reality" that's different is how they
approach document production.
I made up a list of big commercial sites off the top of my head,
visited each site on the list, and looked at their code. Every large commercial site I looked at used table code, not
CSS-P, to define its page geometry.
This is hardly news. Did you search the group archives? This point
is brought up in many discussions about table layout.
Large sites typically have separate job functions for Web
developers (coders) and designers. Logically, I have to assume
that at least *some* of these sites have knowledgeable developer
teams; and for that matter, even graphical editing programs like
Dreamweaver have increasing levels of CSS support. So why these
results?
Large companies often do things that don't make sense, and that's
not limited to web dev. But let's stay on topic. Consider Google's
results page. Loads of nested tables, many of which seem only there
to provide a few pixles of space between a pseudo heading and ads or
some such thing. They could save a fair amount of bandwidth by
simplifying the results template, while keeping the same layout even
in Netscape 4 and IE 4.
If, as the regulars in this newsgroup believe, CSS is clearly
superior to table code for defining page layout,
Defind your criteria for "superior."
why are *none* of these sites relying on CSS for that purpose?
CSS P is hard to pull off. And, since HTML 3.2, web developers have
tried to treat HTML as a DTP language. It's very bad at DTP, and
requires proprietary markup (or what was proprietary but was later
added to HTML as "deprecated " elements/attributes).

Perhaps, if HTML had not taken the 3.2 detour, there would not be an
expectation that a page look the same in all browsers. Or maybe
there still would. Ho hum.
Can anybody provide links to any large commercial or
institutional sites (whose subject matter is not "coding
practices") that *do* use CSS to define their page geometry, so
that I can look at their code?
A search of the group would have revealed the same answers that
you'll receive now. I recall sits for ESPN and the PGA being
mentioned. I think I'll let you find those sites and confirm for
yourself.
These questions are not rhetorical arguments-in-disguise;


We'll see.

--
Brian
Jul 20 '05 #7
tomasio wrote:
Jonas Smithson <sm************ @REMOVETHISboar dermail.com> schrieb:

1. If, as the regulars in this newsgroup believe, CSS is clearly
superior to table code for defining page layout, why are *none* of
these sites relying on CSS for that purpose?


i think this is because they are afraid of how older browsers would
deal with the css.


Is it stated somewhere on the internet what the breakdown of usage of the
various browsers is?

A friend built the Australian Government Revenue Office website, and he said
they were told that 95% of users use IE, so they didn't worry too much about
other browsers. I don't think they used any CSS because IE is so standards
non-compliant.

--
Ben Thomas
Opinions, conclusions, and other information in this message that do not
relate to the official business of my firm shall be understood as neither
given nor endorsed by it.

Jul 20 '05 #8
Jonas Smithson wrote:
I've seen a few attractive multi-column sites whose geometry is based
on pure CSS-P, but they're what you might call "code afficionado"
sites, where the subject matter of the site is "coding practices."
(One example of this is alistapart.com. ) However, the
project/development realities for small boutique sites are completely
different from those of large commercial or institutional sites --
and I was curious to see what coding approaches are currently in use
at the latter. So I made up a list of big commercial sites off the
top of my head, visited each site on the list, and looked at their
code. The quick summaries of what I found are below. (I looked at
home pages only. Add ".com" to each name for site location.)
You don't actually need to look at their code. Use the following local CSS,
(which also works with IE). (I have used this for weeks on end, at various
times over the last 9 months or so). It puts a dotted blue rectangle round
every table. You will probably find that about 99% of the pages you look at
use some sort of layout table.

table { border: 1px dotted blue; }

[snip] Summary - what I found:
Every large commercial site I looked at used table code, not CSS-P, to
define its page geometry. (Amazon was a partial exception; they used
both.) All used CSS to define typographic styles, and sometimes other
things, at least to some extent; although <font... and other
deprecated tags were also common.
I hope you accept that layout-tables are not deprecated. They will be valid
with Strict documents for decades to come.
Two questions:
Large sites typically have separate job functions for Web developers
(coders) and designers. Logically, I have to assume that at least
*some* of these sites have knowledgeable developer teams; and for that
matter, even graphical editing programs like Dreamweaver have
increasing levels of CSS support. So why these results? Specifically:
Dreamweaver (MX 2004) has very good support for CSS indeed. Its Standard Mode,
Design View, is a WYSIWYG-like editor with reasonably good CSS2-compliance. I
would argue that a combined set of editors for CSS & HTML with CSS awareness
is more likely to encourage CSS-exploitation than separate editors. (My target
is valid 4.01 Strict, and the only obstacle that MX 2004 puts in my way is
that it doesn't "escape" "&" in external links!)

For interest, a few days ago I uploaded a (very highly compressed, very narrow
editting window) screenshot of Dreamweaver MX 2004 editing a page:
http://www.barry.pearson.name/test/screen_shot_kn.jpg
And here is the page it was editting:
http://www.kingsnorton.info/
1. If, as the regulars in this newsgroup believe, CSS is clearly
superior to table code for defining page layout, why are *none* of
these sites relying on CSS for that purpose?
Others regulars may not want me to be considered a regular! But, I don't
believe that CSS is clearly superior to table layout for defining page layout.
Nor vice versa.

We don't have a proper page layout language. No one ever bothered to make one
a recommendation. I suspect that the people capable of defining one didn't see
the need for one. Or else just didn't follow through. So, even if we had full
CSS2 browser compliance, we would still perform page layout as a cooperation
between the top-level elements of the document tree and CSS. All major
features of CSS2 depend on the document tree. Inheritance (by definition!),
floating, absolute-positioning, and normal flow for layout down the page, (and
its neighbour relative-positioning), are all governed by the document tree.

It is common for practitioners of CSS-positioning, (including myself), to add
extra mark-up, such as wrapping, and clearing-<div>s, etc. We ensure that the
wrapping & nesting & sequencing of the top-level elements of the document tree
provide the structure & "hooks" for our CSS to operate on. We use our
ingenuity to simulate "columns", even though CSS2, unlike table-mark-up,
doesn't have columns. We add extra wrapping at other places to ensure that
various combinations of elements are treated as entities.

Table-mark-up simply comes as pre-defined wrapping & nesting & sequencing.
Except that it is a bit more honest. If you want 3 columns, you say so in the
mark-up. Others wrap it in <div>s, then turn those into pseudo-columns using
CSS plus various other techniques. I am sometimes amused by the extra mark-up
that CSS-positioning practitioners add to the document in order to avoid
adding well-defined table-mark-up to the document! (And I'm also guilty).

You can use non-table-mark-up to lay things out in rows & columns. Or you can
use table-mark-up and lay things out in other ways. See:
The CSS Patio Garden
http://www.barry.pearson.name/tableaux/
2. Can anybody provide links to any large commercial or institutional
sites (whose subject matter is not "coding practices") that *do* use
CSS to define their page geometry, so that I can look at their code?

[snip]

In addition to those already mentioned:
http://www.direct.gov.uk/

But - so what? What does that prove? I sometimes look at table-layout pages
and think "I could do that much better with CSS". And I look at
tableless-layout pages and think "that would be better all round using a
simple table". I think the discussion needs to be raised to a higher level.

All of these are sensible techniques for authors to have in their toolkits.
Then the authors should systematically decide what combination to use for
their current purpose. They are, presumably, not trying to win a "mark-up of
the year award" with this newsgroup. More likely, they are trying to
communicate with their audience, and should be judged on that.

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/
Jul 20 '05 #9
BenOne© wrote:
[snip]
Is it stated somewhere on the internet what the breakdown of usage of
the various browsers is?

A friend built the Australian Government Revenue Office website, and
he said they were told that 95% of users use IE, so they didn't worry
too much about other browsers. I don't think they used any CSS
because IE is so standards non-compliant.


A pathetic excuse!

Every version of IE from IE 5 onwards, (and probably earlier ones, but I can't
be sure), supports sufficient CSS for full use of CSS for just about
everything. I have many tableless-pages, and the occasional
tableless-web-site, that work perfectly well in IE 5.

For basic styling of already-laid-out elements, IE has few problems. And there
is plenty of help here & elsewhere to find the work-arounds. IE 5 has
well-known issues with the box-model & some other matters, and if you want to
push things to precise levels, there are some hacks to cater for this.
(Sometimes I just don't bother, because often the difference is that some
boxes have a different size. Gosh!)

Yes, IE is often non-compliant. And, surprise surprise, I can catch out just
about any browser if I want to. I even have cases where Firefox agrees with IE
5 & 6, while Netscape 7.1 disagrees! And Opera has some "interestin g"
rendering of CSS handling of tables. There is no substitute for lots of
testing. And it is unfortunate that knowledge of bugs & hacks is needed. It is
up to any author to judge where to draw the line.

By the way, I believe that most Australian government sites *do* use CSS. In
combination with table-layout. Fine.
http://www.ato.gov.au/

But, perhaps this is the one you mean? It is an exception:
http://www.revenue.act.gov.au/r_ltax.html

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/
Jul 20 '05 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

102
7652
by: RFox | last post by:
I date back to the early days of the web when HTML was limited but very managable, and have always maintained that hand-coding HTML gives you far better control and cleaner HTML markup than any WYSIWYG editor. But all the sites I created and manage are small sites (<50 pages). And I've been out of the loop in terms of what's new in methodology and with the specifications for the past couple of years.
1
298
by: Todd | last post by:
Does anyone know of a book for C# .NET on coding standards and guidelines? My company is in the process of defining this stuff as we move to C# .NET. I could swear I picked up a book like this in a technical bookstore, but now I can't find one searching Amazon.com or anywhere else. By the way, I've seen the documentation Microsoft has in their best practices section. That stuff is good, but
4
2305
by: dotNetDave | last post by:
About three weeks ago I released the first .NET coding standards book titled "VSDN Tips & Tricks .NET Coding Standards". Here is what the famous author/ speaker Deborah Kurata says about it: "David McCarter once again demonstrates his knack for pulling best practices into one cohesive unit with his new book "VSDN Tips and Tricks: .NET Coding Standards". This book includes everything from how to set up your project to how to declare...
136
9498
by: Matt Kruse | last post by:
http://www.JavascriptToolbox.com/bestpractices/ I started writing this up as a guide for some people who were looking for general tips on how to do things the 'right way' with Javascript. Their code was littered with document.all and eval, for example, and I wanted to create a practical list of best practices that they could easily put to use. The above URL is version 1.0 (draft) that resulted. IMO, it is not a replacement for the FAQ,...
2
2225
by: Ed_P | last post by:
Hello I just wanted to get the opinions of those of you who have experience developing C# applications and programming in general. I currently am learning the basics of programming (choosing C# as the language of choice) and have developed simple applications to work with Access/SQL databases. I have accomplished all tasks that I wanted to with the small but simple applications...learned alot about the syntax and logic used in C# an...
0
4261
by: Anonieko Ramos | last post by:
ASP.NET Forms Authentication Best Practices Dr. Dobb's Journal February 2004 Protecting user information is critical By Douglas Reilly Douglas is the author of Designing Microsoft ASP.NET Applications and owner of Access Microsystems. Doug can be reached at doug@accessmicrosystems.com. --------------------------------------------------------------------------------
50
4759
by: Konrad Palczynski | last post by:
I am looking for tool to validate conformity to defined coding standard. I have already found Parasoft's C++ Test, but it is quite expensive. Is there any Open Source alternative? I do not need GUI, fancy reports nor predefined sets of rules.
7
4975
by: Robert Seacord | last post by:
The CERT/CC has just deployed a new web site dedicated to developing secure coding standards for the C programming language, C++, and eventually other programming language. We have already developed significant content for the C programming language that is available at: https://www.securecoding.cert.org/ by clicking on the "CERT C Programming Language Secure Coding Standard"
7
10831
by: =?Utf-8?B?TW9iaWxlTWFu?= | last post by:
Hello everyone: I am looking for everyone's thoughts on moving large amounts (actually, not very large, but large enough that I'm throwing exceptions using the default configurations). We're doing a proof-of-concept on WCF whereby we have a Windows form client and a Server. Our server is a middle-tier that interfaces with our SQL 05 database server.
0
11112
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
1
10833
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
9559
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
7959
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
7114
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5784
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
5980
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
4602
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
3
3228
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.