INTRODUCTION
Following the Web Standards makes perfect sense when it allows you to build easy to mantain websites that work with the major browsers. It doesn’t make sense when using Web Standards forces you to use hacks, prevents you from taking advantage of a great technology/feature or makes your job as a web designer or developer more difficult.
Let’s take a look at 3 very useful technologies that are not in the Web Standards, but do not have any of the negative consequences associated with browser specific code:
- IE conditional comments: for cross-browser CSS layouts.
- AJAX - using the XMLHTTPobject: for behind the scenes browser to server communication.
- The innerHTML property: for quick and easy DOM manipulation.
Though each of the above are not part of the Web Standards, they provide terrifically useful functionality without any hangups.
IE CONDITIONAL COMMENTS
Though IE conditional comments only work in IE, it makes great sense to use them when you want to isolate code. Since all other browsers will see IE conditional comments as being only HTML comments, there can never be a down side to IE conditional comments. It is the proper way of dealing with IE 6’s problems with CSS code.
Example:
<head>
<link href="standardStyle.css" rel="stylesheet" type="text/css" media=screen>
<!–[if IE 6]>
<link href="ie_style.css" rel="stylesheet" type="text/css" media=screen>
<![endif]–>
</head>
In the above example, we use IE conditional comments to hide IE specific CSS from all other browsers. Spefically, the IE conditional comments:
(<!–[if IE 6]> and <![endif]–>)
is loading the ‘ie_style.css’ style sheet only if the browser reading the page is IE6.
IE conditional comments are a replacement for dangerous CSS hacks that are commonly used to deal with IE’s occasional problems with standard CSS.
AJAX
The heart of AJAX is in the XMLHTTPObject - a JavaScript function built into every major browser but is NOT part of the Web Standards. Given how powerful AJAX is, and given how popular it has become, you can be sure that every major browser will continue to support it.
So as a Web Standards zealot, you have to ask yourself whether blind adhereance to the Web standards is worth missing out on this important tool? That is to say, if you’re a web standards zealot, you couldn’t/shouldn’t use AJAX since it is not part of the official Web standards … it’s your choice.
INNER HTML PROPERTY
InnerHTML is an easy to use property supported by all the major browsers that allows you to dynamically update/change web pages without having to do a page refresh.
Example using innerHTML:
var targetDiv = document.getElementById("targetDiv");
targetDiv.innerHTML = "<p>innerHTML is fast and easy!</p>"
Example using DOM methods:
var para = document.createElement("p");
var targetDiv = document.getElementById("targetDiv");
targetDiv.appendChild(para);
var txt = document.createTextNode("Dom methods are much longer than innerHTML");
para.appendChild(txt);
As you can see with the above examples, to insert text with DOM methods takes a lot more code than innerHTML. So, should you use innerHTML?
The answer: Browser makers typically don’t remove functionality, and given that innerHTML is supported by all the browsers and is easy to use, this is yet another example where I will break from the standards and feel comfortable about it.
Hey Stef,
good post.
Ajax is in fact being watched by some in the accessibility community for use in accessible web sites, it is prefferable to normal JavaScript.
However one should mention that InnerHTML will not work with True XHTML (1.1 & 2.0 or 1.0 when) served correctly as XML. InnerHTML cannot be used with XML, so can only be used when XHTML 1.0 is served as HTML “Tag Soup.”
“InnerHTML will not work with True XHTML … can only be used when XHTML 1.0 is served as HTML ‘Tag Soup.’”
Nor does XHTML work with about 80% of the browsers being used - IE 6 and soon to be released IE 7. XHTML becoming ‘tag soup’ is a reality for today’s web designer.
Personally, I believe people should not use XHTML since for the most part, there is no real advantage given the IE issue and because it makes DOM and AJAX scripting a pain in the ass for no advantage.
-
Since all the major browsers support innerHTML and given that it’s such a useful tool, I would think that one day, it may be made part of the standard … why not?
Mmhh…
It seems like everybody has forgotten the time pre-webstandards. The good old days…
When a page is not build according to webstandards and it still works fine, what is actually the problem ? (Please do not list them) Isn’t it all marketing- and searchengine crap ?
I am a validating-junkie but I am wondering more and more.
So if there is a nice gadget that will not validate I encourage people to use it, this so some gadgets could become standard…Isn’t that the way !?
Erick,
I think the Web standards are a good thing and was/is really needed. My point is that some people have taken it a little too far.
A culture has developed in web design, that has created extra work for people in an attempt to be Web standards compliant, regardless of the reality out there: browsers are not fully compliant to the standards.
Excellent post,
It helps put things into perspective. I believe that web based technologies should be fast, coherent and easy to use. You highlight good points. Perhaps a more comprehensive standard, or use based standard would be more suitable to this evolving medium.
men,
this discovery is quite fantastic, web standards are norms that restricts one to some extent
i think ajax is better than the normal java
kudos, keep moving
Ajax is a combination of technologies:
JavaScript / DOM scripting
XML
When you say Java, I assume you mean JavaScript.
Common sense article I think. My opinion of web standards has always been that they are worth following - until they interfere. Which is as good as saying “dump them whenever you want”. Seriously, what is a standard? It’s just a convention you should probably use to be compatible with the major browsers. But that means that the true web standard is not what freakin’ w3c puts out but whatever the major browser platforms decide to make it.
Seriously, if it’s available in IE and firefox - its as good as a standard.
WOW….I sure wish someone would come up with a simple way that new web site builders could get a better start.
And could understand all the jargon that is suppose to be such a big help.
In other words……build me a simple web site that I could keep going. To change as I wanted, or add what I wanted, etc.
I am sure this comment does not pertain to what is being said here…..but in a bigger way…..it does pertain to all that is said here.
“… come up with a simple way that new web site builders could get a better start. And could understand all the jargon that is suppose to be such a big help.”
The answer is simple, just spend a couple of hours learning the basics. Once you have them under-your-belt, it’s a no brainer to learn the other stuff … actually it turns out to be much easier than you think.
Check out:
http://www.killersites.com/videoTutorials/Tutorial_WebDesign/webDesign.jsp
Or
http://www.how-to-build-websites.com/
While I agree with some of what you wrote, I think you (and those who wrote comments) have missed the point of web standards. Obviously, standards aren’t rules…they’re guidelines. The question is, “What are they designed to do?”.
Web standards are designed to make websites better from the ground up. Having built websites for almost a decade, I can tell you that life is a million times better than during the browser wars. Many designers had to build two websites: one for Netscape and one for Internet Explorer. We don’t have that problem today…simply because we’ve begun to standardize the web.
Many people haven’t thought it through, but you don’t END with web standards…they’re just the beginning. Validate your HTML and CSS and then add your javascript layer. Validate your HTML and CSS and then add your embedded flash video. Validate your HTML and CSS and then add your AJAX. Don’t abandon the reason websites work just because your enhancements won’t validate…use them and rise above them!
When you begin with valid (X)HTML and CSS, you reap the benefits: less cross-browser testing, lower bandwidth costs, simpler code, better search rankings, and portability. Make your killer website, but don’t shoot yourself in the foot in the process.
Thanks for an interesting conversation!