Article #1:Let's Talk about Semantics
Reason:由于第一个 case 很多地方都没能正确使用 HTML 标签,迫切觉得自己需要掌握 HTML 语义化的知识
为什么要语义化?
- 不仅人类需要明白HTML语义,机器(搜索引擎爬虫,辅助工具等)也需要能够读懂HTML语义
- 易于形成结构化的文档数据,搜索引擎神马的最喜欢了
- 从开发者的角度来说,增强了代码的可读性
简单好用的流程图
对于如何使用正确的 HTML 标签,可以对照此流程图判断使用。
当然,前提是最好能够理解每一个标签的用意及其使用的环境。
如果所有选择条件都不成立,那么就回过头来拥抱老朋友 div 吧。
[先download下来,以后慢慢理解使用]
有可能HTML标签会越来越多么?
总的原则:
- 用精小的HTML标签集满足web上的所有需求。
- 标签名不仅仅表达了字面上的意义,更多是一种实体类型的抽象
进一步语义化HTML
使用 Microdata 或者 Microformat
感想:
- 引用原文的一个引用,就不翻译了:
- You are busy creating a website.
- You have a thought, “Oh, now I have to add an element.”
- Then another thought, “I feel so guilty adding a div. Div-itis is terrible, I hear.”
- Then, “I should use something else. The aside element might be appropriate.”
- Three searches and five articles later, you’re fairly confident that aside is not semantically correct.
- You decide on article, because at least it’s not a div.
- You’ve wasted 40 minutes, with no tangible benefit to show for it.
— Divya Manian
虽然她举这个栗子的用意是用来反讽语义化无法带来什么直观好处,
但是觉得这个简直就是自己修改第一个case中HTML标签的过程重现。
以后还是得一个一个地将HTML5标签啃下来,才不会重现以上纠结的情形。
- HTML5标签用法非一成不变,其用途也常引起争议
问题:
- 有工具可以测试自己写的页面的语义化程度么?
- 在什么情况下语义化是非常必要的?