关于web语义化的一些感悟
2014-04-18 16:35
190 查看
今日读了一些关于WEB语义化的一些文章,包括知乎上的一些问题以及一些大牛的博客,记录总结一下并写下自己的感悟。
首先,何谓WEB语义化,为何要进行WEB语义化?
知乎上有一位用户回答说" 我所理解的web语义化是互联网信息处理的自动化、智能化。",个人觉得说的很到点。顾名思义,WEB语义化就是让页面更具有语义性,可读性,让其更好理解。WEB语义化这个概念出现的原因,从根本上而言是为了更好的帮助机器理解我们所构建的页面,而进一步而言就是可以从我们所写的页面中读取到更多的信息,让机器不仅读取到内容,而且知道读取的内容所对应的意义。 当机器能够更好地理解WEB内容时,其数据处理,检索,智能化的能力也会大大增强。例如Siri,搜索引擎,良好的语义结构的WEB页面会给其提供更多的检索信息,反馈给用户的内容和频率也将大大提高。
如何实现WEB语义化?
结构,表现,行为分离:
我们常说的一个概念:结构,表现,行为分离,其实就是HTML,CSS,JS各司其职,独立CSS,JS与HTML文件,不要在HTML中增加表现层次的代码,尽量减少甚至不使用嵌入式js代码
合理使用HTML标签:
"合理使用"这四个字说起来简单,其实其内容和学问就大了。
HTML4.0.1/XHTML:
首先对于传统的XHTML(HTML4.0.1)而言,标签的语义性并不丰富,我们常用的具有意义的无非就是h1~h6,ul,ol等等,下面这个表格进行了整理
标签 | 语义 |
h1~h6 | 标题 |
th | table的header |
p | 段落 |
ul | 无序列表 |
ol | 排序列表 |
dl | definition list,定义列表 |
dt | definition title,定义名称 |
dd | definition description定义描述 |
em | emphasized,局部强调,段落内强调 |
strong | 更强烈的强调,全文强调 |
HTML5
而在新制定的HTML5标准中,HTML标签语义化的功能大大增强了。 新增加的例如header,section,article等标签完美地替代了以前无意义的div+class or div+id HTML5的革新,语义标签化(一) HTML5的革新,语义标签化(二) 这两篇博文极其详尽的阐述了这些新标签的语义,我就不重复总结了,给原博文作者一个大大的赞,这里我就写一下我的几点见解。1.关于article
每一个article是一个独立的单元,常为独立的文章,其内容独立与其它并联article没有关联,但其与上级article是相关的。当section包含多个article时,代表虽然article之间没有关联,但其组合起来是一个整体,标准的article结构如下
<span style="font-family:Microsoft YaHei;"><article><header><h1>文章/页面标题,SEO中唯一</h1><p>段落内容,<strong>强调与突出</strong></p></header><section><h2>章节小标题</h2><p>段落内容</p></section><section>…</section><footer><h3>文章底部小标题</h3><p>段落内容</p></footer></article></span>2.关于section
section我的理解就是并列的"小节",同级section之间内容大体是相同的,只是因为讲述对象获分类等差距而分为不同的小节。 对于section而言,因为其本身就是一种次级结构,所以其中的h1~h5标签都会自动降级。
关于WEB语义话的内容暂时先写这么多,以后有看到新的内容再进行补充
相关文章推荐
- 关于JavaWeb开发的一些感悟
- 关于Web应用与c/s应用的一些想法
- 关于JAVAWEB一些细节问题
- 关于IIS7.5下的web.config配置的一些问题
- 关于系统程序员的一些感悟
- 【非凡程序员】 关于今天学习指针的一些自我认知的问题,和学习Xcode的感悟
- 关于实施MVC框架结构的WEB项目的一些见解
- 关于工作流WEB设计器的一些问题
- 关于文件操作的一些感悟
- 关于编程学习上的一些感悟——不忘初心
- 关于WEB服务器与应用服务器的一些理解和区别
- 关于s标签回显以及一些感悟---四
- 关于 WEB/HTTP 调试利器 Fiddler 的一些技巧分享
- 关于壳的构架的一些感悟
- 近三周关于javaweb的学习小结与感悟
- 关于float的一些感悟
- 关于web学习的一些笔记
- 关于结构体字节对齐的一些感悟
- SSH整合-关于web.xml的一些配置