Web Layout Report

By Xah Lee. Date:

(work in progress)

In the days of yore, about 1997s, all the websites are laid out using HTML TABLE tag. All hell are cried by the pundits because they believed in a wonderland where HTML should never be used to do layout at all. The punditry has a few levels, and got eased and weakened overtime. The severest forms decry that HTML should be strictly be used to markup the logical relations of the content. For example, titles, chapter headings, sections, subsections, quotations, emphasized text, etc. Some, claim that the web should be just these, period.

While the pundits made their outcries, companies such as Netscape raced to introduce fancy elements that blinks and flashes and rolls. And with gif animations running rampant on the web, clearly indicating that the human animals in general is at odds with punditing fckheads.

As time goes by, near 1997s the boom and commercialization of the web made it vastly useful, these school of pundit stances, once popular, waned. In accordance, Standard bodies such as W3C has sprung up. On one hand assuming the role of benign dictator and telling companies what is right. On the other hand, cooking up a Cascading Style Sheet by the undeniable desires of the human animals.

The second generation of web pundits is onto the concept of Appearance and Content separation, with CSS. They cry and want, that structural markup of the content should be distinct and separated from appearance markup. For example, a page's title text has a logical purpose to the content. Namely, that text is the Title of the page. But also, it also have a standard appearance connotation. Namely, titles are usually centered, large, and often in streamlined font face. The pundits now say, the title should be marked up like «TITLE»My Title«\TITLE» and there should be another way to specify how «TITLE» must be rendered.

This school of web pundits is still with us today 2005 December. Note that their punditry isn't always clear and clean. They, like the industry, are shaped and goaded by how things move. For example, they no longer think that the web should not be commercialized. The human-animal-history-changing nature of the enterprising web has killed this wave of pundits. Nor, today we find pundits that are against any appearance markup. W3C's CSS has killed these off. The pundits in question simply shutted up and remain mum about their past, and possibly went on to pundit other things.

HTML Tables is introduced around late half of 1990s. At the time, the pundit consensus was that Tables should be used to markup data that suites a tabular format. For example, a list of names and addresses, stock quotes, etc. In reality, tables is used for layout of a site. That is, by using table's with and height attribute, people are use it to specify this image should appear there and this text should be aligned here. Every major website uses table this way, and largely still so today (2005-12). Apparently, site layout is extremely important to human animals, regardless of pundit-say.

The W3C pundit collective saw this, and started to device CSS2, which has the ability to specify object's positions and size.

As a new piece of technology, the generations of CSSes went thru a bumpy road towards the mainstream and slowly, very slowly, gained acceptance and wide deployment on the web. Over the past 7 or so years since the inception of CSS, today perhaps half of the web uses CSS, but all major websites uses CSS. How CSS is used, whether it is used properly, is still hotly debated among pundits.

With the introduction of CSS2's Layout and Overlay abilities, it is possible to specify positions and sizes in a precise manner. This has gradually displaced the ubiquitous use of nested tables for its layout abilities.

Today, in these pages, i'm going to do a survey and report of how major websites do layout.


Alexa.com has a website ranking page: http://www.alexa.com/site/ds/top_500. Alexa is a amazon.com company. They did the ranking by distributing a browser toolbar, so that what user browses are registered in their database. Since they are pretty big, it gives some good indication of the top websites within USA. Here's their list of top sites as of 2005-12:

1. Yahoo!
www.yahoo.com

2. Microsoft Network (MSN)
www.msn.com

3. Google
www.google.com

4. EBay
www.ebay.com

5. Passport.net
www.passport.net

6. Amazon.com
www.amazon.com

7. Microsoft Corporation
www.microsoft.com

8. Myspace
www.myspace.com

9. Google UK
www.google.co.uk

10. AOL
www.aol.com

11. 	Go
A searchable directory, news, stocks, sports and free e-mail.
www.go.com

12. 	BBC Online
The BBC Homepage - Your gateway to BBC Online
www.bbc.co.uk

13. 	Alibaba.com
Import and export trade leads and opportunities.
www.alibaba.com

14. 	CNN - Cable News Network
Includes US and international stories and analysis, weather, video clips, and program schedule.
www.cnn.com

15. 	Fastclick
An online advertising agent that provides products, such as Ad Network and AdServer, to ensure optimal output and performance for its clients.
www.fastclick.com

16. 	Blogger.com
Free, automated weblog publishing tool that sends updates to a site via FTP.
www.blogger.com

17. 	EBay UK
Person to person online auction site where you can buy or sell new and used items.
www.ebay.co.uk

18. 	Craigslist.org
www.craigslist.org

19. 	Google.ca
www.google.ca

20. 	The Internet Movie Database
Features plot summaries, reviews, cast lists, and theatre schedules.
www.imdb.com

21. 	Comcast.net
www.comcast.net

22. 	Xanga
Personal publishing. Free weblogs.
www.xanga.com

