HTML5新特性

语义标签

<header> <main> <footer><nav><article><section>可以提高浏览器的可访问性

audio元素

用于呈现音频内容
支持controls属性可以使浏览器为音频提供具有开始、暂停等功能的播放插件
audio支持 source元素 可以包括多个音频资源
<audio id="meowClip" controls> 
<source src="audio/meow.mp3" type="audio/mpeg" /> 
<source src="audio/meow.ogg" type="audio/ogg" />
</audio>

figure元素

figure元素代表一段独立的内容经常和<figcaption>配合使用，经常用于插图、表格、代码等
<figure>
<img src="https://interactive-examples.mdn.mozilla.net/media/cc0-images/elephant-660-480.jpg" alt="Elephant at sunset" />
<figcaption>A elephant at sunset</figcaption> 
</figure>

label元素

用于呈现特定表单控件的文本，使表单具有更好的可读性，通常是选项的名称，使表单更加具有可读性
<div class="preference">
<label for="cheese">Do you like cheese?</label>
<input type="checkbox" name="cheese" id="cheese"> 
</div>

fieldset元素

要为单选或多选提供说明可以使用fieldset的legend标签
<fieldset>
    <legend>从下面选项中选择一项:</legend>
    <input id="one" type="radio" name="items" value="rabbit">
    <label for="one">兔子</label><br>
    <input id="two" type="radio" name="items" value="horse">
    <label for="two">马</label><br>
  </fieldset>

日期选择器

<input id="date" type="date">
<time datetime = "2020-10-23"></time>标准化时间，即使是以非正式的口吻也可以识别出来

其他

对比度要合适
传达信息的颜色也要合适