html5 构造网页的新方式
从 html 诞生至今,我们构建 html 页面的使用 html 元素好像并没有太多的进步。在构建 html 页面中,用的最多的是 div 标签。但是应用 div 标签构建 html 页面有一个问题,那就是在查看别人的源代码的时候 ,并不能一下子知道 哪个 div 是表示啥的,需要在样式文件之间来回跳动,才能解决这个问题。
html5 引入了一堆新的标签,来解决了 div 标签并不能很好的表达标签的语义的问题。
要想网页的结构更清晰,需要使用 html5 中的语义元素。这些语义元素会为他们标注的内容赋予额外的含义。
比如 <time> 标签 就是用来标注时间:
<p> 我在 <time> 2015.11.20</time> 加入这个公司</p>
那么为啥要使用 html5 的语义化元素呢,主要是因为它有以下的优点:
- 1. seo 优化:像诸如 google 这样的大的搜索引擎,会使用搜索引擎机器人爬取你的网页,然后将你的网页信息存储在他们的数据库中。如果你的网页能够更好的让搜索引擎理解,那么你的网页和用户输入相匹配的概率会更高,那么你的网页在搜索结果中呈现的可能性更高。目前,搜索引擎已经开始检查一些 html5 元素了,这样可以搜集到他们想要的也面对更多的信息。
- 2. 易于维护和修改。解读传统网页的页面结构的时候,需要不断去看样式表,以了解页面的布局和不同区块儿的重要程度。但是通过 html5 语义标签,就能够直接的传达出额外的结构信息。
- 等.....
html5 构造网页的新方式的更多相关文章
- ↗☻【HTML5秘籍 #BOOK#】第2章 构造网页的新方式
div division 分区article 表示一个完整的.自成一体的内容块,比如博文文章或新闻报道hgroup 标注副标题 从结构上讲,它只关注顶级标题(也就是这里的h1).其他标题也会显示在浏览 ...
- 32+激发灵感的HTML5/CSS3网页设计教程
HTML5是寄托在HTML4基础上取得了的广泛成就.这不仅意味着你不必完全放弃现有的一些标记,而是可以借鉴,以加强 它. CSS3也以同样的方式在互联网内容的安排下,提供了它的柔韧性.CSS3是开 ...
- HTML5的十大新特性
为了更好地处理今天的互联网应用,HTML5添加了很多新元素及功能,比如: 图形的绘制,多媒体内容,更好的页面结构,更好的形式 处理,和几个api拖放元素,定位,包括网页 应用程序缓存,存储,网络工作者 ...
- 异步编程新方式async/await
一.前言 实际上对async/await并不是很陌生,早在阮大大的ES6教程里面就接触到了,但是一直处于理解并不熟练使用的状态,于是决定重新学习并且总结一下,写了这篇博文.如果文中有错误的地方还请各位 ...
- 【重构前端知识体系之HTML】HTML5给网页音频带来的变化
[重构前端知识体系之HTML]HTML5给网页音频带来的变化 引言 音乐播放,相信大家都很熟悉,但是早在之前的音乐播放之前,你的浏览器会问你,是否下载flash插件.然而现在,估计一些年轻的开发者都不 ...
- 15个前卫的 HTML5 & CSS3 网页设计作品
今天,我们编译收集一组使用 HTML5 和 CSS3 制作的精美网站.在此集合中,你可以看到平面设计,网页设计,作品集和企业网站设计实例. 响应式设计和基于 HTML5 & CSS3 编码的网 ...
- 通过xib加载UITableViewCell的新方式
我们以前通常会这样做 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPa ...
- Visual Studio 2012 应用软件开发新方式
微软正式发布Visual Studio 2012 应用软件开发新方式 2012-09-13 09:54 51CTO.com 我要评论(0) 字号:T | T “现在,开发者将有更好的机会开发与云服务连 ...
- 思路 一般创建展示类时候 例如page类 会在网页上新增多个对应字段的隐藏域 用于存储值
思路 一般创建展示类时候 例如page类 会在网页上新增多个对应字段的隐藏域 用于存储值
随机推荐
- 在Google Chrome中快速解除网页屏蔽鼠标右键、复制等限制
第一步,将书签栏设置为显示状态! 第二步,添加新书签——>在标签栏点击右键,选择“添加网页”. 第三步,设置新书签的内容. 1.起名.这个凭个人爱好吧 2.网址栏输入: javascript ...
- Acdream1311_Apple
无聊的时候看到上一次acdream群赛的一个题目,中间居然是有alice和bob的博弈题目,于是就去做了. 给n,m,两人轮流操作,每次操作可以使n+1,或者m+1,谁操作后满足nm>=A,那么 ...
- ZOJ3733_Skycity
这...水题.可惜坑了无数发. 显然对于当前的半径的园,多边形的边数越多,周长越短,面积也就越小. 一开始我是用二分去做的,事实证明也是可以的,只是我坑了. 其实没必要去用二分哦,这样来考虑这问题. ...
- Xwork概况 XWork是一个标准的Command模式实现,并且完全从web层脱离出来。Xwork提供了很多核心功能:前端拦截机(interceptor),运行时表单属性验证,类型转换,强大的表达式语言(OGNL – the Object Graph NavigationLanguage),IoC(Inversion of Control反转控制)容器等。 ----------------
Xwork概况 XWork是一个标准的Command模式实现,并且完全从web层脱离出来.Xwork提供了很多核心功能:前端拦截机(interceptor),运行时表单属性验证,类型转换,强大的表达式 ...
- 执行SCP命令拷贝文件失败
scp是我最常用的远程文件拷贝工具,今天发现突然不能用了: svan-mac:hive-tools xiean$ scp -Pxx target/urs-hive-tools-jar-with-de ...
- 【转】Latex编译报错后中断编译并改正,然后重复出现不明原因报错的解决方法
转自:https://www.douban.com/note/419828344/ 目录: 一.问题描述 二.测试情况(可以跳过,直接看建议) 三.建议 四.参考资料 正文: 问题描述: 错漏某个符号 ...
- jingchi.ai 2017.11.25-26 Onsite面试
时间:2017.11.25 - 11.26 地点:安徽安庆 来回路费报销,住宿报销. day1: 大哥哥问了我一个实际中他们遇到的问题.有n个点,将点进行分块输出,输出各个块的均值点.具体就是100* ...
- 关于UIInterfaceOrientation的一个bug
在ios中获取设备当前方向的枚举有UIInterfaceOrientation和UIDeviceOrientation ,前者包含枚举 Unknown//未知 Portrait//屏幕竖直,home键 ...
- 【BZOJ4059】Non-boring sequences
Solution 记序列为\(a\),计算出与\(a_i\)相等的前一个元素的位置\(pre_i\),以及后一个元素的位置\(nex_i\),显然,对于那些左端点处于\((pre_i,i]\)以及右端 ...
- java之初学线程
线程 学习线程相关的笔记,前面写过关于很多线程的使用,有兴趣的可以去了解下 线程 概念理解 并发 : 指两个或多个事件在同一个时间段内发生(交替执行). 并行 : 指两个或多个事件在同一时刻发生(同时 ...