<!DOCTYPE html>
<!-- ========================================== kroc camen of camen design ============================================= -->
<title>code · Why HTML5 `&lt;figure&gt;` Doesn’t Have to Work in IE</title>
<link rel="stylesheet" type="text/css" href="/design/design.css" />
<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=no" />
<link rel="alternate" type="application/rss+xml" href="/code/rss" title="Just code" />
<link rel="canonical" href="/code/it_figures" />
<!-- =================================================================================================================== -->
<header>
	<h1><a href="/" rel="index">
		Camen Design
	</a></h1>
	<nav><ul>
		<li><a href="/">all</a></li>
		<li><a href="/projects">projects</a></li>
		<li><a href="http://forum.camendesign.com">forum</a></li>
	</ul><ul>
		<li><a href="/quote/">quote</a></li>
		<li><a href="/writing/">writing</a></li>
		<li><a href="/blog/">blog</a></li>
		<li><a href="/photo/">photo</a></li>
		<li><a href="/code/" rel="tag">code</a></li>
		<li><a href="/art/">art</a></li>
		<li><a href="/link/">link</a></li>
		<li><a href="/poem/">poem</a></li>
		<li><a href="/audio/">audio</a></li>
	</ul><ul>
		<li><a href="/web-dev/">web-dev</a></li>
		<li><a href="/annoyances/">annoyances</a></li>
		<li><a href="/eve/">eve</a></li>
		<li><a href="/code-is-art/">code-is-art</a></li>
		<li><a href="/inspiration/">inspiration</a></li>
		<li><a href="/windows/">windows</a></li>
		<li><a href="/gift/">gift</a></li>
		<li><a href="/gaming/">gaming</a></li>
		<li><a href="/mac/">mac</a></li>
		<li><a href="/osnews/">osnews</a></li>
		<li><a href="/c64/">c64</a></li>
		<li><a href="/linux/">linux</a></li>
	</ul>
	<a rel="previous" href="/code/php_directory_sorting">
		older article →
	</a><a rel="next" href="/code/title-case">
		← newer article
	</a></nav>
</header>
<!-- =================================================================================================================== -->
<article><header>
	<!-- date published or updated -->
	<time pubdate datetime="2009-10-15T21:00:00+01:00">
		<sup>9:00<abbr>pm</abbr> • 2009</sup>
		<abbr title="October">Oct</abbr> 15
	</time>
	<!-- categories -->
	<ul>
		<li><a href="/code/it_figures" rel="bookmark tag">code</a></li>
		<li><a href="/web-dev/it_figures">web-dev</a></li>
		<li><a href="/annoyances/it_figures">annoyances</a></li>
	</ul>
	<!-- licence -->
	<small>
		<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_GB">c</a>
		share + remix
	</small>
</header>
<!-- ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
<section>
<h1>Why HTML5 <code>&lt;figure&gt;</code> Doesn’t Have to Work in IE</h1>
<p>
	<small><strong>Note:</strong> Details in this article no longer apply as HTML5 was changed to use the
	<code>&lt;figcaption&gt;</code> element instead of <code>&lt;legend&gt;</code> and <code>&lt;dt&gt;</code> /
	<code>&lt;dd&gt;</code> after that.</small>
</p>

<hr />

<p>
	<strong>Since <code>&lt;legend&gt;</code> in <code>&lt;figure&gt;</code> was a no-go</strong> (pretty much busted
	in all browsers), the HTML5 specification has changed to using <code>&lt;dt&gt;</code> and <code>&lt;dd&gt;</code>
	instead. This is all described in a <a href="http://html5doctor.com/dd-details-wrong-again/" rel="external">new
	article by the HTML5 Doctor</a>.
</p><p>
	Apparently Internet Explorer is still broken and <code>&lt;dd&gt;</code> doesn’t solve the
	<code>&lt;figure&gt;</code> problem. This assertion is made at the end:
