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 = Fullstack Developer. Book Author. Teacher. Human Being.
28 responses to “Does Google Hate Web Standards?”
I assume that Google cryptic markup is responsible for the homepage surreal loading time performances.
There is very little interest for them to have semantic content, but speed is their very first priority (and search relevance, of course).
Altough, I would like Google to serve the markup you show, it’s gorgeous.
I really like this bit:
class="ft t bb bt">now tell me what that refers to when it comes to styling the page :-)
I’m guessing it was done in order to save a few precious characters worth of bandwidth. If they used markup more like your example they’d save a lot more though.
Each result on the result page seems to be contained in a table with one row and one column too which seems massively overkill. There’s even an extra div inside the lone table cell performing no extra function whatsoever :-/
So yeah, pitiful…
This the one I like best for validation errors:
http://www.adobe.com/products/dreamweaver/
22 XHTML validation errors
469 CSS validation errors (yes, four hundred and sixty nine!)
Now what’s their excuse?
Interesting, as this comes right on time.
Louis, I didn’t refer to Google in my post … however, expect something on Google and web standards soon. I am very well aware of the fact that people miss some explicit commitment to web standards from Google. Meanwhile please rest assured that people like Ian Hickson, Dustin Diaz, Mark Pilgrim, and me are not quite idling.
LOL indeed that is an odd thing to see; considering google seem to setting the defacto in some parts of the net and failing in the older ones.
Well, defenders of Google will say that the are using that way to save bandwidth, the site is 100% compatible with every browser. I personally think that bandwidth is not a real problem for Google, cause a lot of their development may be more optimized.
I just think that big companies like Google and IE don’t care. They probably think “We are the standard” and that’s bad. To be really honest, I don’t care about their standards, I am doing my job correctly and that’s it ;) I just hope that we are not penalized in SEO to have better standards.
@Mathieu Beausoleil: If that’s true, then is the practice of Web Standards incompatible with bandwidth optimization and browser compatibility? I mean, you are right — Google has been raping the competition for years now, and they have been doing it without a hint of this thing that you and I refer to as “Web Standards”.. What do they know that we don’t?
@Perishable: Well, Web Standard is a good practice, but compatibility with very-old browser is impossible (for layout). But who use them ? Who use Netscape3 and don’t have the habit to stall on the first page ? The bottom line is: Yes to compatibility, but just keep accessibility guideline, and for others, have fun with a text version of pages ;)
Seriously who cares about google’s markup. they have no need for semantics enless they want to rank higher on yahoo?
As well (having never tested this) google would run on every imaginable browser under the sun. and when you think of it in terms of 1 percent do not use a standard or modern browser, we are looking at 100’s of millions of people trying to view this site. And it pains me to say it but table based layouts are reliable.
Then you have these alpha geeks that would argue this XHTML 1.1 complaint page I am currently posting on is not being served as application/xhtml+xml, and such this xhtml 1.1 page is infact not complaint to current web standards…. Ironic!
Further more to that, IE does not even understand that MIME type. Technically, according to the specs, it is impossible to serve a xhtml 1.1 page to IE.
Browser do no plan realases based on when the next standard comes out, and that 1 fact means you cannot realibly determine how your page will display. Its backwards, but the older standards you apply the more likely it will work. And since the search engine side of google have no real need for the latest css3 classes, why bother keeping up.
Any guys, I agree with you all. Just thought I would put some other ideas forward.
Okay, how about something like this: Web Standards is a nice idea, but ultimately impractical and unrealistic, especially if you want your site to “run on every imaginable browser under the sun.” Use tables instead, because they are more reliable than standards-based (X)HTML/CSS designs. For the sake of the one-point-whatever percent of users without a modern browser, let’s build our sites to cater to the lowest common denominator and disregard the vast majority of people who actually care about Web Standards, technological progress, and other useless stuff like that.
Seriously, if the Google homepage is indeed the most popular, highly visited page on the Web, it certainly must be serving as an example to, and influencing the designs of many other sites, especially the ones that are doing everything they can to be like the “big players” and dominate the market. Why should any organization or individual bother with Web Standards if the most popular, highly successful sites seem to deliberately avoid it. Whether intentional or not, Google’s disregard for Web Standards conveys the message that standards-based design is not important — if not altogether detrimental — to be the best on the Web. In other words, Web Standards is a nice idea, but ultimately impractical and unrealistic.
@James: Some great points — thanks for sharing them with us! As for the XHTML 1.1 page that you are currently looking at, I have gone through great lengths to take seriously and implement properly the principles of modern, standards-based design. As you say, Internet Explorer does not deal well with content served as
application/xhtml+xml. In a perfect world, standards-based design could be implemented on every site and rendered perfectly in every browser. However, as we know, certain browsers are somewhat less than perfect. How to deal with this discrepancy? Until I find the time to implement a content-negotiation technique, I have two choices for serving XHTML 1.1: compromise and accommodate IE users, or let them eat dust. As I would rather help people than ignore them, I chose to compromise my standards-based design by serving it — temporarily — astext/html. Within this context, there is nothing “ironic” about compromising in order to accommodate those who have yet to comply with Web Standards.