html5新增的语义化标签极其作用
在html5中,新增了几个语义化标签:<article>、<section>、<aside>、<hgroup>、 <header>,<footer>、<nav>、<time>、<mark>、<figure> 和<figcaption>等。
1.什么是HTML语义化?
通过标签判断内容语义,例如根据h1标签判断出内容是标题,根据<p>判断内容是段落、<input>标签是输入框等。
2.为什么要语义化?
1).去掉或样式丢失的时候能让页面呈现清晰的结构
2).方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)以意义的方式来渲染网页
3).有利于SEO
4).便于团队开发和维护,遵循W3C标准,可以减少差异化
3.如何确定你的标签是否语义良好?
去掉样式,看网页结构是否组织良好有序,是否仍然有很好的可读性。
html5新增的语义化标签极其作用的更多相关文章
- Html5新增的语义化标签(部分)
2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,html5的标准规范终于制定完成.这是互联网的一次重大变革,这也许是一个时代的来临! 总结一些h5新增的语义化标签,记录下来方便自己学习 ...
- HTML新增的语义化标签及其作用
在html5中,新增了几个语义化标签:<article>.<section>.<aside>.<hgroup>. <header>,< ...
- HTML5学习之语义化标签(一)
一.为什么HTML5要引入新语义标签 在HTML5出现之前,我们一般采用DIV+CSS布局我们的页面.但是这样的布局方式不仅使我们的文档结构不够清晰,而且不利于搜索引擎爬虫对我们页面的爬取.为了解决上 ...
- HTML5学习之语义化标签
一.为什么HTML5要引入新语义标签 在HTML5出现之前,我们一般采用DIV+CSS布局我们的页面.但是这样的布局方式不仅使我们的文档结构不够清晰,而且不利于搜索引擎爬虫对我们页面的爬取.为了解决上 ...
- 从零开始学 Web 之 HTML5(一)HTML5概述,语义化标签
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- HTML5常用的语义化标签
快速查询 article | aside | nav | section | header | footer 架构预览 nav 定义导航链接的部分 在页脚显示一个站点的导航链接,如首页.服务信息页面. ...
- [HTML知识体系]语义化标签概论
1.什么是语义化 语义化(Semantic)在HTML5中被大量提起,就是语义化标签向浏览器和开发者展示了它所包裹内容的类型与意思,可是至今我看了好多代码,HTML5新增的语义化标签的使用率还是挺低的 ...
- 第二季第十一天 html5语义化标签 css透明度
span不能设置宽高背景 HTML5语义化标签 <section>标签所包裹的是有一组相似的主题的内容,可以用这个标签来实现文章的章节.标签式对话框中的各种标签页等类似的功能. <s ...
- HTML5语义化标签重构页面
在HTML5未出现之前我们都用div+css来构建页面,比如<div id=”header”>,div的滥用,使得代码的可读性和可维护性很差,现在用本文来介绍一下用HTML5′干净的’语义 ...
随机推荐
- IP选项处理
1:引言 I P输入函数(i p i n t r)将在验证分组格式(检验和,长度等)之后,确定分组 是否到达目的地之前,对选项进行处理.这表明,分组所遇到的每个路由器以及最终的目的主机都要对分组的选项 ...
- redis过期机制及排行榜
redis 内存数据集大小上升到一定大小的时候,就会施行数据淘汰策略.redis 提供 6种数据淘汰策略: volatile-lru:从已设置过期时间的数据集(server.db[i].expire ...
- BZOJ 3884——欧拉降幂和广义欧拉降幂
理论部分 欧拉定理:若 $a,n$ 为正整数,且 $a,n$ 互质,则 $a^{\varphi (n)} \equiv 1(mod \ n)$. 降幂公式: $$a^b=\begin{cases}a^ ...
- Codeforces Educational Codeforces Round 54 题解
题目链接:https://codeforc.es/contest/1076 A. Minimizing the String 题意:给出一个字符串,最多删掉一个字母,输出操作后字典序最小的字符串. 题 ...
- 捕获错误并处理try-catch
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 类对象传输到jsp页面。需要转换为js的json对象时,这么做。
场景:要从一个列表中选择信息,填写入父页面的表单中,但是字段非常多... 后台查询,得到结果,放在列表中. 效果:点击选择产品.. 弹出页面:点击后面的选择产品 选择产品后:信息自动填充.. 实现:点 ...
- Tpcc-mysql 结果解读
原文:https://blog.csdn.net/frockee/article/details/87812329 1. 填坑经验 不要使用tidb的tpcc测试程序(非标准,tidb修改过),使 ...
- 泰乐事(Telos)白皮书中文版 <一> 泰乐事项目(未完成)
泰乐事项目 一个可持续发展的去中心化EOSIO网络 EOS系统在设计上为人们带来了令人惊喜的一种实现新经济模式的承诺.然而很不幸,其高度中心化的运营正不断地破坏这种承诺.90%的EOS代币掌握在仅仅1 ...
- MySQL数据分析实战-朱元禄-专题视频课程
MySQL数据分析实战-496人已学习 课程介绍 本套课程由知名数据分析博主jacky老师录制,深入浅出讲解MySQL数据分析,从实战角度出发,帮助大家制胜职场!课程收益 1.学会 ...
- sick 激光
sick10:TiM561-2050101https://www.sick.com/cn/zh/detection-and-ranging-solutions/2d-lidar-/tim5xx/tim ...