HTML5的三大特性网页前端/web开发工程师

/ 福州大学数学与信息学院网页前端/web开发工程师 / 2016-05-25

      易用性

  俩个原因使得使用HTML5创建网站更加简单:语义上及其ARIA。新的HTML标签像<header>, <footer>,<nav>,<section>, <aside>等等,使得阅读者更加容易去访问内容。在以前,即使你定义了class或者ID你的阅读者也没有办法去了解给出的一个div究竟是什么。使用新的语义学的定义标签,你可以更好的了解HTML文档,并且创建一个更好的使用体验。

 

HTML5,HTML5特性


ARIA是一个W3C的标准主要用来对HTML文章中的元素指定“角色“,通过角色属性来创建重要的页面地形例如,header,footer,navigation或者aritcle很有必要。这一点曾经被忽略掉了并且没有被广泛使用,因为事实上并不验证。然而,HTML5将会验证这样属性。同时,HTML5将会内建这些角色并且无法不覆盖。更多的HTML5和ARIA讨论,请大家查看这里。



清晰的代码

  如果你对于简答,优雅,容易阅读的代码有所偏好的话,HTML5绝对是一个为你量身定做的东西。HTML5允许你写出简单清晰富于描述的代码。符合语义学的代码允许你分开样式和内容。看看这个典型的简单拥有导航的heaer代码:

 

<div id="header"> <h1>Header Text</h1> <div id="nav">  <ul>   <li><a href="#">Link</a></li>   <li><a href="#">Link</a></li>   <li><a href="#">Link</a></li>  </ul> </div></div>

  是不是很简单?但是使用HTML5后会使得代码更加简单并且富有含义:

 

<header> <h1>Header Text</h1> <nav>  <ul>   <li><a href="#">Link</a></li>   <li><a href="#">Link</a></li>   <li><a href="#">Link</a></li>  </ul> </nav></header>

  使用HTML5你可以通过使用语义学的HTML header标签描述内容来最后解决你的div及其class定义问题。 以前你需要大量的使用div来定义每一个页面内容区域,但是使用新的<section>,<article>,<header>,<footer>,<aside>和<nav>标签,需要你让你的代码更加清晰易于阅读。

 

 

      聪明的存储

  HTML5中最酷的特性就是本地存储。有一点像比较老的技术cookie和客户端数据库的融合。它比cooke更好用因为支持多个windows存储,它拥有更好的安全和性能,即使浏览器关闭后也可以保存。

 

  因为它是个客户端的数据库,你不用担心用户删除任何cookie,并且所有主流浏览器都支持。

 

  本地存储对于很多情况来说都不错, 它是HTML5工具中一个不需要第三方插件实现的。能够保存数据到用户的浏览器中意味你可以简单的创建一些应用特性例如:保存用户信息,缓存数据,加载用户上一次的应用状态。


公众号,微信

汇鱼网海峡创乐汇
汇鱼网海峡创乐汇