23. 	Adult Friendfinder
Personal adverts with pictures and chat. [Membership]
www.adultfriendfinder.com

24. 	Apple Computer, Inc.
Apple's main homepage.
www.apple.com

25. 	Casale Media
Casale Media is the world's fastest growing provider of online media solutions. With a network reach of over half the U.S. digital audience, Casale Media connects advertisers to more than 89 millions Americans every month (comScore Media Metrix, November 2004 Ad Focus Report). As one of the top ten largest media properties online, the Casale Media network currently delivers billions of ads every month to users in 200 countries worldwide.
www.casalemedia.com

26. 	MOJO Works
Provides online advertising, direct marketing and interactive marketing technologies.
www.mediaplex.com

27. 	Weather.com
Offers forecasts for cities worldwide as well as radar and satellite maps. Also includes news stories and allergy information.
www.weather.com

28. 	Yahoo! Search Marketing Solutions
Provides marketing services for online businesses with search-based products and tools.
www.overture.com

29. 	About
A network of sites where visitors can find many targeted topic areas, each one managed by a personal guide.
www.about.com

30. 	MapQuest
Find directions for and explore towns and cities worldwide. Display addresses on a map, view nearby businesses, get driving directions and maps, and plan a trip with city information. Also includes aerial photographs of selected areas.
www.mapquest.com

31. 	Hi5.com
www.hi5.com

32. 	The New York Times
Online edition of the newspaper's recent content with searchable archives for a fee. [Registration required]
www.nytimes.com

33. 	Orkut.com
www.orkut.com

34. 	Gator.com
www.gator.com

35. 	CNET.com
Reviews, news, and prices on tech products, as well as free downloads and newsletters.
www.cnet.com

36. 	Yieldmanager.com
www.yieldmanager.com

37. 	Match.com
Personal ads with photos, anonymous email, advice and date ideas.
www.match.com

38. 	Thefacebook
An online directory that connects people through social networks at colleges. FAQ, news coverage, schools covered, and terms of use.
www.thefacebook.com

39. 	220.181.27.54
220.181.27.54

40. 	Google Australia
Search the web from Google Australia's homepage.
www.google.com.au

41. 	Tribalfusion.com
www.tribalfusion.com

42. 	Bank of America
Nationwide bank. Includes product and service information, online banking and bank location finder.
www.bankofamerica.com

43. 	Double Click
Coordinates targeted Internet advertising campaigns for advertisers, and provides ad management services, software, and sales for publishers.
www.doubleclick.com

44. 	Friendster
An online community that connects people through networks of friends for dating or making new friends.
www.friendster.com

45. 	Searchscout.com
www.searchscout.com

46. 	Webshots
Download free screen saver, wallpaper, and photos.
www.webshots.com

47. 	Revenue.net
www.revenue.net

48. 	CNET Download.com
The site is one of the largest and most trusted sources of freeware, shareware, and other software downloads.
www.download.com

49. 	Flickr
Picture galleries available with social networking, chat, groups, and photo ratings.
www.flickr.com

50. 	My Way
Internet portal without banners or pop-ups.
www.myway.com

51. 	Mywebsearch.com
www.mywebsearch.com

52. 	EarthLink, Inc.
Provides nationwide Internet access and related services to individuals and businesses. Includes web mail, user start page, and resources.
www.earthlink.net

53. 	Amazon.co.uk
Online retailer of books, video games, toys, music, and video recordings. Region 2 DVDs and prices in pounds sterling.
www.amazon.co.uk

54. 	Theplanet.com
www.theplanet.com

55. 	Wal-Mart
Online sales from the discount store.
www.walmart.com

56. 	Macromedia
Macromedia provides a range of products for multimedia authoring and web development. Site contains extensive documentation and support for all software.
www.macromedia.com

57. 	Hewlett-Packard Industrial Ethernet
Provides embedded ethernet controllers, embedded internet, IEEE 1451.2, thin web servers, and time synchronization for smart sensors in distributed measurement and control system architectures.
www.hp.com

58. 	Rediff.com India Limited
Produces a leading Internet portal focussing on India and the global Indian community. (Nasdaq: REDF).
www.rediff.com

59. 	Target
Trend-forward merchandise at this national discount retailer.
www.target.com

60. 	SourceForge
Thousands of open source projects hosted. offering access to CVS, mailing lists, bug tracking and message boards/forums.
www.sourceforge.net

61. 	CBS SportsLine
Coverage of NFL football, NBA basketball, NHL hockey, NCAA college football games, and world sports, with the latest sports statistics, scores, standings, transactions, team injury reports, and team schedules.
www.sportsline.com

62. 	UPS
Company news, tracking, software, employment information, and FAQ.
www.ups.com

63. 	StatCounter.com
Detailed visitor stats and a choice of graphical counters. An invisible counter is also available.
www.statcounter.com

64. 	Netscape.com
www.netscape.com

