アスキー・メディアワークスより『HTML5読本』を出版します

1月25日に（株）ニューズフロントの植木氏と筆者の共著で『仕事にすぐ効く！ HTML5読本』を、（株）アスキー・メディアワークスさまより出版する運びとなりましたので、ご報告いたします。

ブログのサイドバーをHTML5流のセマンティクスにする

<aside>
<div class="aside">

<section>
<div class="section">
<h1>SIDEBAR TITLE HERE</h1>
<ul>
	<li>LIST ITEM</li>
	<li>LIST ITEM</li>
	<li>LIST ITEM</li>
</ul>
</div><!-- /section -->
</section>

<section>
<div class="section">
<h1>SIDEBAR TITLE HERE</h1>
<ul>
	<li>LIST ITEM</li>
	<li>LIST ITEM</li>
	<li>LIST ITEM</li>
</ul>
</div><!-- /section -->
</section>

</div><!-- /aside -->
</aside>

ナビゲーションをolで書いて、accesskeyをプラス

<div class="nav">
<ol>
<li><a accesskey="1" href="/">Home</a></li>
<li><a accesskey="2" href="/html">HTML</a></li>
<li><a accesskey="3" href="/css">CSS</a></li>
<li><a accesskey="4" href="/javascript">JavaScript</a></li>
<li><a accesskey="5" href="/jquery">jQuery</a></li>
<li><a accesskey="6" href="/wordpress">WordPress</a></li>
<li><a accesskey="7" href="/feed">RSS</a></li>
</ol>
</div>

headerを途中で分割する

<div class="header">
</div><!-- /.header -->

<div class="header">
</div><!-- /.header -->

IEの条件分岐コメントをbodyタグに実装する

<!--[if lte IE 5]><body class="ie-legacy"><![endif]-->
<!--[if IE 6]><body class="ie6"><![endif]-->
<!--[if IE 7]><body class="ie7"><![endif]-->
<!--[if IE 8]><body class="ie8"><![endif]-->
<!--[if gte IE 9]><body class="ie-edge"><![endif]-->
<!--[if !IE]>-->
<body>
<!--<![endif]-->

IE6で文字が2重に表示されてしまうバグの回避法

<!-- DO --><!-- NOT --><!-- DELETE --><!-- THIS -->