Does Google Hate Web Standards?
![[ Thumbnail: Google W3C Invalidation ]](https://perishablepress.com/wp/wp-content/images/2008/google-check/google-invalidation_mid.gif)
Consider the Google home page — arguably the most popular, highly visited web page in the entire world. Such a simple page, right? You would think that such a simple design would fully embrace Web Standards. I mean, think about it for a moment.. How would you or I throw down a few lists, a search field, and a logo image? Something like this, maybe:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Google</title>
<link href="http://www.google.com/google.css" type="text/css" rel="stylesheet" media="screen" />
<script src="http://www.google.com/google.js" type="text/javascript"></script>
</head>
<body>
<p><strong>Web</strong></p>
<ul id="menu">
<li><a href="http://images.google.com/imghp?hl=en&tab=wi">Images</a></li>
<li><a href="http://maps.google.com/maps?hl=en&tab=wl">Maps</a></li>
<li><a href="http://news.google.com/nwshp?hl=en&tab=wn">News</a></li>
<li><a href="http://www.google.com/prdhp?hl=en&tab=wf">Shopping</a></li>
<li><a href="http://mail.google.com/mail/?hl=en&tab=wm">Gmail</a></li>
<li>more
<ul>
<li><a href="http://video.google.com/?hl=en&tab=wv">Video</a></li>
<li><a href="http://groups.google.com/grphp?hl=en&tab=wg">Groups</a></li>
<li><a href="http://books.google.com/bkshp?hl=en&tab=wp">Books</a></li>
<li><a href="http://scholar.google.com/schhp?hl=en&tab=ws">Scholar</a></li>
<li><a href="http://finance.google.com/finance?hl=en&tab=we">Finance</a></li>
<li><a href="http://blogsearch.google.com/?hl=en&tab=wb">Blogs</a></li>
<li><a href="http://www.youtube.com/?hl=en&tab=w1">YouTube</a></li>
<li><a href="http://www.google.com/calendar/render?hl=en&tab=wc">Calendar</a></li>
<li><a href="http://picasaweb.google.com/home?hl=en&tab=wq">Photos</a></li>
<li><a href="http://docs.google.com/?hl=en&tab=wo">Documents</a></li>
<li><a href="http://www.google.com/reader/view/?hl=en&tab=wy">Reader</a></li>
<li><a href="http://www.google.com/intl/en/options/">even more</a></li>
</ul>
</li>
</ul>
<ul id="login">
<li><a href="http://www.google.com/url">iGoogle</a></li>
<li><a href="https://www.google.com/accounts/Login">Sign in</a></li>
</ul>
<div id="logo">
<a href="http://www.google.com/help/ig/art/index.html#name=koons">
<img src="http://www.google.com/jeffkoons.gif" alt="By Jeff Koons" title="By Jeff Koons" border="0" height="145" width="242">
</a>
</div>
<div id="search">
<form action="/search" name="f">
<input name="hl" value="en" type="hidden" />
<input maxlength="2048" name="q" size="55" title="Google Search" value="" />
<input name="btnG" value="Google Search" type="submit"><input name="btnI" value="I'm Feeling Lucky" type="submit" />
</form>
</div>
<ul id="tools">
<li><a href="http://www.google.com/advanced_search?hl=en">Advanced Search</a></li>
<li><a href="http://www.google.com/preferences?hl=en">Preferences</a></li>
<li><a href="http://www.google.com/language_tools?hl=en">Language Tools</a></li>
</ul>
<p>What happens when great art mixes with your homepage? <a href="http://www.google.com/help/ig/art/">iGoogle Artist Themes</a></p>
<ul id="extra">
<li><a href="http://www.google.com/intl/en/ads/">Advertising Programs</a></li>
<li><a href="http://www.google.com/services/">Business Solutions</a></li>
<li><a href="http://www.google.com/intl/en/about.html">About Google</a></li>
</ul>
<p><small>© 2008 Google</small></p>
</body>
</html>Mmmm, nice and clean, or at least pretty close to it. Semantic markup, separation of structure, presentation, and behavior — you know, all the stuff that makes Web Standards so great. Unfortunately, the world’s most popular web page looks nothing like this. Instead of acknowledging, embracing, and supporting Web Standards, the Google home page is as abominable as Microsoft’s IE 404 Error Page. From inline styles and obtrusive JavaScript to non-semantic markup and table-based layout, the fun and simple Google home page is actually a big stinking bowl of tag soup in disguise:
<html><head><meta http-equiv="content-type" content="text/html; charset=UTF-8"><title>Google</title><style>body,td,a,p,.h{font-family:arial,sans-serif}.h{font-size:20px}.h{color:#3366cc}.q{color:#00c}.ts td{padding:0}.ts{border-collapse:collapse}.lnc:link,.lnc:visited{color:#00c}.pgtab,.pgtab:hover,.pgtabselected,.pgtabside{text-align:center;text-decoration:none;color:#00c;display:block;height:27px;float:left;overflow:hidden;background:url(/intl/ja/images/productlinktabs.png) no-repeat;padding-top:8px}.pgtab{width:130px;background-position:-274px 0}.pgtab:hover{width:130px;background-position:-144px 0}.pgtabselected{width:144px}.pgtabside{width:3px;background-position:-404px 0}.ptr{cursor:pointer;cursor:hand}.iconl{background:url() no-repeat;overflow:hidden;height:px;width:px}#gbar{float:left;height:22px;padding-left:2px}.gbh,.gb2 div{border-top:1px solid #c9d7f1;font-size:0;height:0}.gbh{position:absolute;top:24px;width:100%}.gb2 div{margin:5px}#gbi{background:#fff;border:1px solid;border-color:#c9d7f1 #36c #36c #a2bae7;font-size:13px;top:24px;z-index:1000}#guser{padding-bottom:7px !important}#gbar,#guser{font-size:13px;padding-top:1px !important}@media all{.gb1,.gb3{height:22px;margin-right:.73em;vertical-align:top}.gb2 a,.gb2 b{display:block;padding:.2em .5em}}#gbi,.gb2{display:none;position:absolute;width:8em}.gb2{z-index:1001}#gbar a{color:#00c}.gb2 a,.gb3 a{text-decoration:none}#gbar .gb2 a:hover{background:#36c;color:#fff;display:block}</style><script>window.google={kEI:"tuMYSLXoO6T-gwPi3oz5Cw",kEXPI:"17259,17735,17866",kHL:"en"};
function sf(){document.f.q.focus()}
window.clk=function(b,c,d,e,f,g){if(document.images){var a=encodeURIComponent||escape;(new Image).src="/url?sa=T"+(c?"&oi="+a(c):"")+(d?"&cad="+a(d):"")+"&ct="+a(e)+"&cd="+a(f)+(b?"&url="+a(b.replace(/#.*/,"")).replace(/\+/g,"%2B"):"")+"&ei=tuMYSLXoO6T-gwPi3oz5Cw"+g}return true};
window.gbar={};(function(){var c=window.gbar,e,g,h;c.qs=function(a){var d=window.encodeURIComponent&&(document.forms[0].q||"").value;if(d)a.href=a.href.replace(/([?&])q=[^&]*|$/,function(f,b){return(b||"&")+"q="+encodeURIComponent(d)})};function l(a,d,f){a.display=h?"none":"block";a.left=d+"px";a.top=f+"px"}c.tg=function(a){var d=0,f=0,b,m=0,n,j=window.navExtra,k,i=document;g=g||i.getElementById("gbar").getElementsByTagName("span");(a||window.event).cancelBubble=!m;if(!e){e=i.createElement(Array.every||window.createPopup?"iframe":"DIV");e.frameBorder="0";e.scrolling="no";e.src="#";g[7].parentNode.appendChild(e).id="gbi";if(j&&g[7])for(n in j){k=i.createElement("span");k.appendChild(j[n]);g[7].parentNode.insertBefore(k,g[7]).className="gb2"}i.onclick=c.close}while(b=g[++m]){if(f){l(b.style,f+1,d+25);d+=b.firstChild.tagName=="DIV"?9:20}if(b.className=="gb3"){do f+=b.offsetLeft;while(b=b.offsetParent)}}e.style.height=d+"px";l(e.style,f,24);h=!h};c.close=function(a){h&&c.tg(a)}})();</script></head><body onload="sf();if(document.images){new Image().src='/images/nav_logo3.png'}" topmargin="3" alink="#ff0000" bgcolor="#ffffff" link="#0000cc" marginheight="3" text="#000000" vlink="#551a8b"><div id="gbar"><nobr><span class="gb1"><b>Web</b></span> <span class="gb1"><a href="http://images.google.com/imghp?hl=en&tab=wi" onclick="gbar.qs(this)">Images</a></span> <span class="gb1"><a href="http://maps.google.com/maps?hl=en&tab=wl" onclick="gbar.qs(this)">Maps</a></span> <span class="gb1"><a href="http://news.google.com/nwshp?hl=en&tab=wn" onclick="gbar.qs(this)">News</a></span> <span class="gb1"><a href="http://www.google.com/prdhp?hl=en&tab=wf" onclick="gbar.qs(this)">Shopping</a></span> <span class="gb1"><a href="http://mail.google.com/mail/?hl=en&tab=wm">Gmail</a></span> <span class="gb3"><a href="http://www.google.com/intl/en/options/" onclick="this.blur();gbar.tg(event);return !1"><u>more</u> <small>▼</small></a></span> <span class="gb2"><a href="http://video.google.com/?hl=en&tab=wv" onclick="gbar.qs(this)">Video</a></span> <span class="gb2"><a href="http://groups.google.com/grphp?hl=en&tab=wg" onclick="gbar.qs(this)">Groups</a></span> <span class="gb2"><a href="http://books.google.com/bkshp?hl=en&tab=wp" onclick="gbar.qs(this)">Books</a></span> <span class="gb2"><a href="http://scholar.google.com/schhp?hl=en&tab=ws" onclick="gbar.qs(this)">Scholar</a></span> <span class="gb2"><a href="http://finance.google.com/finance?hl=en&tab=we" onclick="gbar.qs(this)">Finance</a></span> <span class="gb2"><a href="http://blogsearch.google.com/?hl=en&tab=wb" onclick="gbar.qs(this)">Blogs</a></span> <span class="gb2"><div></div></span> <span class="gb2"><a href="http://www.youtube.com/?hl=en&tab=w1" onclick="gbar.qs(this)">YouTube</a></span> <span class="gb2"><a href="http://www.google.com/calendar/render?hl=en&tab=wc">Calendar</a></span> <span class="gb2"><a href="http://picasaweb.google.com/home?hl=en&tab=wq" onclick="gbar.qs(this)">Photos</a></span> <span class="gb2"><a href="http://docs.google.com/?hl=en&tab=wo">Documents</a></span> <span class="gb2"><a href="http://www.google.com/reader/view/?hl=en&tab=wy">Reader</a></span> <span class="gb2"><div></div></span> <span class="gb2"><a href="http://www.google.com/intl/en/options/">even more »</a></span> </nobr></div><div class="gbh" style="left: 0pt;"></div><div class="gbh" style="right: 0pt;"></div><div id="guser" style="padding: 0pt 0pt 4px; font-size: 84%;" width="100%" align="right"><nobr><a href="http://www.google.com/url?sa=p&pref=ig&pval=3&q=http://www.google.com/ig%3Fhl%3Den%26source%3Diglk&usg=AFQjCNFA18XPfgb7dKnXfKz7x7g1GDH1tg">iGoogle</a> | <a href="https://www.google.com/accounts/Login?continue=http://www.google.com/&hl=en">Sign in</a></nobr></div><center><br id="lgpd" clear="all"><a href="http://www.google.com/help/ig/art/index.html#name=koons"><img src="http://www.google.com/jeffkoons.gif" alt="By Jeff Koons" title="By Jeff Koons" border="0" height="145" width="242"></a><br><br><form action="/search" name="f"><table cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="25%"> </td><td align="center" nowrap="nowrap"><input name="hl" value="en" type="hidden"><input maxlength="2048" name="q" size="55" title="Google Search" value=""><br><input name="btnG" value="Google Search" type="submit"><input name="btnI" value="I'm Feeling Lucky" type="submit"></td><td nowrap="nowrap" width="25%"><font size="-2"> <a href="http://www.google.com/advanced_search?hl=en">Advanced Search</a><br> <a href="http://www.google.com/preferences?hl=en">Preferences</a><br> <a href="http://www.google.com/language_tools?hl=en">Language Tools</a></font></td></tr></tbody></table></form><br><font size="-1">What happens when great art mixes with your homepage? <a href="http://www.google.com/help/ig/art/" onmousedown="return clk(this.href,'promos','hppweb:en_us','pro','1','')">iGoogle Artist Themes</a></font><br><br><br><font size="-1"><a href="http://www.google.com/intl/en/ads/">Advertising Programs</a> - <a href="http://www.google.com/services/">Business Solutions</a> - <a href="http://www.google.com/intl/en/about.html">About Google</a></font><p><font size="-2">© 2008 Google</font></p></center></body></html>Of course, this is obviously the compressed/optimized version of the document, shared here mostly for the shock value. How bad is the uncompressed version? After taking the time to tab it all out, I almost cried. Check out the sadness for yourself:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Google</title>
<style>body,td,a,p,.h{font-family:arial,sans-serif}.h{font-size:20px}.h{color:#3366cc}.q{color:#00c}.ts td{padding:0}.ts{border-collapse:collapse}.lnc:link,.lnc:visited{color:#00c}.pgtab,.pgtab:hover,.pgtabselected,.pgtabside{text-align:center;text-decoration:none;color:#00c;display:block;height:27px;float:left;overflow:hidden;background:url(/intl/ja/images/productlinktabs.png) no-repeat;padding-top:8px}.pgtab{width:130px;background-position:-274px 0}.pgtab:hover{width:130px;background-position:-144px 0}.pgtabselected{width:144px}.pgtabside{width:3px;background-position:-404px 0}.ptr{cursor:pointer;cursor:hand}.iconl{background:url() no-repeat;overflow:hidden;height:px;width:px}#gbar{float:left;height:22px;padding-left:2px}.gbh,.gb2 div{border-top:1px solid #c9d7f1;font-size:0;height:0}.gbh{position:absolute;top:24px;width:100%}.gb2 div{margin:5px}#gbi{background:#fff;border:1px solid;border-color:#c9d7f1 #36c #36c #a2bae7;font-size:13px;top:24px;z-index:1000}#guser{padding-bottom:7px !important}#gbar,#guser{font-size:13px;padding-top:1px !important}@media all{.gb1,.gb3{height:22px;margin-right:.73em;vertical-align:top}.gb2 a,.gb2 b{display:block;padding:.2em .5em}}#gbi,.gb2{display:none;position:absolute;width:8em}.gb2{z-index:1001}#gbar a{color:#00c}.gb2 a,.gb3 a{text-decoration:none}#gbar .gb2 a:hover{background:#36c;color:#fff;display:block}</style>
<script>window.google={kEI:"tuMYSLXoO6T-gwPi3oz5Cw",kEXPI:"17259,17735,17866",kHL:"en"};
function sf(){document.f.q.focus()}
window.clk=function(b,c,d,e,f,g){if(document.images){var a=encodeURIComponent||escape;(new Image).src="/url?sa=T"+(c?"&oi="+a(c):"")+(d?"&cad="+a(d):"")+"&ct="+a(e)+"&cd="+a(f)+(b?"&url="+a(b.replace(/#.*/,"")).replace(/\+/g,"%2B"):"")+"&ei=tuMYSLXoO6T-gwPi3oz5Cw"+g}return true};
window.gbar={};(function(){var c=window.gbar,e,g,h;c.qs=function(a){var d=window.encodeURIComponent&&(document.forms[0].q||"").value;if(d)a.href=a.href.replace(/([?&])q=[^&]*|$/,function(f,b){return(b||"&")+"q="+encodeURIComponent(d)})};function l(a,d,f){a.display=h?"none":"block";a.left=d+"px";a.top=f+"px"}c.tg=function(a){var d=0,f=0,b,m=0,n,j=window.navExtra,k,i=document;g=g||i.getElementById("gbar").getElementsByTagName("span");(a||window.event).cancelBubble=!m;if(!e){e=i.createElement(Array.every||window.createPopup?"iframe":"DIV");e.frameBorder="0";e.scrolling="no";e.src="#";g[7].parentNode.appendChild(e).id="gbi";if(j&&g[7])for(n in j){k=i.createElement("span");k.appendChild(j[n]);g[7].parentNode.insertBefore(k,g[7]).className="gb2"}i.onclick=c.close}while(b=g[++m]){if(f){l(b.style,f+1,d+25);d+=b.firstChild.tagName=="DIV"?9:20}if(b.className=="gb3"){do f+=b.offsetLeft;while(b=b.offsetParent)}}e.style.height=d+"px";l(e.style,f,24);h=!h};c.close=function(a){h&&c.tg(a)}})();</script>
</head>
<body onload="sf();if(document.images){new Image().src='/images/nav_logo3.png'}" topmargin="3" alink="#ff0000" bgcolor="#ffffff" link="#0000cc" marginheight="3" text="#000000" vlink="#551a8b">
<div id="gbar">
<nobr>
<span class="gb1">
<b>Web</b>
</span>
<span class="gb1">
<a href="http://images.google.com/imghp?hl=en&tab=wi" onclick="gbar.qs(this)">Images</a>
</span>
<span class="gb1">
<a href="http://maps.google.com/maps?hl=en&tab=wl" onclick="gbar.qs(this)">Maps</a>
</span>
<span class="gb1">
<a href="http://news.google.com/nwshp?hl=en&tab=wn" onclick="gbar.qs(this)">News</a>
</span>
<span class="gb1">
<a href="http://www.google.com/prdhp?hl=en&tab=wf" onclick="gbar.qs(this)">Shopping</a>
</span>
<span class="gb1">
<a href="http://mail.google.com/mail/?hl=en&tab=wm">Gmail</a>
</span>
<span class="gb3">
<a href="http://www.google.com/intl/en/options/" onclick="this.blur();gbar.tg(event);return !1"><u>more</u> <small>▼</small></a>
</span>
<span class="gb2">
<a href="http://video.google.com/?hl=en&tab=wv" onclick="gbar.qs(this)">Video</a>
</span>
<span class="gb2">
<a href="http://groups.google.com/grphp?hl=en&tab=wg" onclick="gbar.qs(this)">Groups</a>
</span>
<span class="gb2">
<a href="http://books.google.com/bkshp?hl=en&tab=wp" onclick="gbar.qs(this)">Books</a>
</span>
<span class="gb2">
<a href="http://scholar.google.com/schhp?hl=en&tab=ws" onclick="gbar.qs(this)">Scholar</a>
</span>
<span class="gb2">
<a href="http://finance.google.com/finance?hl=en&tab=we" onclick="gbar.qs(this)">Finance</a>
</span>
<span class="gb2">
<a href="http://blogsearch.google.com/?hl=en&tab=wb" onclick="gbar.qs(this)">Blogs</a>
</span>
<span class="gb2">
<div></div>
</span>
<span class="gb2">
<a href="http://www.youtube.com/?hl=en&tab=w1" onclick="gbar.qs(this)">YouTube</a>
</span>
<span class="gb2">
<a href="http://www.google.com/calendar/render?hl=en&tab=wc">Calendar</a>
</span>
<span class="gb2">
<a href="http://picasaweb.google.com/home?hl=en&tab=wq" onclick="gbar.qs(this)">Photos</a>
</span>
<span class="gb2">
<a href="http://docs.google.com/?hl=en&tab=wo">Documents</a>
</span>
<span class="gb2">
<a href="http://www.google.com/reader/view/?hl=en&tab=wy">Reader</a>
</span>
<span class="gb2">
<div></div>
</span>
<span class="gb2">
<a href="http://www.google.com/intl/en/options/">even more »</a>
</span>
</nobr>
</div>
<div class="gbh" style="left: 0pt;"></div>
<div class="gbh" style="right: 0pt;"></div>
<div id="guser" style="padding: 0pt 0pt 4px; font-size: 84%;" width="100%" align="right">
<nobr>
<a href="http://www.google.com/url?sa=p&pref=ig&pval=3&q=http://www.google.com/ig%3Fhl%3Den%26source%3Diglk&usg=AFQjCNFA18XPfgb7dKnXfKz7x7g1GDH1tg">iGoogle</a> |
<a href="https://www.google.com/accounts/Login?continue=http://www.google.com/&hl=en">Sign in</a>
</nobr>
</div>
<center>
<br id="lgpd" clear="all">
<a href="http://www.google.com/help/ig/art/index.html#name=koons">
<img src="http://www.google.com/jeffkoons.gif" alt="By Jeff Koons" title="By Jeff Koons" border="0" height="145" width="242">
</a>
<br>
<br>
<form action="/search" name="f">
<table cellpadding="0" cellspacing="0">
<tbody>
<tr valign="top">
<td width="25%"> </td>
<td align="center" nowrap="nowrap">
<input name="hl" value="en" type="hidden"><input maxlength="2048" name="q" size="55" title="Google Search" value="">
<br>
<input name="btnG" value="Google Search" type="submit"><input name="btnI" value="I'm Feeling Lucky" type="submit">
</td>
<td nowrap="nowrap" width="25%">
<font size="-2">
<a href="http://www.google.com/advanced_search?hl=en">Advanced Search</a>
<br>
<a href="http://www.google.com/preferences?hl=en">Preferences</a>
<br>
<a href="http://www.google.com/language_tools?hl=en">Language Tools</a>
</font>
</td>
</tr>
</tbody>
</table>
</form>
<br>
<font size="-1">
What happens when great art mixes with your homepage? <a href="http://www.google.com/help/ig/art/" onmousedown="return clk(this.href,'promos','hppweb:en_us','pro','1','')">iGoogle Artist Themes</a>
</font>
<br>
<br>
<br>
<font size="-1">
<a href="http://www.google.com/intl/en/ads/">Advertising Programs</a> -
<a href="http://www.google.com/services/">Business Solutions</a> -
<a href="http://www.google.com/intl/en/about.html">About Google</a>
</font>
<p>
<font size="-2">
© 2008 Google
</font>
</p>
</center>
</body>
</html>Eeeewww. Lots to discuss here, but I will try to summarize with a simple screenshot:
Google home-page (in)validation via W3C
Um, yeah, 64 validation errors (at the time of this writing). That’s worse than my very first website back in the days of frames and table-based design!
As much as I heart Google (cough), I hate to see their blatant, high-profile disregard for Web Standards. Does Google hate Web Standards? Probably not, but it obviously ranks mighty low on their list of priorities. What if everyone were to follow the leader and design their web pages like Google? Assuming Google knows what they’re doing, does this mean that Web Standards aren’t effective, useful, or practical? Does it all come down to money? What do you think? Should Google embrace Web Standards or continue with business as usual? Sound off in the comments below!
About the Author
Jeff Starr = Web Developer. Book Author. Secretly Important.
28 responses to “Does Google Hate Web Standards?”
Me again!
@August Klotz
“build our sites to cater to the lowest common denominator and disregard the vast majority of people who actually care about Web Standards”
By catering for the lowest common denominator you are infact also catering for every denominator above. And until XHTML 2.0 or another non-backwards compatible language comes out, this will sadly always be a fact.
I have never looked at google as an example for my coding practice, and for anyone who knows a thing or 2 about HTML would not either.
so your arguement that they should set the bar is unfair, A website that should set the bar is a website that talks about such things. eg:perishablepress.com and If you actually look at the code behind this site its outstanding.
When I want to build a search engine, then I’ll start looking at google
“Why should any organization or individual bother with Web Standards if the most popular successful sites seem to deliberately avoid it”
Well when a billion people can find your site without the use of a search engine, you can disregard standards too.
@Perishable
Fully Agree, retract my comment.
1 more thing, If google served me a nice valid xhtml 1.1 document would the web world be a better place? Or would it simply promote the “hello world” self proclaimed web developer claiming they can code to standards because they put a sticker at the bottom of the document without even undstanding the underpinning knowledge of what xhtml is?
And for those of you who don’t know what I’m talking about. I mean the guy who does that website for 400 bucks, because they learnt frontpage in highschool. they also think marquee is cool!
It is all about the money, short and simple. It is an interesting subject to ponder though, glad that you threw it out there for us to think about.
Sir Thomas
Sir Thomas, if it is indeed all about money, then what does that say about Web Standards? There seems to be a disconnect between standards and success, which seems clearly exemplified by Google. In other words, the trend seems to be something like this: the more popular and successful the site, the less likely it is that Web standards are involved. Conversely, there are many great standards-based sites out there that receive very little in terms of traffic and/or financial gain.
Part1:
Although I agree that some of the big players have what we would class as a poorly coded front end. Saying you cant follow standards to be successful is wrong. For starters we haven’t defined ‘success’, so for the rest of this post I will define ‘success’ as reach and not revenue.
Then in your survey of 1 website which happens to have the 2nd highest reach in the world (according to alexa) we notice they have poor “standards”
so lets, look at a few other “successful” websites,
yahoo, blogger, facebook, myspace, msn and wikipedia.
Of those websites 1 passed validation > wikipedia.
So the argument of “success” or “standards” is gone, wikipedia has proven we can have both.
Some good points, however, I am not declaring anything as fact, I am merely noting observed trends. In my experience, I agree that most of the “big players have … a poorly coded front end.” Rather than saying that you “cant follow standards to be successful,” I am merely suggesting that there seems to be a disconnect between embracing Web Standards and both reach and revenue. As you say, only one of the most highly visible sites passed validation. That goes to support the suggested notion, not disprove it. Further, according to your logic, it is impossible to disprove the idea just because one out of six sites managed to pass the test.
Moving on slightly while I think of a rebuttal.
I guess standards can also come down to awareness. Once you learn of them its hard to get away, all coders want to cut some fantastic code (even if it is just markup). and learning about standards opens up so many fun doors to tackle and quickly the developer join our pro standards club. BUT, when the awarness is not there the road is the opposite.
true story > I applied for a contract taking on overflow for a web development firm. Now its important to remember this is an actual web development firm, not some small time basement geek.
1 Requirement was “hand coding HTML”
Fair enough, I was rejected because they thought I used dreamweaver (which I do), but what is outstanding is how they came to that conclusion, they saw dreamweaver generated code in my sites. Guess what I’m referring to…. the doctype!!!
Now, Im sure google have awarness of standards, thats not my point. In fact there is no real point. Just a rant which sort of fits in to this topic.
I guess what I am trying to get at here is that, yes, obviously those of us who actually care about Web Standards can indeed enjoy the best of both worlds, however, when the largest, most successful sites on the Web seem to flagrantly disregard the entire concept (as demonstrated by this single case study of the world’s second most popular site), their examples serve to work against and even discredit the entire cause. Perhaps another way of communicating my concern is to imagine how much further the practice of Web Standards would be if Google, Microsoft, and other corporate giants were to show their support. For example, just imagine if Microsoft had embraced Web Standards right from the start.. How much proprietary suffering would have been alleviated if previous versions of IE actually behaved according to the principles of Web Standards?
Manual trackback: http://meiert.com/en/blog/20081002/web-standards-at-google/
I think the point is that not one of us would even consider coding a page like Google’s, unless we were creating a spoof. It is such a mess.
obeying standards will never hurt if ever void. but Google may think about supporting an ice-age browser or care about things i don’t care of its existence while those “giants” have to. something in future may emerge being highly sensitive to web standards, then Google and yahoo will work anything around while i will just regret being old fashioned few years ago (now).
it’s not wise fighting or just ignoring a standard of ANY kind!
for i would be living happier if IE6 was never there.
me again, i do support reply#20 of Perishable