HTML5标签(语义化)
2024-10-17 16:49:58
HTML语义化是什么?
HTML语义化是指根据内容的结构化,选择合适的标签。举个例子:之前所有的都用div, span等标签实现页面结构,而这些标签都没有实际的意义,
而新的HTML5标签<header> <footer> <nav> <section> <article> <aside> 等这些标签的出现与使用,让人一目了然的知道页面结构是什么样的,哪些内容是主题部分,这就是HTML语义化的好处。
语义化的好处:
1. 有利于SEO,有利于爬虫抓取有效的信息(爬虫是依赖于标签来确定上下文各个关键词的权重,爬虫很大程度上会忽略用于表现的标记,而只注重语义标记.)
2. 在没有css或者css缺失的情况下,也能呈现较好的内容结构和代码结构
3.屏幕阅读器(如果访客有视障)会完全根据你的标记来“读”你的网页.(例如,如果你使用的含语义的标记,屏幕阅读器就会“逐个拼出”你的单词,而不是试着去对它完整发音.)
4. 方便各种不同设备的解析
5. 有利于团队代码的开发与维护
HTML5标签:
header通常是放于页面头部,相关的还有<hgroup>
<header>
<hgroup>
<h1>网站标题</h1>
<h2>网站副标题</h2>
</hgroup>
</header>
footer通常位于页面底部,放版权信息和相关链接等
<footer>
CopyRight@
</footer>
nav主要是页面导航区
<nav>
<ul>
<li>HTML 5</li>
<li>CSS3</li>
<li>JavaScript</li>
</ul>
</nav>
aside用于主题article的附属信息
<article>
<p>内容</p>
<aside>
<h1>侧栏标题</h1>
<p>侧边栏内容</p>
</aside>
</article>
其他的一些标签:
section表示节,段,部分,i表示斜体,em标签表示强调,显示为斜体,b标签表示的文本风格不同于正常的文本,没有表达任何特殊的重要性和相关性,strong标签表示加粗强调重要性
最新文章
- 通过数据库查看EBS的登录地址
- debain 8安装为知笔记(how to install wiznote in debain 8)
- log4j日志文件配置说明及使用
- 获取平台所有接口的IP和MAC地址
- MVC和WebForm的优缺点对比
- Linux下Join命令
- 数学(欧拉函数):UVAOJ 11426 GCD - Extreme (II)
- 下拉框Html.DropDownList 和DropDownListFor 的经常用法
- FancyBox – 经典 Lightbox 效果插件
- C++模板显式实例化,隐式实例化,特化(具体化,偏特化)辨析
- Linux使用top与free命令查看CPU与内存使用情况
- 【medium】990. Satisfiability of Equality Equations 并查集
- linux install Openvino
- acl &;&; prefix list
- 如何解决“504 Gateway Time-out”错误
- 【题解】Luogu P2522 [HAOI2011]Problem b
- ubuntu下安装程序的五种方法
- PyQT5-QSlide滑块
- webservice框架jersey 文章
- 人工智能时代,应立即学习python
热门文章
- C# 使用TASK处理多任务同时处理
- 关闭MongoDB
- core文件无堆栈信息定位的思路
- mysql操作索引的sql语句
- 点滴积累【C#】---操作xml,将xml数据显示到treeview
- 关于UI功能解锁,UI特效动画,UI tips的再思考
- atitit.验证码识别step4--------图形二值化 灰度化
- Atitit.&#160;衡量项目规模&#160;----包含的类的数量&#160;.net&#160;java类库包含多少类&#160;多少个api方法??
- [elk]elastalert邮箱告警
- 爱国者布局智能硬件,空探系列PM2.5检測仪“嗅霾狗”大曝光