2015第9周三html5学习0

?   之前规划了2015关注的技术方向是html5和node.js,虽然前面也搜集过html5相关的评论介绍性能容,但对如何学习和有哪些可利用要经常的看的资源有明显的界定,刚上网搜索了半个多小时,对结果进行整理,如何循序渐进的用html5做些东西,而不仅仅停留在只会谈一些表面概念的程度:

HTML5 包含了以下几个部分:
1. 一部分语义化标签;
2. 一大批 Browser API,支持系统状态读取(地理位置、陀螺仪、加速度等)、数据存取(IndexedDB、LocalStorage 等)、浏览器状态读写(全屏、标签是否激活等)、数据传输(Web Socket 等);
3. 一大批用来替代插件(Flash)的组件(Audio、Video、Canvas、WebGL 等)。
学习 HTML5 之前,需要详细了解 HTML、CSS 和 JavaScript(语言层面)。HTML5 的许多功能都要依赖 JavaScript 的调用,所以你需要先充分了解 JavaScript。这一部分不建议你学习任何 JavaScript 框架(jQuery、Angular 等),因为框架并未封装这些 API(第三方插件可能完成了封装,但不利于你去了解原始的 HTML5 Browser API)。

  大的方向上个人感觉还是要理论和实践相结合,理论是指要看一些经典的书籍、博客、教程、例子,实践是指用技术用它来做点东西,来重构修改例子,提炼其中的精华,看技术论坛上相关提问并努力回答并争取被对方采纳。开始学理论要加快速度可不求甚解,建立一个话题知识索引,知道有什么,然后在遇到问题时再理解消化掉对应的理论。从现在起到3月底重点关注html5方面的理论加实践,对刚收集到的一些好的资源整理如下:

书籍推荐:

html5书籍推荐:
《HTML5高级程序设计》 
《大巧不工》 
========================================= 
css书籍推荐: 
初级:《CSS网站布局实录》(侧重技术方法) 
初级:《网站重构-应用web标准进行设计》(侧重编程思想)

中级:《精通CSS:高级web标准解决方案》

高级:《CSS禅意花园》(侧重web UI的css创意化实现) 
高级:《超越css-web设计艺术精髓》

javascript书籍推荐:
初级读物:
《JavaScript高级程序设计》:一本非常完整的经典入门书籍,被誉为JavaScript圣经之一,详解的非常详细,最新版第三版已经发布了,建议购买。
《JavaScript王者归来》百度的一个Web开发项目经理写的,作为初学者准备的入门级教程也不错。

中级读物:
《JavaScript权威指南》:另外一本JavaScript圣经,讲解的也非常详细,属于中级读物,建议购买。
《JavaScript.The.Good.Parts》:Yahoo大牛,JavaScript精神领袖Douglas Crockford的大作,虽然才100多页,但是字字珠玑啊!强烈建议阅读。
《高性能JavaScript》:《JavaScript高级程序设计》作者Nicholas C. Zakas的又一大作。
《Eloquent JavaScript》:这本书才200多页,非常短小,通过几个非常经典的例子(艾米丽姨妈的猫、悲惨的隐士、模拟生态圈、推箱子游戏等等)来介绍JavaScript方方面面的知识和应用方法。

高级读物:
《JavaScript Patterns 》:书中介绍到了各种经典的模式,如构造函数、单例、工厂等等,值得学习。
《Pro.JavaScript.Design.Patterns》:Apress出版社讲解JavaScript设计模式的书,非常不错。
《Developing JavaScript Web Applications》:构建富应用的好书,针对MVC模式有较为深入的讲解,同时也对一些流程的库进行了讲解。
《Developing Large Web Applications》:不仅有JavaScript方面的介绍,还有CSS、HTML方面的介绍,但是介绍的内容却都非常不错,真正考虑到了一个大型的Web程序下,如何进行JavaScript架构设计,值得一读。
要做优秀的前端工程师,还需要继续努力:《高性能网站建设指南》、《Yahoo工程师的网站性能优化的建议》、“YSLOW”性能优化建议、《网站重构》、《Web开发敏捷之道》、“ jQuery 库”、“前端框架”、“HTML5”、“CSS3”。。。 这些都要深入研究!

掌握一门互联网技术,是需要天天学习的,所以除了书,追随一位男神,是必须的:
国外23位知名JavaScript开发
========================================== 
编程相关:
《重构:改善即有代码的设计》
web前端技能汇总:JacksonTian/fks · GitHub

实战性很强的书:

1、《CSS高效开发实战:CSS 3、LESS、SASS、Bootstrap、Foundation 》

这是一本站在CSS前沿为读者答疑解惑的实战书,作者严格恪守知识来源于实践这一原则,对每个CSS特性都进行了示例演示。
2、超实用的JavaScript代码段 》这是一个系列,有js代码段,css代码段,jquery代码段。
1000段代码纯粹是帮大学生练手用的。

