html5学习开发指南精选知识

html5学习开发指南精选知识
  随着移动互联网的兴起,前端开发工程师的岗位也随着兴起。前端工程师不仅在用户和产品之间扮演着越来越重要的角色,而且前端的职能也能够(开始)朝着服务端延伸。所以不仅小公司缺人在招前端,大公司同样面临着缺少优秀前端工程师的尴尬处境。
 
  当我们在谈论或者招聘前端工程师的时候,都会提到熟练或者是熟悉?h5(html5)?开发。那么所谓的?h5?开发是什么呢?这篇文章主要就是为大家介绍?h5?的基本内容和学习指南。
 
  从2006年?html5?标准被提出到2014年10月29号,html5规范制定完成并且发布,这中间经历了8年时间。从被提出到最终规范定稿,html5?包含的很多新特性,同步的在被同时期的现代浏览器(Chrome,Firefox等)所实现。所以?html5?对于很多开发者来说,已经不能算是一项新技术了。在?html5?发展的过程中,移动互联网的兴起,html5标准委员会?为了满足在移动设备上实现复杂多媒体功能,设计了一些新特性来支持移动互联网的发展。
 
  严格意义上来说,我们现在口中的?h5开发?并不仅仅指的是?html5?这一项技术,而是包含了html5 ,css3,javascript。所以在我们励志成为一名优秀的前端工程师的时候,应该多关注这三方面的技术。
 
  html5首先通过新的声明方式,告诉浏览器对所要解析的html文档的文档类型。来规范浏览器的解析行为。该声明方式比 html4.x 声明更加简洁和灵活;
 
  html5新增加的标签丰富了网页结构,有利于搜索引擎的抓取;
 
  html5使得页面元素在浏览器上的表现更加的丰富,比如绘图(canvas),媒体播放(audio,video);
 
  html5新增的事件类型,可以让开发者监测用户更多的行为,使用户在操作网页时,网页有更加丰富的表现;
 
  html5可以使开发者的网页兼容更多的设备(可以使我们的网页在不同的移动端设备上基本表现一致);
 
  html5可以让开发者在客户端存储更多的数据;
 
  章节语意标签,比如:等,可以使我们创建更友好的页面结构,便于搜索引擎抓取;
 
  表单元素,属性,比如:等,可以让我们规定表单元素的输入类型,长度,表单元素的行为;
 
  多媒体标签,比如:。可以让我们定义多媒体文件的类型和行为;
 
  2D绘图,矢量图应用,标签可以让我们在网页上绘制复杂的图形和显示复杂的图形;
 
  拖拽事件,事件可以让我们在网页上对元素进行拖放操作;
 
  离线数据的存储,?可以让开发者根据用户行为在客户端缓存数据,提高网站性能和用户体验;
 
  获取当前用于的地理位置,?可以让我们不依赖客户端就可以获取用户位置;
 
  Application Cache?可以让我们对Web应用进行缓存,离线时也可以访问,增加用户体验;
 
  web worker?可以让我们脱离JavaScript是单线程的这个魔咒,而且web worker独立于其它的脚本不会影响页面性能;
 
  被动的获取服务端数据,?对象可以让我们的应用程序不主动发送HTTP 请求的情况下接收服务端推送的消息,并且做出响应;
 
  上面介绍了那么多html5新特性,那么这些新特性普及能为开发者带来哪些便利呢?
 
  对于经常使用微信的朋友来说,在?发现?一栏里可以看到?京东购物?的标签,当我们打开后会发现它几乎跟我们使用京东客户端一样。我们会想,难道微信在自己的客户端内,单独为京东开发了展示商品的模块呢?假如说,微博的客户端也要为京东添加这样的一个入口,是不是微博的工程师也需要开发这样的模块呢?
 
  答案是否定的,首先两家不同类型且独立的公司,先不说技术储备问题,这么复杂的页面开发起来在协调沟通和开发成本都会很大。如果某天XX活动京东要对网站首页改版,为了保持一致性微信的工程师也得同步的开发京东的新版页面。这明显违背软件设计?解耦?的思想。那么什么技术可以改变这种现状呢?
 
  因为html5新增的特性,已经可以让开发者开发出接近原生?native?体验的页面,也有满足多终端适配的解决方案。京东只需要使用html5?来开发自己的页面,为需要提供入口的客户端提供页面的URL地址即可。不仅可以极大的减少开发成本,人力成本和沟通成本,而且也不会因为客户端版本更新迭代慢而影响产品的生效效率。事实上京东是这么做的。国内很多公司都是这么做的。
 
  5.1我是有经验的开发者
 
  对于已经有html和css开发经验的人来说,我认为学习html5应该是很快的。我们应该根据自己的工作需要来选择学习哪些内容。比如:SVG?和?Canvas?已经属于Web图形学方面的内容,内容很多也比较复杂,如果平时工作中接触和使用的不多,仅仅作为了解就可以了。不必要投入太多的精力和时间。
 
  除了以上两个知识点之外,我们就可以把html5新增的内容分成以下几点进行学习,各个击破:
 
  新的标签,属性和表单元素
 
  新的事件类型
 
  多媒体播放
 
  web存储和应用缓存
 
  用户地理位置信息获取
 
  多终端设备的适配
 
  5.2我是刚入门的选手
 
  对于刚入门的选手,就不要刻意的区分html5和html了。现在随便买一本html书(最近3年出版的书?_?),其中都会包含html5的内容。你的关注点应该是把自己对html包含的内容整体的把握起来。并且多写一些demo来练习,知道这些标签在网页上的表现和具有的特性。
 
  前端开发就是跟浏览器打交道。所以我们在工作中应该关注自己的产品必须兼容浏览器的版本。当我们在使用html5一些新特性的时候,可以在?caniuse?上查询是否满足自己的兼容标准,对这些新特性有选择的使用。
 
  说了这么多html5开发的优点,也应该了解一些html5页面的缺点:
 
  对pc端一些旧版本浏览器兼容性不好;
 
  页面动画性能没有原生的 native 高,复杂动画或者是低配置的终端会特别明显;
 
  没办法直接调通系统的API;

