Is quirks mode relevant in 2011? - html

With all the latest browsers like IE9, FF4, ever updating chrome, etc., do we still need quirks mode?
If yes where is it useful? In which scenario?

Quirks mode is designed to allow (much) older websites to work in (comparatively) newer browsers.
New development should never be done in Quirks Mode, but Quirks Mode will stick around as long as there are still old un-updated websites that require it (ie, forever).

No. You should never use quirks mode. It ceased to be of any relevance once IE 5.0 and 5.5 stopped being used.
Those were the last browsers which did not support standards mode, so any sites which needed to include support for them would have needed to be able to work in quirks mode.
However, IE6 along with all versions of all browsers released since then supports standards mode.
Some of them still carry legacy support for quirks mode, but you shouldn't allow them to use it. (it's triggered if you neglect to include a <!DOCTYPE> at the top of your HTML code, which is why you shold always declare a doctype)
In the unlikely event that you need to support IE5, then use quirks mode. Otherwise, avoid at all costs.
If you are maintaining code that uses quirks mode then you should take the time to convert to use standards mode.
If it's a public-facing website, then using quirks mode now should not even be contemplated, as it will look hideous in a lot of modern browsers. Even if it's in a corporate environment then you I would strongly reccommend converting it to standards mode, as even IE6 users will benefit from that (if nothing else, it'll make their eventual upgrade to a newer browser less painful). The only time you won't be able to use standards mode that is if you have a client who is still stuck with IE5. But if you've got that, then you should have run away screaming already.

Quirks mode is definitely still needed in corporate environments where legacy applications are very common. That old 1998 webapp still works and we don't have money to replace it so it has to keep working.

Related

What are the specific differences between IE-5 quirks mode and existing strict standards

I am working on some older software, some of which was written for IE-5 quirks mode. We currently use meta tags to display the code in IE-5 quirks compatibility mode. I am trying to assess the feasibility of refactoring it to a stricter compliance with existing standards.
It will make this job much easier if I can obtain a list of deprecated/nonstandard features present in IE-5 quirks mode. If there is a "IE-5 quirks to HTML 5 strict" dictionary I would consider naming my firstborn after whoever can find it (in lieu of a bounty).
The closest answers I have been able to find are:
difference-between-quirks-mode-and-standards-mode-javascript. Which unfortunately appears to be limited to IE-9 quirks
How to force Internet Explorer to view a page in compatability mode (or not) which appears to take more of a scatter-gun approach (I am looking for something a little more comprehensive).

is quirks mode legit?

I was on vacation without access to my good friend Internet Explorer, and I threw together a pretty complete web app. When I got home, I was surprised and encouraged to see that my site was working in IE... until I threw in any sort of valid doctype. I know it isn't best practice to throw browsers into quirks mode, or it wouldn't be called quirks mode, but I guess my question is... what are the practical ramifications of having a 'quirks mode' site? Is it necessary or even worth it to painstakingly slave away to correct the issues of which I am yet unaware, or can I leave it as is, functioning cross browser? Thanks.
If your site renders wrong in standards mode, but correct in quirks mode, chances are it's errornous. Some current browsers may fix your mistakes even in standard mode, but you have no idea about what future browsers will do with it. With standards mode, you can be absolutely sure that a valid site that looks fine in modern browsers will show up correctly.
Browsers are more interoperable, i.e., have the same behavior as each other, in the no-quirks mode compared to the quirks mode. The no-quirks mode is what most Web standards people and browser developers care about and consider and test. So it's more likely that you run into differences between browsers in quirks mode.
For example, in quirks mode, the body fills the viewport in WebKit/Blink, but does not in Gecko (I'm not sure about Edge). In no-quirks mode, body height works the same in all browsers.
(There's one counter-example, though, where browsers agree in quirks mode but not in no-quirks mode: body being the "viewport scrolling element" for scrollTop etc.)
Some versions of IE (8 and 9?) deliberately had less features in their quirks modes (e.g. the canvas element). So if you care about IE and want to be able to use the features IE actually supports, just not in quirks mode, then that would be another reason to not use quirks mode.
Finally, and maybe obviously, you're likely to run into more "weird" behavior that is the quirks themselves, like color and some other stuff not inheriting into table elements, that top and bottom margins collapse more, IDs and classes being case-insensitive, and so on.
Declaring a proper doctype is technically required for HTML validation by W3; however, lots of people leave their code un-doctyped for browsers to use Quirks mode instead. I've done this many times and it usually works out fine; however, you run the risk of browsers not interpreting your code correctly.
In other words, the cross-browser functionality you speak of could very easily break down into cross-browser hell without valid doctype declarations.
A.k.a., it's up to you as to how robust your site needs to be.
Quirks mode typically is the browsers attempt at fixing your errors in order to render correctly, however it's important to remember that if your site renders in standards compliant mode it will likely render ok with future browsers (at least for the time being).

Site not displaying correctly in IE

Can somebody explain me why my site is not displaying correctly in internet explorer:
http://shortener3.info/web/
The choice of Doctype (Transitional with no URL) triggers Quirks mode, which causes browsers to emulate bugs that appeared in earlier browsers in order to cope with legacy code.
IE emulates a lot of features of IE 5.5, which was very very broken.
Use a Doctype that triggers Standards (AKA Strict) mode.
That might not solve all the problems, but it should be the first step in trying to resolve them.

Should I use almost standards mode for all browsers?

I am working on a project which requires IE6 compatibility. Unfortunately, IE6 and IE7 do not support standards mode. Because of this, I am tempted target almost standards in for all browsers and just ignore standards mode completely, so that I am only targeting browsers running in the same standards mode. I figure that because XHTML transitional is so popular, almost standards most is guaranteed to be supported for a long time to come. Is this a good idea?
No, this is not a good idea.
Its not a good idea because eventually IE6 will be obsolete (sooner rather than later) and you will have a messed up site where you have to jump through hoops to get it to look halfway decent.
A better solution is to use progressive enhancement, in a nutshell support the minimum you need for IE6 and give the modern standards following browsers the goodies.
With progressive enhancement you still get your support for IE6 but you're left with a standards based website that is easier to maintain and develop further.
Using "almost standards" mode is dumbing down other browsers for the sake of IE. IE6/7 doesn't support a standards mode because it's incompetent. You should never write markup aiming at incompetence. Write modern markup with a strict doctype and use "conditional comments" to hack and beat IE into the best compliance you can get out of that thing or you will be doomed to a world of darkness and hurt.
Roughly 40% of the user base of my company's software uses IE6 (down from ~60% a couple years ago).
Our master pages have the XHTML 1.1 doctype set. I do all my design work using the latest version of Firefox and then once I have it all working how I want, I test in IE6 using the App Compatibility VMs for Virtual PC that MS releases, and make any necessary changes to my CSS that IE6 requires.
Most of the time I can just use slightly different CSS and don't have to resort to hacks, although sometimes I still do. But the hacks don't affect other browsers, since they're IE6 specific. I haven't gone to the length of using browser-specific CSS files yet, cause the extent of my IE6 hacks are something on the order of 10 lines out of ~1500 lines of CSS. My modified CSS to "support" IE6 still renders fully standards-compliant in Firefox.
EDIT: thanks to Rob's comment I'll be changing my doctype to "HTML 4.01 Strict with system identifier" (provided testing shows that it doesn't break anything). That Quirks Mode chart on Wikipedia shows my current doctype (XHTML 1.1 with system identifier and without XML declaration) results in the same render modes.
Everything I said above still applies, though. I code for standards-compliance in the latest version of Firefox (the Web Developer add-on is my friend) and then "make IE work" without breaking standards-compliance in Firefox.

What are the benefits of rendering in Standards Mode (besides more predictable rendering)?

I'm working with a Web Application and it's currently rendering in Quirks Mode. My feeling is that we should change this to use Standards Mode.
If were make this change there will be some pain in the short term as I would expect some of the pages that currently render fine in Quirks mode will need tweaking to show properly in Standards mode. If I'm going to do persuade other people this work there will need to be some benefits too.
Whilst easier page layout would be nice I'm not sure it would be enough on its own - as most the design for the app is done - so I was wondering if Standards mode offers any other more immediate benefits. Do pages render quicker? Will the browser use less memory? Anything else?
For what it's worth this application is used almost exclusively on IE6/7/8 but I'd be interested to hear how this applies to other browsers too.
Here are the benefits to standards mode:
1) Correct and accurate code is easier to maintain among a group of developers.
2) Standards mode produces a more reliable rendering of the content, which is important for cross user-agent compliance with regard to assistive technologies.
3) Code that is uniform and valid is easier for accessibility concerns.
4) Your code will have a far longer lifespan without conflict to future changes in the specification.
To add to austin's comment, there's a pretty good read over here about the differing modes: CSS - Quirks mode and strict mode
Yes, some of your markup will probably no longer be valid once you transition to standards mode. Developing under quirks mode targets older browsers that were programmed before CSS was accepted by Netscape and IE.
Since most browsers today are capable of rendering the W3C standards, I'd recommend targeting that as your goto mode. Sure it will be slightly painful now, but in the long run it is well worth it.
I don't know about your user base, but allowing the use of non-IE browsers - that count for over 35% of the global market - will surely please some of your customers. Using quirks mode almost forces your users to stick to IE.
At some point (probably in the distant future, though) IE will drop quirks mode, then you'll have to recode anyway. Better to do it now before your code grows beyond repair. Switching to a strict doctype now will save you development time as soon as you fix the initial problems.
I'd suggest trying the strict doctype and seeing what happens, and how broken the design is. Remember, the HTML doesn't have to be valid for strict mode to work. Font tags and alignment elements/attributes work fine in strict mode, though you should gradually phase them out and replace with CSS.