</p>
<blockquote>
	<p>
		We, as authors, want to make use of details and figure today. Waiting for IE7 to fall out of circulation
		before we start using these elements (as it’s been proposed a number of times on the IRC channel and
		mailing boards) is outright not going to happen. IE6 &amp; 7 are going to be around for a good more number
		of years, certainly IE7 (IE6 has at least another 5 years in the beast).
	</p><p>
		We are going to start enabling the details interactive UI pattern using JavaScript whilst we wait for
		vendors <ins>to</ins> bake it in to the browser, so the final proposed markup needs to work in all the
		browsers, including IE6 and IE7.
	</p>
	<cite>Remy Sharp—“<a href="http://html5doctor.com/dd-details-wrong-again/" rel="external">dd-details wrong again</a>”</cite>
</blockquote>
<p>
	No. That is absolute rot and I do not believe for a second that HTML5 <code>&lt;figure&gt;</code> and
	<code>&lt;details&gt;</code> <strong>must</strong> work in IE6 &amp; 7. Pray tell, <strong>what</strong> enterprise
	apps (strictly non-consumer) are you writing that <strong>must</strong> use <code>&lt;details&gt;</code> that
	couldn’t be done with DIVs to support your arse-backwards IE6-toting clients?
</p><p>
	HTML5, as a standard for the next 15 years, does not have to support IE6 &amp; 7, at all. Any such support we have
	now <strong>is a complete hack</strong>, and we’re lucky to have even that. Yes, the standard must be pragmatic,
	but this idea that IE6 &amp; 7 must determine the future is grossly outdated.
</p><p>
	If you are writing a consumer-orientated app for the worldwide public then you can look forward to Firefox usage
	over 50% in some countries. <em>Look</em>, if a consumer is using IE6 then they both don’t know alternatives exist
	and don’t know how to update their machine. Tell them. It is your responsibility to bring the ’Web up to
	standard. <strong>Any</strong> consumer using IE6 or 7 has the option of IE8 <strong>or</strong> a better browser.
</p><p>
	Developers need to thicken their spines and set the price of entry. You must have a browser that is at least
	<em>this</em> awesome to enter. Give people a degraded experience in IE6 &amp; 7, titled by a banner to upgrade.
	Guess what, people do!
</p><p>
	IE6 &amp; 7 are going the way of the dodo, quickly and will be a distant memory. The HTML5 standard shouldn’t be
	crippled for crippled browsers. If you want IE6 &amp; 7 users, then don’t use HTML5; simply put—HTML 4
	<em>already works</em>, and will continue to do so. If you love your users then you care about their security and
	you care about the experience they have on the ’Web and you care enough to help them upgrade their computer.
	Devote a whole page that describes the process step-by-step if need be. Stop copping out by supporting IE6 &amp; 7.
</p><p>
	Sorry if this comes across as angry, but I really can’t accept developers defending IE6 &amp; 7, there’s no
	excuse and you should stop letting Microsoft dictate the ’Web for you. IE6 &amp; 7 have the market share they have
	(which you use as defence) <strong>because</strong> you won’t move on, and move your users on too. What
	enterprises use internally has <strong>nothing</strong> to do with the public ’Web. Stop hiding behind firewalls.
</p>
</section>
<!-- ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
</article>
<footer>
	<nav><a href="http://forum.camendesign.com">‹ Discuss this in the Forum ›</a></nav>
		
	<a href="mailto:kroc@camendesign.com">kroc@camendesign.com</a>
	<nav>view-source:
		<a href="/code/it_figures.rem">Rem</a> •
		<a href="/code/it_figures.html">HTML</a> •
		<a href="/design/">CSS</a> •
		<a href="/.system/">PHP</a> •
		<a href="/.htaccess">.htaccess</a>
	</nav>
	<form method="get" action="https://duckduckgo.com">
		<input type="hidden" name="sites" value="camendesign.com" />
		<input type="search" name="q" placeholder="search…" />
		<input type="submit" value="Go" />
	</form>
</footer>
<!-- =================================================================================================== code is art === -->