昨天说到了nav元素,nav元素的确是描述导航,但这个导航应该是对本网站而言的,不应该将nav用到对于外部的友情链接啊,收藏夹或什么的,总之,对元素来说,要实施他正确的语义才是我们要讨论和研究的事情。
我们可以用article来描述页面想表达的实际内容,也就是说,这个内容页的核心信息。你可以这样考虑,这个页面中绝对不能去掉的内容有哪些(比如屏幕大小不够,带宽不够,存储空间不够,在各种恶劣的环境下),这些绝对不能去掉的,代表本业务核心价值的信息,就可以用article来描述。一般来讲,内容总应该有一个标题,所以article往往会包含一个h标记,如果有多个h标记,或页眉描述,请参考前面的文章。
如果article的内容比较多,需要有章节之分(给用于小屏幕的移动浏览器,或阅读器提示可以分页什么的)我们可以用section来描述。section和p不同,p描述的是一个段落,以我的理解就是一个自然段,前面空两格,一个自然回车,组成了一个p,多个p组成了一个section,而且有可能多个p还可以外带一个h什么的。当然是文档,就会有可能有header和footer的存在了。比如:
上面这些元素中,用的比较灵活的是
section,
section描述的是一段独立的文本,其也可以包含
article元素,马上我们就可以看到;
section也可以描述一些简单的独立文本信息,这个时候它类似
span元素。
在页面中那些附属的信息,比如广告,看了这篇文章的人也看了以下文章,相关产品啥的,这些有关联又不是正文的内容,我们用aside来描述。aside中的内容可以用ol和ul列出,也可以用article或section较为详细的描述。
上面的代码描述了推荐两个有摘要的文章,和三个简单列表,当然列表中可以有链接。
现在所有的页面都会有图片,没有图片纯文字的页面设计非常少见了。在html4中我的理解是,如果图片代表了具体含义(该图片的存在与否会对页面的数据造成信息缺失)比如:广告图片(没有的话,广告商会很生气),公司logo,产品照片或用于对信息描述的照片,这些元素需要用img来描述,如果你认可这点,就应该明白为什么img强制需要alt属性了,在意外情况下,用户也应该从alt信息中获取你本来需要表达的数据信息。如果图片是提示性含义,比如箭头,hot,装饰性的,那用div的背景来处理,如果浏览器在特定设备上忽略这些元素,对页面本身的信息表达也没有影响。
原先的img虽然有alt属性,不过alt的属性不是显性的表现出来的,但一般出版网的规范是图片下面有一个关于图片的说明,html5现在是彻底的要要page真正的变成document,所以给出了一个新的描述标签figure。这是一个很好的标签,可以对文档内的图片给出独立的数据区域和和说明。
要注意的是,figure希望内容是可以被描述或应该被描述的,而且描述的信息应该是和文档主题内容有关的,所以公司的logo显然不适合使用figure描述。如果你的文章中的配图和正文的主要内容也没有很多关联,比如弄了一个风景或人物照片仅仅是意境方面的,而不是描述文章中人物或地点的,那也不需要用figure元素,直接考虑img或div好了。
另外一个问题就是,在VS2008的HTML5验证中figcaption元素不支持。
还有就是figure不仅仅是描述图片,主要是描述信息流,所以figure应该可以包含描述图片,报表什么的。
这些HTML5提供的新的结构性的语义标签,基本上不是用来定义新的语义,都是用来定义新的语义区域,对阅读者来说没有什么大的意义,应该还是W3C的最初愿望,element定义是为了设备准备的,应该能让浏览器可以正确的了解你的信息,以便在特定的场合进行优化处理。
分享到:
相关推荐
2030 6G 网络总体架构指导下,着重介绍语义通信与语义认知网络技术概述、语义通信及语义认知网络的基础理论与关键技术、语义通信的要素以及语义认知网络的应用需求和典型业务,希望能为业界在语义通信和语义认知网络...
随着服务器的处理能力越来越大,互联网级开发终于开始全面火热(前几年我和很多人说,不要光关注所谓企业级开发,未来马上将进入互联网级开发),HTML5的预热为前端技术带来了更多机会和热点。我用的是VS2008开发...
HTML5新语义及基本布局: HTML 5 提供了一些新的元素和属性,反映典型的现代用法网站。其中有些是技术上类似 <div> 和 <span> 标签,但有一定含义,例如 (网站导航块)和 。这种标签将有利于搜索引擎的索引整理、小...
语义化HTML中的标签和属性,web开发人员必须掌握的技术。
语义化是指在编写HTML和CSS代码时,通过恰当的选择标签和属性,使得代码更具有语义性和可读性,使得页面结构和内容更加清晰明了。语义化的目的是让页面具备良好的可访问性、可维护性和可扩展性。 语义化的重要性...
HTML5语义化标签示例<article> 文章标题</h1> 这是一篇文章 评论1...</article> 评论2...</article></article>HTML5语义化标签标签标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。...
以前以我对web开发的粗浅理解,觉得写一个好的符合标准的页面只需要把结构和表现分离,然后不要使用table,font等标签就行了,至于通篇都是div我也不会觉得有什么问题,因为CSS很强大。但是,所有的标签都是有自己的...
html标签、html语义化
html语义化标签 可以看看 不多但还好
HTML5新特性 简洁的DOCTYPE: HTML5 只有一个简单的文档类型:<!DOCTYPE html>,表示浏览器会按照标准模式解析。 简单易记的编码类型 你现在可以在meta 标签中使用...更加语义化的新增标签 比如说:、、、、 <hea
讯飞语义理解Demo,博客演示示例源码。
简单说下你理解的语义化,怎样来保证你写的符合语义化?HTML5语义化标签了解下?
13-html5新增的语义标签.html
IE8以上兼容语义化化标签的工具js文件,配合我的博客一起使用https://blog.csdn.net/u010853130/article/details/80076905
HTML5新增的语义标签.ppt
Web-前端html+css从入门到精通 124 HTML5新语义化标签(2).zip
语义网的简单理解感受,仅供参考。
本篇文章小编为大家介绍HTML标签语义化(含H5) ,有需要的朋友可以参考一下
nlp 对话系统 语义理解 分词 自然语言处理方面的一些名称进行了详细解释。
这是经过查找资料之后总结的关于自然语言理解中的语法学、语义学和语用学的内容!共同进步!