The Only Way to Deal with Internet Explorer

ie.gif

  • Microsoft Edge will soon officially be Chrome inside.
  • Microsoft no longer supports IE. No one should be using it.
  • We can still support IE and just disable CSS and JS.
IE Can Die, Die, Die

Not a single living soul has justification for ever using IE, that ridiculous dinosaur that set the Web back a full decade by having to always cater to its inexcusable inferiority and morally bankrupt approach of purposefully thwarting established standards. Now that the knights of the new Microsoft have officially announced Edge will be built on Chromium, IE simple does not deserve to exist, at all. May it find a not-so-cozy spot next to other nefarious tech creations in Hell, perhaps just down the burning hallway of brimstone offices with monkey-boy Balmer's at the end.

It is All Just Chrome, Almost

Almost everything will essentially be Chrome so far as web developers are concerned. This is a monumental and glorious moment in tech history. It means that we are closer to a consistent development standard for web and therefore software development than we have ever been in history.

With Chrome PWA support—and their announcement of making PWA icons appear on the desktop like any other apps—we will soon be able to get rid of Electron as well. At that point the Web platform will essentially have become the desktop OS, as so many have predicted. It's not a question of if but when.

Media Queries to the Rescue

So, how do we progressively banish IE from existence?

During some research on this topic I digitally unearthed this wonderful article from Oliver Williams. I recommend reading the whole thing. It contained a solution so well thought out I had to wonder why everyone was not already doing it. It seems the only reason is not knowing about it. So here I am to shout it from my own house top.

📣🎅 No really, I'm literally sitting on my roof surrounded by Christmas lights looking at a bunch of uninterested but curious neighbors.

“Use media queries to block all styles from old browsers then use matchMedia() to do the same for JavaScript!”

They look so confused. At least they are smiling. I do hope Oliver and Alex would be proud.

The solution is simple. Support IE users as the progressive law-makers require, but punish them by turning off all CSS styles and JavaScript. Then make sure your web site is readable with them off.

By the way, if you can't read your web site with them off there is a very strong chance neither can Google. Your site is unsearchable. The irony is that any web site should support being viewed without JavaScript and CSS enabled but few modern web developers care about that—even though they should. (Careful, you might earn an office next to monkey-boy's. 😉)

💢 Yes, I do know all about JavaScript enabled Google crawling (thank you for asking) but it is still very risky as anyone regularly reading the Google JavaScript Sites in Search Working Group will attest. This is why so many SPAs built with Angular, React, and Vue are failing miserably and things like the ridiculously redundant server-side static rendering used everywhere by otherwise reasonable people exists. (I'm looking at you Gatsby and VuePress.)

Before you flame me, why don't you actually look at the incredibly unnecessary hoops Gatsby, VuePress and others jump through just to build a documentation site that should never have been an SPA to begin with. Definitely a face-palm. All the bloated, unnecessary WebPack tooling is enough to make most reasonable web developers shudder, or worse, go back to Rails or WordPress. Hey, I hear Facebook is hiring.

[Mark's office is already prepared next to Ballmer's. They finished it shortly after he screwed over his Harvard College buddies making PHP web sites ranking people by their looks against one another promoting the objectification of the entire ivy league. Yeah, let's all get in line to reward that behavior. The Russian trolling and privacy stuff just added a nice bubbling lava fountain in the corner of his office in Hell. At least Ballmer will be jealous. Exploitation is never innovation.]

Turn Off CSS for IE

This little nugget blew me away with its simplicity and cleverness:

<link id="mustardcut" rel="stylesheet" 
	href="stylesheet.css" 
	media="only screen, 
	only all and (pointer: fine),
	only all and (pointer: coarse),
	only all and (pointer: none), 
	min--moz-device-pixel-ratio:0) and
	(display-mode:browser), 
	(min--moz-device-pixel-ratio:0)">
1
2
3
4
5
6
7
8
9

Oliver cites work from Andy Kirk to help achieve it. Thanks to these two amazing people we have a reliable way to disable styles for anything older than the following:

  • Edge
  • Chrome (and Chrome for Android) 39+
  • Opera 26+
  • Safari 9+
  • Safari on iOS 9+
  • Firefox 47+

Turn Off JavaScript for IE

The media query is key is all we need so we can use some conditional JavaScript tied to it:

(function() {
var linkEl = document.getElementById('mustardcut');
if (window.matchMedia && window.matchMedia(linkEl.media).matches) {
	var script = document.createElement('script');
    	script.src = 'your-script.js';
    	script.async = true;
    	document.body.appendChild(script);
	}
})();
1
2
3
4
5
6
7
8
9

This is very old JavaScript ensuring it is supported by the oldest possible browser that supports it. All of your actual JavaScript can now be written for the latest browsers without as much worry/transpiling/polyfills as before.

Tell the User Why

Even though Oliver does not explicitly mention it, I will. It is always good to let the user know why they are being punished:

  <p id=browser-warning>
	<b>Either you are using a text-based
	browser or you really need to upgrade.</b>
	<br>
	Styles and JavaScript have been disabled.
	Please consider upgrading.</p>
1
2
3
4
5
6

I place that as the absolute last thing in the page and set display: none in the style sheet if it loads. That way only those with styles disabled will see it. Because it is at the bottom of the page there is less chance it will be included in any Google search indexing, at least in any significant way.

This approach is far more reliable than any of the <!-- if IE --> things in common use today.

Testing Old Microsoft Internet Explorer Versions

Turns out Microsoft wants IE dead as much as anyone and has created their own virtual machine images with old versions of IE that you can use to test stuff out. [That's how I got the animated GIF at the beginning.]

Say Grace

I am so personally grateful to see such a small but important thing in my life-time. If Microsoft can change, so can we. With all that is going on in the world it is good to see something that never deserved to live die the justified death it always deserved, and by the very company that created it in the first place.

There is hope for us all. 😁