微格式
建立在已有的、被广泛采用的标准基础之上的一组简单的、开放的数据格式(microformats.org官方定义)。
是把语义嵌入到HTML以便有助于分离式开发而制定的一些简单约定,是兼顾人机可读性设计的数据表达方式,对Web网页进行语义注解的方法。
这种方法依托于标准的Web页面写作技术,例如,XHTML,这样引入语义信息对浏览器等所有现存的Web技术冲击最小。采用Microformat的 Web页面,在XHTML文档中给一些标签(Tag)增加一些属性(attribute),这些属性对信息的语义结构进行注解,处理XHTML文档的软件,
实例
简单的微格式
我们从上面的描述知道,微格式实际就是为现有的(X)HTML元素添加元数据和其他属性,增强语义。那么我们就来看一个简单的微格式应用吧。
以前我们是这样写一个链接到首页的<a></a>
代码的:
1 | <a href=”http://www.bbon.cn”>Web Design Blog</a> |
而现在我们要为这个代码元素<a>
加上 rel属性。1
<a href=”http://www.bbon.cn“ rel=”homepage”>Web Design Blog</a>
上面的链接标记<a>
包括rel=”home”属性,该属性显示链接的目标页面是该网站的首页。通过为已有的链接元素添加语义化属性,就为这个链接添加了具体的结构和意义。
hCard 微格式
hCard是一种微格式,用来发布个人,公司,组织,地点等详细的联系信息。它可以包含在(X)HTML,Atom,RSS等可扩展置标语言中。hCard使用vCard(RFC 2426)的属性和值来实现这些功能。
它可以使分析器(比如其他网站,Firefox的Operator插件)获得详细的信息,并通过别的网站或者地图工具进行显示,或者载入到地址簿等其他程序。
示例一
如下HTML代码:
1 | <div> |
加入微格式后,成为:
1 | <div class="vcard"> |
这里,正式名称(class=”fn”),组织(class=”org”),电话号码(class=”tel”)和url(class=”url”)分别用相应的class标示;同时,所有内容都包含在class=”vcard”里。
示例二
这里是维基媒体基金会的联系方式,可以作为hCard的一个真实示例:
1 | Wikimedia Foundation Inc. |
加入微格式后,成为:
1 | <div class="vcard"> |
注意,在这个例子中,正式名称(class=”fn”)和组织(class=”org”)写在了一个属性中,表示这是一个组织,而不是个人。
在前端构建中微格式的意义
那么,微格式在实际应用中的意义和作用又是什么呢?微格式按照某种已有的被广泛应用的标准,通过对内容块的语义标记,可以让外部应用程序、聚合程序和搜索引擎能够做以下事情:
- 在爬取Web内容时,能够更为准确地识别内容块的语义;
- 对内容进行操作,包括提供访问、校对,还可以将其转化成其他的相关格式,提供给外部程序和Web服务使用。
总结: 可以对网站进行SEO优化,如果需要可以考虑。
参考资料
版权声明:本文为CSDN博主「deng131」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/deng131/article/details/83632737