推荐阅读

    学习写字楼新选择6000元主流配置

    学习写字楼新选择6000元主流配置,,这种配置需要考虑双核心的办公和娱乐平台,充分考虑办公室的办公需求和娱乐需求,以约6000元的预算和cost-e

    计算机主板BIOS设置详细-BIOS知识

    计算机主板BIOS设置详细-BIOS知识,,什么是电脑BIOS,一般电脑主板已经设置完毕后,电脑就开始按del键进入BIOS。系统启动BIOS,即微机的基本输入

    1394连接是什么1394网络适配器知识

    1394连接是什么1394网络适配器知识,,今天有网友在QQ群中问了这样一个问题:1394连接是什么?。由于笔者对1394连接不清楚,通过百度搜索与谷歌

    Lucene学习之高亮显示

    Lucene学习之高亮显示,索引,字符,在搜索引擎中我们经常会看到这样的情景: 红色部分我们称之为高亮显示,lucene提供了HighLighter模块来实

    陈天乔:盛大网络为移动互联网

    陈天乔:盛大网络为移动互联网,,12月2日,北京时间,简称:盛大发布的2011财年第三季度财务报告,截至9月30日,在随后的电话会议上,盛大网络董事长和陈

    移动apn设置|移动apn设置参数

    移动apn设置|移动apn设置参数,,移动apn设置参数1、打开手机系统设置界面应用,点击页面中的“移动网络”设置选项。2、进入移动网络设置页面

    Excel图表怎样移动和调整图表大小?

    Excel图表怎样移动和调整图表大小?,图表,生成,怎么,一、移动图表1.在Excel中移动一幅图表的操作非常简单,我们只需单击要移动的图表,用鼠标拖