{"id":287269,"date":"2019-05-06T07:22:50","date_gmt":"2019-05-06T14:22:50","guid":{"rendered":"http:\/\/css-tricks.com\/?p=287269"},"modified":"2019-05-06T07:22:50","modified_gmt":"2019-05-06T14:22:50","slug":"a-conspiracy-to-kill-ie6","status":"publish","type":"post","link":"https:\/\/css-tricks.com\/a-conspiracy-to-kill-ie6\/","title":{"rendered":"A Conspiracy to Kill IE6"},"content":{"rendered":"

Chris Zacharias published a few notes about why the team at YouTube added a banner that asked users to switch from IE6 to a more modern browser back in 2009: <\/p>\n

\n

The bittersweet consequence of YouTube\u2019s incredible growth is that so many stories will be lost underneath all of the layers of new paint. This is why I wanted to tell the story of how, ten years ago, a small team of web developers conspired to kill IE6 from inside YouTube and got away with it.<\/p>\n

I do not recall the exact triggering event that led to our web development team laying out plans to kill IE6 over lunch in the YouTube cafeteria. Perhaps it was the time I pushed out a CSS stylesheet that included an attribute selector on a semi-supported HTML element. Any reasonable web developer would expect this to be ignored by browsers not up to the task. This was not the case with older flavors of IE. Under very specific conditions, an attribute selector on an unsupported HTML element in IE would create an internal recursion that would at best, cause the browser to crash and at worst, trigger a blue screen of death.<\/p>\n<\/blockquote>\n

<\/p>\n

There are a lot of interesting things to consider here. IE6 was notoriously difficult for developers to work with and would cause teams to spend a great deal of time fixing game-breaking bugs for what often represented a mere slither of their overall site traffic. However, it\u2019s important to note that as soon as you make a call like this, where do you stop? It suddenly becomes easier to make a Chrome-only website, to ignore basic accessibility principles, to ignore semantic markup, and to make a website optimized for yourself. That leads us to more sticky topics, such as browser diversity<\/a> and proprietary resources<\/a> that seem at odds with an open, inclusive web<\/a>.<\/p>\n

I\u2019m reminded here of Jeremy Keith\u2019s book, Resilient Web Design<\/i><\/a>, where he writes<\/a>:<\/p>\n

\n

If a website is built using progressive enhancement then it\u2019s okay if a particular feature isn\u2019t supported or fails to load: Ajax, geolocation, whatever. As long as the core functionality is still available, web designers don\u2019t need to bend over backwards trying to crowbar support for newer features into older browsers.<\/p>\n<\/blockquote>\n

And Jeremy quotes Mat Marquis, who happened to work on the responsive redesign of The Boston Globe<\/i>, where he argued that:<\/p>\n

\n

Lots of cool features on the Boston Globe don\u2019t work when JS breaks; \u201creading the news\u201d is not one of them.<\/p>\n<\/blockquote>\n

Maybe there\u2019s a middle ground here; maybe there\u2019s not. But I find Mat and Jeremy\u2019s approach to be more inspiring and kinder to the overall health of the web.<\/p>\n","protected":false},"excerpt":{"rendered":"

Chris Zacharias published a few notes about why the team at YouTube added a banner that asked users to switch from IE6 to a more modern browser back in 2009: The bittersweet consequence of YouTube\u2019s incredible growth is that so many stories will be lost underneath all of the layers of new paint. This is […]<\/p>\n","protected":false},"author":223806,"featured_media":287298,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":[]},"categories":[17],"tags":[1465,1451,1068],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/05\/ie6-skulls.png?fit=1200%2C600&ssl=1","jetpack-related-posts":[],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/287269"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/223806"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=287269"}],"version-history":[{"count":7,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/287269\/revisions"}],"predecessor-version":[{"id":287297,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/287269\/revisions\/287297"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media\/287298"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=287269"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=287269"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=287269"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}