Here's how to make your site not load CSS and/or JS in IE older than 11:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=8,9,11">
<title>Page title</title>
<!--[if !IE]>-->
<link rel="stylesheet" href="styles.css">
<!--<![endif]-->
</head>
<body>
CONTENT
<!--[if !IE]>-->
<script src="scripts.js"></script>
<!--<![endif]-->
</body>
</html>Starting from January 12, 2016 only IE 11 is supported in Windows 7 or newer; older versions should die quickly. If your site has readable static content, you may reduce the testing burden by not sending JS (and maybe even CSS - your choice) to versions older than 11.
IE reads the X-UA-Compatible meta tag and tries to apply each setting from left to right. This e.g. means IE 8 will understand the IE=8 part but will drop IE=9 and IE=11. As a result, all IE from 8 to 11 will get their most standards-compliant document mode except IE 10 which will get the IE 9 mode. That should be OK, though, as we're not loading JS & CSS.
One way to not run JS in older browsers is to start the JS file with something like:
(function () {
'use strict';
if (typeof Map !== 'function') {
return;
}
/* code */
})();However, this still makes old IE download the JS file that it doesn't need.
Another way would be to load JS and/or CSS via a small JS script that does the above detection. That puts modern browsers at a disadvantage, though - they try to prefetch scripts as quickly as possible but they can't see them from the start if they're loaded dynamically.
Using conditional comments alleviates both those problems.
The IE=8,9,11 value will make IE 8 or newer run in one of the three modes: IE 8, IE 9 or IE 11 mode. That would have been problematic a few months ago but now we know there will be no IE 12 and Microsoft Edge ignores the X-UA-Compatible meta tag so such a value is safe.
IE 10 by default ignores conditional comments so forcing it to IE 9 mode is necessary to restore this hack.
In a few years when you want to skip JS/CSS in IE 11 as well, all that's needed is to change the value from IE=8,9,11 to IE=8,9.
This no longer appears to work in IE 11. Suggestions?
I'm using the following in the
head: