简单来说就是相应的内容用对应的标签,杜绝从头到尾用div等标签情况的发生。
HTML语义化的有点
- 为了在没有CSS的情况下,页面也能呈现出很好地内容结构、代码结构:为了裸奔时好看;
- 用户体验:例如title、alt用于解释名词或解释图片信息、label标签的活用;
- 有利于SEO:和搜索引擎建立良好沟通,有助于爬虫抓取更多的有效信息:爬虫依赖于标签来确定上下文和各个关键字的权重;
- 方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)以意义的方式来渲染网页;
- 便于团队开发和维护,语义化更具可读性,是下一步吧网页的重要动向,遵循W3C标准的团队都遵循这个标准,可以减少差异化。
使用header nav article aside section footer等标签标明对应的内容
image.png
<em> <strong> <b> <i> <u> <cite>
em和strong都表示强调,切记勿使用<b>来表示强调
<cite> 标签通常表示它所包含的文本对某个参考文献的引用,比如书籍或者杂志的标题。
按照惯例,引用的文本将以斜体显示。。
<i> 被用来传达传统上用斜体表达的意义:外国文字,分类名称,技术术语,一种思想……
<b> 被用来传达传统上用粗体表达的意义:关键字,产品名称,引导句……
<u> 被用来传达传统上用下划线表达的意义:专有名词,拼写错误……
缩略语
<abbr>元素代表缩写,并可选择提供一个完整的描述。——它常被用来包裹一个缩略语或缩写,并且提供缩写的解释(包含在属性中)。
<p>We use <abbr title="Hypertext Markup Language">HTML</abbr> to structure our web documents.</p>
联系方式
<address>来标记联系方式。
<address>
<p>Chris Mills, Manchester, The Grim North, UK</p>
</address>
<address>
<p>Page written by <a href="../authors/chris-mills/">Chris Mills</a>.</p>
</address>
网友评论