HTML5还增加了一些纯语义性的块级元素：
　　aside　　figure　　dialog
　　我在文章和书中一直使用前两个元素。第三个元素我不经常用，它主要用于书面文本。
aside
　　aside元素代表说明、提示、边栏、引用、附加注释等，也就是叙述主线之外的内容。例如，在developerWorks文章中，常常会看到用表格形式编写的边栏，见代码3用HTML4编写的developerWorks边栏。
<tablealign=\"right\"border=\"0\"cellpadding=\"0\"cellspacing=\"0\"width=\"40%\">
<tbody><tr><tdwidth=\"10\">
<imgalt=\"\"src=\"//www.ibm.com/i/c.gif\"height=\"1\"width=\"10\"></td>
<td>
<tableborder=\"1\"cellpadding=\"5\"cellspacing=\"0\"width=\"100%\">
<tbody><tr><tdbgcolor=\"#eeeeee\">
<p><aname=\"xf-value\"><spanclass=\"smalltitle\">.xf-value</span></a></p>
<p>
The<codetype=\"inline\">.xf-value</code>selectorusedherestylestheinput
fieldvaluebutnotitslabel.Thisisactuallyinconsistent
withthecurrentCSS3draft.Theexamplereallyshouldusethe
<codetype=\"inline\">::value</code>pseudo-classinsteadlikeso:
</p>
<tableborder=\"0\"cellpadding=\"0\"cellspacing=\"0\"width=\"100%\">
<tbody><tr><tdclass=\"code-outline\">
<preclass=\"displaycode\">input::value{width:20em;}
#ccnumber::value{width:18em}
#zip::value{width:12em}
#state::value{width:3em}</pre>
</td></tr></tbody></table><br>
<p>
However,Firefoxdoesn\'tyetsupportthissyntax.
</p>
</td></tr></table>
　　在HTML5中，可以按照更有意义的方式编写这个边栏，见代码4用HTML5编写的developerWorks边栏。
<aside>
<h3>.xf-value</h3>
<p>
The<codetype=\"inline\">.xf-value</code>selectorusedherestylestheinput
fieldvaluebutnotitslabel.Thisisactuallyinconsistent
withthecurrentCSS3draft.Theexamplereallyshouldusethe
<codetype=\"inline\">::value</code>pseudo-classinsteadlikeso:
</p>

<preclass=\"displaycode\">input::value{width:20em;}
#ccnumber::value{width:18em}
#zip::value{width:12em}
#state::value{width:3em}</pre>
<p>
However,Firefoxdoesn\'tyetsupportthissyntax.
</p>
</aside>

　　浏览器可以决定把这个边栏放在哪里（可能需要用一点儿CSS代码）。
figure
　　figure元素代表一个块级图像，还可以包含说明。例如，在许多developerWorks文章中，可以看到代码5用HTML4编写的developerWorks图这样的标记其结果见图1。
<aname=\"fig2\"><b>Figure2.InstallMozillaXFormsdialog</b></a><br/>
<imgalt=\"AWebsiteisrequestingpermissiontoinstallthefollowingitem:
MozillaXForms0.7Unsigned\"
src=\"installdialog.jpg\"border=\"0\"height=\"317\"hspace=\"5\"vspace=\"5\"width=\"331\"/>
<br/>

图1.InstallMozillaXFormsdialog

　　在HTML5中，可以按照更有语义性的方式编写这个图，见代码6用HTML5编写的developerWorks图。
<figureid=\"fig2\">
<legend>Figure2.InstallMozillaXFormsdialog</legend>
<imgalt=\"AWebsiteisrequestingpermissiontoinstallthefollowingitem:
MozillaXForms0.7Unsigned\"
src=\"installdialog.jpg\"border=\"0\"height=\"317\"hspace=\"5\"vspace=\"5\"width=\"331\"/>
</figure>

　　最重要的是，浏览器（尤其是屏幕阅读器）可以明确地将图和说明联系在一起。
　　figure元素不只可以显示图片。还可以使用它给audio、video、iframe、object和embed元素加说明。
dialog
　　dialog元素表示几个人之间的对话。HTML5dt元素可以表示讲话者，HTML5dd元素可以表示讲话内容。所以，在老式浏览器中也可以以合理的方式显示对话。代码7显示在Galileo的“DialogueConcerningtheTwoChiefWorldSystems”上的一段著名对话。
　　代码7.用HTML5编写的Galilean对话
<dialog>
<dt>Simplicius</dt>
<dd>AccordingtothestraightlineAF,
andnotaccordingtothecurve,suchbeingalreadyexcluded
forsuchause.</dd>
<dt>Sagredo</dt>
<dd>ButIshouldtakeneitherofthem,
seeingthatthestraightlineAFrunsobliquely.Ishould
drawalineperpendiculartoCD,forthiswouldseemtome
tobetheshortest,aswellasbeinguniqueamongthe
infinitenumberoflongerandunequaloneswhichmaybe
drawnfromthepointAtoeveryotherpointoftheopposite
lineCD.</dd>
<dt>Salviati</dt>
<dd><p>Yourchoiceandthereasonyou
adduceforitseemtomemostexcellent.Sonowwehaveit
thatthefirstdimensionisdeterminedbyastraightline;
thesecond(namely,breadth)byanotherstraightline,and
notonlystraight,butatrightanglestothatwhich
determinesthelength.Thuswehavedefinedthetwo
dimensionsofasurface;thatis,lengthandbreadth.</p>
<p>Butsupposeyouhadtodetermineaheight—for
example,howhighthisplatformisfromthepavementdown
belowthere.Seeingthatfromanypointintheplatformwe
maydrawinfinitelines,curvedorstraight,andallof
differentlengths,totheinfinitepointsofthepavement
below,whichofalltheselineswouldyoumakeuseof?</p>
</dd>
</dialog>
　　对于这个元素的准确语法还有争议。一些人希望在dialog元素中嵌入非对话文本（比如剧本中的舞台说明），还有人不喜欢扩展dt和dd元素的作用。尽管在具体语法方面有争议，但是大多数人都认为以这样的语义性方式表达对话是好事情。
　　
　　（待续）