65. 	ZEDO.com
Major ad serving player with solid technology. ZEDO is one of the 3 high quality ad serving companies that focuses on solid technology, great service and its customers. It does not compete by running an ad network and is well respected in the industry. ZEDO is especially good at Rich Media for Publishers and at Optimization for ad Publishers and Direct Marketers.
www.zedo.com

66. 	Monster.com
A one-stop career management resource. Job search, resume management, 1200 pages of advice from career experts, plus chats and message boards on dozens of topics.
www.monster.com

67. 	Overstock
Sells a variety of name brand overproduced and discontinued items. (Nasdaq: OSTK)
www.overstock.com

68. 	Reference.com
www.reference.com

69. 	Expedia.com
Compare prices, shop for a vacation or cruise, reserve a hotel room or rent a car.
www.expedia.com

70. 	Lycos
North American portal with email, YellowPages, heavily integrated search engine, personal settings and a directory.
www.lycos.com

71. 	Starware.com
www.starware.com

72. 	Internet Archive
A digital library of internet sites and other cultural artifacts in digital form. Includes a text archive of digitised books from Canadian libraries, Carnegie Mellon University, and Project Gutenberg.
www.archive.org

73. 	United States Postal Service (USPS)
USPS home page providing access to services, products, employment opportunities, and general agency information.
www.usps.com

74. 	Deskadtop.com
www.deskadtop.com

75. 	Best Buy
Online presence of the home electronics retailer.
www.bestbuy.com

76. 	Photobucket image hosting and photo sharing
Provides image hosting for auctions, live journals, blogs, message boards, personal websites and online photo albums. Reliable, fast and very simple to use.
www.photobucket.com

77. 	Nastydollars.com
www.nastydollars.com

78. 	FOX Sports
Breaking news, features, statistics, scores, standings, and schedules.
www.foxsports.com

79. 	Geocities
15 Mb with 3Gb monthly bandwidth limit. Banner or Pop-up ads on each page. Browser or FTP uploads. On-line editor. CGI scripts: counter and guestbook. URL: 'http://www.geocities.com/yoursite/'.
www.geocities.com

80. 	Google India
Indian version of this popular search engine. Search the whole web or only webpages from India. Interfaces offered in English, Hindi, Bengali, Telugu, Marathi and Tamil.
www.google.co.in

81. 	Netflix
Rent DVDs by mail for a monthly fee.
www.netflix.com

82. 	Winfixer.com
www.winfixer.com

83. 	Tripod.com
www.tripod.com

84. 	NBA.com
The official site of the National Basketball Association. Includes news, features, multimedia, player profiles, chat transcripts, schedules and statistics.
www.nba.com

85. 	Paypopup.com
www.paypopup.com

86. 	AltaVista.ru
Цифровые и аналоговые фотокамеры, объективы и принадлежности, сопутствующие товары, студийное оборудование. Телефонные консультации. Доставка по России.
www.altavista.com

87. 	Global Message Exchange (GMX)
Portal mit E-Mail name@gmx.de/at/net/ch/li, Autoresponder, Abruf fremder POP3-Konten und SMS-Versand. Zusatzdienste wie Internet-Fax und Unified Messaging kostenpflichtig. Zugang per Web oder verschlüsseltem POP3.
www.gmx.net

88. 	爱问
Sina推出的搜索引擎,含网页,图片,音乐搜索及知识问答。
www.iask.com

89. 	Ebay
Auctions in Australia.
www.ebay.com.au

90. 	SiteSell.com
Since 1997, SiteSell.com books, courses and software have delivered "E-commerce For the Rest of Us." Hundreds of thousands of entrepreneurs and small businesses outperform larger, well-financed competitors. You can do the same.
www.sitesell.com

91. 	Linksynergy.com
www.linksynergy.com

92. 	AEBN
Offers full-length streaming videos in a pay-per-view format. Categories include straight, gay and fetish movies. Provides free content, customized galleries and pays monthly.
www.aebn.net

93. 	888.com
www.888.com

94. 	Net-offers.net
www.net-offers.net

95. 	Firstadsolution.com
www.firstadsolution.com

96. 	Ev1servers.net
www.ev1servers.net

97. 	ImageShack
ImageShack® is a free image hosting solution. It can be used to share pictures with friends, as well as post images on message boards and blogs. It can also be used to direct link images from your personal website or online auction. And best of all, it's completely free.
www.imageshack.us

98. 	NFL.COM
Official site of the National Football League. It delivers in-depth team pages for all clubs, extensive game-day coverage with real time statistics and play-by-play and chats with top players.
www.nfl.com

99. 	MiniClip.com
Colorful games in a variety of genres. Games include Present Panic, Big Bird Hunting, Quick Pic, and Lickety Splat.
www.miniclip.com

100. 	Open Directory Project
Help build the most comprehensive human-reviewed directory of the web.
www.dmoz.org

Work in progress…

Liket it? Put $5 at patreon.

Or, Buy JavaScript in Depth

If you have a question, put $5 at patreon and message me.