前端开发工程师互动平台

html5例子:http://html5demos.com/

极客标签:http://www.gbtags.com/gb/index.htm

HTML5教程:http://www.gbtags.com/gb/postgroup/6.htm

CSS3专题教程:http://www.gbtags.com/gb/postgroup/3.htm

大熊君学习html5系列:http://www.cnblogs.com/bigbearbb/category/655422.html

时间: 2024-10-09 21:21:47

2015第9周三html5学习0的相关文章

HTML5 学习总结(四)——canvas绘图、WebGL、SVG

HTML5 学习总结(四)--canvas绘图.WebGL.SVG 目录 一.Canvas 1.1.创建canvas元素 1.2.画线 1.3.绘制矩形 1.4.绘制圆弧 1.5.绘制图像 1.6.绘制文字 1.7.随机颜色与简单动画 二.WebGL 2.1.HTML5游戏开发 2.2.1.Cocos2D-HTML5 2.2.2.Egret(白鹭引擎) 三.SVG 3.1.SVG Hello Wrold 3.2.多种引入SVG的方法 3.3.画直线 3.4.画椭圆 3.5.文本与矩形 3.6.向

html5学习(一)--canvas画时钟

利用空余时间学习一下html5. 1 <!doctype html> 2 <html> 3 <head></head> 4 <body> 5 <canvas id="clock" width="500" height="500"></canvas> 6 <script> 7 var clock=document.getElementById('cloc

HTML5学习笔记(二)——表单1

表单一直是网页必不可少的一部分,一直以来,表单的作用被无限扩展,发展出了诸多新奇的用法,老版的HTML只支持很少的一部分常用表单,许多的新表单都需要借助CSS与JavaScript语言来进行构建,现在HTML5来了,她带来了新的表单,这些强大的表单项,可以省去一大块复杂的JavaScript代码,很值得去学习. 而且在新的表单里面,不再像以前每个表单都必须位于<form></form>之内,只要在<form></form>内定义一个id,然后在网页任何位置都

HTML5 学习笔记(一)——HTML5概要与新增标签

一.HTML5概要 1.1.为什么需要HTML5 HTML4陈旧不能满足日益发展的互联网需要,特别是移动互联网.为了增强浏览器功能Flash被广泛使用,但安全与稳定堪忧,不适合在移动端使用(耗电.触摸.不开放). HTML5增强了浏览器的原生功能,符合HTML5规范的浏览器功能将更加强大,减少了Web应用对插件的依赖,让用户体验更好,让开发更加方便,另外W3C从推出HTML4.0到5.0之间共经历了17年,HTML的变化很小,这并不符合一个好产品的演进规则. 1.2.什么是HTML5 HTML5

HTML5 学习总结(一)——HTML5概要与新增标签

目录 一.HTML5概要 1.1.为什么需要HTML5 1.2.什么是HTML5 1.3.HTML5现状及浏览器支持 1.4.HTML5特性 1.5.HTML5优点与缺点 1.5.1.优点 1.5.2.缺点 1.6.HTML5效果展示 1.7.HTML5学习与开发工具 1.7.1.基础要求 1.7.2.开发工具 1.8.HTML5语法规则与文档声明 1.8.1.语法规则 1.8.2.文档声明 1.8.2.文档声明 二.废弃的标签 三.新增的标签 3.1.新增的结构标签 3.2.新增加其它元素 3

[html5] 学习笔记-表单新增的元素与属性(续)

本节主要讲解表单新增元素的controls属性.placeholder属性.List属性.Autocomplete属性.Pattern属性.SelectionDirection属性.Indeterminate属性.Image提交按钮的宽高属性. 1.controls属性 在html5中,可以在标签内部放置一个表单元素,并且通过该标签的controls属性来访问该表单元素. 1 <body> 2 <script> 3 function setValue(){ 4 var label

HTML5学习之智能表单(二)

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> <form

HTML5 学习笔记--------》HTML5概要与新增标签!

一.HTML5概要 1.1.为什么需要HTML5 HTML4陈旧不能满足日益发展的互联网需要,特别是移动互联网.为了增强浏览器功能Flash被广泛使用,但安全与稳定堪忧,不适合在移动端使用(耗电.触摸.不开放). HTML5增强了浏览器的原生功能,符合HTML5规范的浏览器功能将更加强大,减少了Web应用对插件的依赖,让用户体验更好,让开发更加方便,另外W3C从推出HTML4.0到5.0之间共经历了17年,HTML的变化很小,这并不符合一个好产品的演进规则. 1.2.什么是HTML5 HTML5

html5学习一

1.大部分浏览器都实现有的功能 Canvas cross-document消息传递 geolocation audio和video forms mathMl microdata server-send Events scalable vector graphics(SVG) websokect api及协议 web origin concept web storage 索引数据库 应用缓存(离线web应用) web workers 拖放 xmlhttprequest level 2 2.新的DO