资讯专栏INFORMATION COLUMN

HTML语义化

garfileo / 1260人阅读

摘要:语义化的好处有利于,搜索引擎根据标签来确认上下文和各个关键字的权重。有利于阅读,在样式丢失的情况下也能呈现清晰的结构。

html语义化的好处

有利于SEO,搜索引擎根据标签来确认上下文和各个关键字的权重。

有利于阅读,在样式丢失的情况下也能呈现清晰的结构。

有利于机器解析,盲人阅读器等根据语义解析

有利于开发和维护,语义化使html代码结构更清晰,更具可读性


常见的语义化标签:

em:斜体,强调语气

aside:侧边栏,具有导航性质的模块内容

nav:一般为给当前页面内容提供导航链接、目录、索引等

article:表示独立的结构,或者可复用的内容

abbr:表示缩写,title属性为完整内容

header:通常表示网页的头部内容,包括搜索框、logo、标题组等

hgroup:对网页或者区段(section)的标题组合

hr:表示故事走向的转换或者话题的转换时的水平分割线,如果是普通的水平线页面效果,用css呈现

blockquote:段落级的引述,内部包含左右缩进和内边距

q:表示行内应用,对内容自动加引号

cite:表示作品名的引述

main:表示页面的主要内容,一个页面只能出现一次

footer:表示页面或文档的页脚,一般包含作者、版权、联系地址等

figure:表示与主文章相关的图像、插图、图表、代码片段等

figcaption:表示figure的说明

strong:表示强调,和em的差别有:em表现为斜体,strong为加粗,em为强调内容,strong为语气更强的强调内容

pre:表示内容我们已经经过特殊排版了,不希望浏览器帮我们自动排版

samp:表示实例输出

code:表示内容为代码

time:表示日期或时间,有datetime属性表示内容的日期或者时间,如果没写datetime,在内容中一定要有日期时间

dfn:表示对特殊术语的定义

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/54185.html

相关文章

  • 快速理解web语义

    摘要:代码示例语义化语义化语义化语义化语义化年月日小维语义化标签包括还有等。而没有语义化的元素如则推荐使用。语义化包含了标签语义化和命名语义化。 什么是Web语义化 Web语义化是指使用恰当语义的html标签、class类名等内容,让页面具有良好的结构与含义,从而让人和机器都能快速理解网页内容。语义化的web页面一方面可以让机器在更少的人类干预情况下收集并研究网页的信息,从而可以读懂网页的内...

    LiveVideoStack 评论0 收藏0
  • 我眼中的Web 语义

    摘要:语义化的页面一方面可以让机器在更少的人类干预情况下收集并研究网页的信息,从而可以读懂网页的内容,然后将收集汇总的信息进行分析,结果为人类所用另一方面它可以让开发人员读懂结构和用户以及屏幕阅读器如果访客有视障能够读懂内容。 我眼中的Web 语义化 web语义化是什么? Web语义化,使用语义恰当的标签,可以让页面具有良好的结构,页面元素具有良好的含义,从而让人和机器都能快速理解。语义化的...

    zhichangterry 评论0 收藏0
  • 我眼中的Web 语义

    摘要:语义化的页面一方面可以让机器在更少的人类干预情况下收集并研究网页的信息,从而可以读懂网页的内容,然后将收集汇总的信息进行分析,结果为人类所用另一方面它可以让开发人员读懂结构和用户以及屏幕阅读器如果访客有视障能够读懂内容。 我眼中的Web 语义化 web语义化是什么? Web语义化,使用语义恰当的标签,可以让页面具有良好的结构,页面元素具有良好的含义,从而让人和机器都能快速理解。语义化的...

    ChanceWong 评论0 收藏0
  • 如何理解语义(semantic)

    摘要:逻辑学的语义学着眼点在于逻辑系统的语义解释,是一个理想化的模型系统,不直接涉及自然语言。例如,通过帮助临床研究中的决策,语义技术将跨机构桥接多种形式的生物和医学信息。 showImg(https://segmentfault.com/img/bVbrJYw?w=758&h=420); 前端工程师的招聘中,经常有这样的要求:对Web 语义化有深刻理解。那么到底什么才是深刻理解Web语义化...

    CarlBenjamin 评论0 收藏0

发表评论

0条评论

garfileo

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<