热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

HTML5移动前端webapp有什么推荐的书籍或者建议?

举个栗子:关于响应式web设计的建议或者书籍。
举个栗子:关于响应式web设计的建议或者书籍。

回复内容:

从你的问题我提取4个关键词
html5 webapp 响应式 学习他们的书籍或建议
1,html5 本身是一个大类目...
2,webapp 应该是css+html+Javascript 共同构建的~ 当然css3 和 html5 起到了很大的作用
3,响应式,这个是另外一个概念... 直接看 winter 推荐的文章,然后自己实践一下吧

总的说回答第4个关键词
我默认你已经掌握基本的css html Javascript
那么你只要了解基本的html5概念 敲一遍css3的新属性那么你完全可以直接开工了...
发现问题google就行...

如果希望系统的学习。。
我也推荐
html5触摸界面开发与设计
只看过这本,不过这本也只是一本 工具书

如果你想跳过这些东西 直接玩 webapp ~
那么 建议 直接在W3C看 jquery moble~ 不说性能与定制,但可以很快搭建一个webapp

推荐一下hbuilder 的 mui 框架~ 快速搭建ios系统级别的ui界面
再推荐一下 vuejs ... 温特菊苣给的那篇文章很全面,里面不止说了响应式设计中前端的工作,也包括了设计等其他方面,作为菜鸡我只能推荐几本书(有的我自己也还没看...):
《响应式web设计:html5和css3实战》
封面是一只瓢虫,这本其实响应式的东西讲得比较少,大半内容是关于介绍h5和css3的基础知识,全书主要是带领读者做一个小网页来写的,如果同时想了解h5和css3和响应式设计入门,这本不错~
《响应式web设计实践》
《跨终端web》
《html5触摸界面开发与设计》
(先写一点,上完课再继续答) 我谈谈对「HTML5移动前端webapp」的一些建议,书籍的话市面上肯定是没有讲「移动前端webapp」的,如果非要说有的话,基本上都是「Angular.js 指南」「React.js 指南」之类,「移动前端webapp」是一个比较大的概念,如果加上「HTML5」就更大了。讨论「HTML5移动前端webapp」就像后端狗讨论如何开发 「WEB 服务端」一样,需要针对不同的技术框架针对性讨论。我感觉如果想要掌握并且能够擅长「HTML5移动前端webapp」的开发,是需要掌握很多要点的。

首先就是移动webapp,你需要学习各种新技术,比如 CSS3、ES2015/ES6、webpack/browserify、gulp/grunt、Less/sass,然后还要掌握周边的各种辅助技术,如生成sourcemap方便调试,以及rem可以更好的适配多种不同尺寸的移动终端,此外还有很多细枝末节都需要不断的去积累。如果能够掌握以上的几个技术点,并且踩过不少移动端的坑,你就可以开始研究一个框架了,现在比较热门的当属 React.js 及 Angular.js 了,开始这些之后会有更多的周边技术等着你去研究,对于webapp,路由基本上是由前端控制吧,你应该去学习一个控制路由的库,诸如 react-router,那么OK,如果到这一步你都能掌握的话,你就可以开始做「H5移动webapp」了,性能调优方面的话也应该了解一些,移动设备上最吃内存的就是图片,需要重点优化。

没了,暂时就想这么多,后续可以再补充 基础知识
1、
HTML + CSS 这部分建议在线教程 上学习,边学边练.
之后可以模仿一些网站做些页面。在实践中积累了一些经验后,可以系统的读一两本书,推荐《Head First HTML 与 CSS
中文版》,这本书讲的太细了,我没能拿出耐心细读。你可以根据情况斟酌。
2、Javascript 要学的内容实在很多,如果没有其他编程语言的基础的话,学起来可能要费些力,建议看《Javascript语言精粹》,JS是一门很混乱的语言,这本书能够帮助你区分哪些是语言的精华,哪些是糟
粕,对于语言精华,应该深入学习。糟粕部分能看懂别人写的代码就行,自己就不用尝试了。
有了以上基础,就可以进行一般的静态网页设计,不过对于复杂的页面还需要进一步学习。
1、CSS。必看《精通CSS》,看完这本书你应该对:盒子模型,流动,Block,inline,层叠,样式优先级,等概念非常了解了。作为练习可以看下《CSS艺门之匠》这本书,它对标题,背景,圆角,导航条,table,表单等主题都有详细的介绍。
2、Javascript。上面提到内容还不足以让你胜任JS编程。在有了基础之后,进一步学习内容包括:
a) 框架。
推荐jQuery,简单易用,上手jQuery即可完成一些简单的项目。学习方法也很简单,照着产品文档做
几个页面就行了,不用面面俱到,以后遇到问题查文档就行了。框架可以帮你屏蔽浏览器的差异性,让你能更专注与Web开发学习的精髓部分。补充: 可以使用
Codecademy 学习 Javascript,jQuery,用户体验真的很好(感谢 TonyOuyang )。
b) Javascript 语言范式
。这个名字可能并不恰当,只是我找不到可以描述“面向对象”,“函数式”这个两个概念的概念。Javascript不完全是一个面向对象的语言,它的很多
设计理念都有函数编程语言的影子,甚至说如果你不用面向对象,完全可以把它理解成一门函数式编程语言。
Javascript的很多语言特性,都是因为他具有函数式语言的特点才存在的。这部分推荐先学习面向对象的基本理论,对封装,继承,多态等概念要
理解,维基百科,百度百科会是你的帮手,另外推荐《Object Oriented
Javascript》,应该有中文版。对与函数式编程我了解的也不系统,不好多说,可以自己百度一下。
c) Javascript 语言内部机制。必须弄清如下概念:JS
中变量的作用域,变量传递方式,函数的定义环境与执行环境,闭包,函数的四种调用方式(一般函数,对象的方法,apply,call),以及四种调用方式
下,‘this’指向的是谁。这部分内容你会在《Javascript语言精粹》中详细了解。另外,你必须理解 json。
d) dom编程,这个Web前端工程师的核心技能之一。必读《Dom编程艺术》,另外《高性能 Javascript》这本书中关于dom编程的部分讲的也很好。
e) Ajax编程,这是另一核心技术。Ajax建议在网上查些资料,了解这个概念的来龙去脉,百度百科,维基百科上的内容就足够了。真正编程是很容易的,如今几乎所有框架都对Ajax有良好的封装,编程并不复杂。
f) 了解浏览器差异性。这部分包括CSS和js两部分,浏览器差异内容很多,建议在实践中多多积累。另外对于浏览器的渲染模式,DOCTYPE等内容应该系统学习。
3、HTML5和CSS3 。HTML5规范已经于2014年10月28日发布了,移动端HTML5和CSS3已经得到了非常广泛的使用,必知必会呀。

再进一阶 · 代码层面:
有了以上知识,对于大多数小型网站,你应该已经可以写出能够工作的代码了。但要想成为更专业的前端,你还需继续努力。更高的要求大概还有四方面:1)易维护,2)可测试,3)高性能,4)低流量(移动端)。
1)易维护。对于页面你该理解‘样式’,‘数据’,‘行为’三者分离,对应的当然就是CSS,HTML,js。对于js代码,你最好了解设计模式,重构,MVC等内容。
2)可测性。
3)高性能。必读《高性能Javascript》
4)低流量。移动端关注比较多。
5)对于想要学习前端的同学,尤其是自学的伙伴,自学并非永久的,假如没有定力的还是找个培训机构吧。
再进一阶 · 工程层面:
前端项目同样面临软件生命周期的各个环节,首先是代码管理,你必须学会使用Svn和Git。其次是代码的构建,如今前端代码构建已经不是简单的压缩一下了,需要进行依赖管理、模块合并、各种编译,比需要学会使用Grunt、Gulp等前端构建工具。

对于前端开发,基本内容就这些了,可以根据自己的兴趣爱好选择性学习以下内容。
1、交互设计。大公司依然有专业人士搞这些,不过不懂交互的前端一定不是好前端。

2、后端。
应该说前段工程师必须至少了解一门后端语言,不过如果爱好也可深入学习,入手难度比较低的应该是PHP了。这部分由可分为基于页面,基于框架两种。
大型项目都是基于框架开发的,建议至少了解一个MVC框架,比如PHP的Ci、Yii、Yaf
等,好还框架的设计思想都大同小异。如今NodeJs在大公司已经得到普遍的使用,推荐大家使用在Node上使用Express框架做一些后端服务的开
发。
3、Android和IOS开发。
时至今日,前端的工作领域已经非常广泛,native的界面开发本质上也是前端开发,个大公司都面临着Native环境和web环境页面同时维护的问题,如果能够在技术上得到统一,将会有巨大的价值。对于学有余力的同学,应该了解Native开发的基本流程,至少了解到界面构建的技术。 books
Javascript Mobile Application Development
Mobile Javascript Application Development - O'Reilly Media
Mobile First Design with HTML5 and CSS3
Responsive Web Design by Example
Sencha Touch 2 Mobile Javascript Framework
Mobile HTML5 - O'Reilly Media
Responsive Web Design by Example
HTML5 and CSS3 Responsive Web Design Cookbook
Responsive Web Design with HTML5 and CSS3

rwd
Media Queries
Responsive Design Knowledge Hub

关注spec.
Standards for Web Applications on Mobile: current state and roadmap 《HTML5 触摸界面设计》这本书讲的很不错 www.w3school.com.cn/

熟悉与HTML的关系和区别,熟练掌握CSS3(响应式布局)、绘图API以及相关JsAPI的使用

第一章: HTML5概述

1

HTML的发展,HTML5的诞生,HTML5和HTML的关系和区别

2

HTML5的目标、HTML5与之前HTML语法的改变、新增的元素和废除的元素、全局属性

第二章: HTML5基础

1

新增文档结构元素(Article、section、nav、aside、header、footer、address)

2

表单改良(input改良以及output元素的新增)、验证、自定义错误信息

3

文件API(FileList对象和File对象、FileReader接口)、和拖放API(自定义拖放图标)

阶段性项目: 复习具体知识点,和HTML4文档结构做对比,熟练使用表单和文件新功能

第三章: CSS3

1

CSS3的概念以及对比CSS2区别、新增的后代选择器、新增伪类选择器(before、after…)

选择器相关

2

文本阴影(text-shadow)、文本自动换行(word-break)、自定义字体(@font-face)

文本相关

3

圆角(border-radius)、图片边框(border-image)、盒阴影(box-shadow)、两端对齐

盒子相关

4

变形处理(transform)、动画(transitions)、帧定义(key-frames)、旋转(rotate)

动画相关

5

视角(perspective)、变形类型(transform-style)、圆点(transform-origin)、3D旋转

3D相关

6

响应式布局概念以及语法(@media)、web网页和mobile网页的区别、样式继承

响应式布局

阶段性项目: 课堂案例举一反三,作业完成,2D(网易邮箱首页动态图壁报)和3D动画(模拟3D城市)

第四章: HTML5高级之绘制图形

1

Canvas标签基础知识、绘制矩形、绘制圆形、使用路径、图像裁剪、保存为文件、简单动画

2

Svg体系的基础知识、和canvas标签的功能对比、和canvas的区别、绘制动画

阶段性项目: canvas实现银河系旋转、svg实现萌Q宝宝,时钟

第五章: HTML5高级之多媒体

1

多媒体的概念、audio音频元素、音频元素JavascriptAPI、音频回调事件、audioContext

2

Video视频元素、视频元素JavascriptAPI、视频回调事件

阶段性项目: 潭州音乐播放器(音乐播放、歌词同步、曲谱图、MV同步)

终篇: HTML5企业级实战技术

1

本地存储web storage、本地数据库基础概念和sql基础

本地存储

2

缓存概念、本地缓存和浏览器网页缓存的区别、本地缓存applicationCache

本地缓存

3

通信基础知识、跨文档消息传输的概念、webSocket通讯

通信

4

定位基础知识以及原理、通过GeolocationAPI获得地理位置信息、结合google(高德)地图定位

GPS及定位

5

PhoneGap实现各种传感器、光度传感器、方向传感器、重力感应等

传感器

阶段性项目: 每个都有对应的项目案例可以实现

综合项目(新浪微博手机响应式布局网站 潭州微商城开发 等企业响应式手机网站)

推荐个博客吧,前端学习者应该知道的比较多首页 » 张鑫旭,希望对你有帮助
推荐阅读
  • 本文介绍了前端人员必须知道的三个问题,即前端都做哪些事、前端都需要哪些技术,以及前端的发展阶段。初级阶段包括HTML、CSS、JavaScript和jQuery的基础知识。进阶阶段涵盖了面向对象编程、响应式设计、Ajax、HTML5等新兴技术。高级阶段包括架构基础、模块化开发、预编译和前沿规范等内容。此外,还介绍了一些后端服务,如Node.js。 ... [详细]
  • 本文内容为asp.net微信公众平台开发的目录汇总,包括数据库设计、多层架构框架搭建和入口实现、微信消息封装及反射赋值、关注事件、用户记录、回复文本消息、图文消息、服务搭建(接入)、自定义菜单等。同时提供了示例代码和相关的后台管理功能。内容涵盖了多个方面,适合综合运用。 ... [详细]
  • 本文介绍了如何使用PHP向系统日历中添加事件的方法,通过使用PHP技术可以实现自动添加事件的功能,从而实现全局通知系统和迅速记录工具的自动化。同时还提到了系统exchange自带的日历具有同步感的特点,以及使用web技术实现自动添加事件的优势。 ... [详细]
  • HDU 2372 El Dorado(DP)的最长上升子序列长度求解方法
    本文介绍了解决HDU 2372 El Dorado问题的一种动态规划方法,通过循环k的方式求解最长上升子序列的长度。具体实现过程包括初始化dp数组、读取数列、计算最长上升子序列长度等步骤。 ... [详细]
  • 本文讨论了Alink回归预测的不完善问题,指出目前主要针对Python做案例,对其他语言支持不足。同时介绍了pom.xml文件的基本结构和使用方法,以及Maven的相关知识。最后,对Alink回归预测的未来发展提出了期待。 ... [详细]
  • 本文讨论了如何优化解决hdu 1003 java题目的动态规划方法,通过分析加法规则和最大和的性质,提出了一种优化的思路。具体方法是,当从1加到n为负时,即sum(1,n)sum(n,s),可以继续加法计算。同时,还考虑了两种特殊情况:都是负数的情况和有0的情况。最后,通过使用Scanner类来获取输入数据。 ... [详细]
  • Mac OS 升级到11.2.2 Eclipse打不开了,报错Failed to create the Java Virtual Machine
    本文介绍了在Mac OS升级到11.2.2版本后,使用Eclipse打开时出现报错Failed to create the Java Virtual Machine的问题,并提供了解决方法。 ... [详细]
  • 知识图谱——机器大脑中的知识库
    本文介绍了知识图谱在机器大脑中的应用,以及搜索引擎在知识图谱方面的发展。以谷歌知识图谱为例,说明了知识图谱的智能化特点。通过搜索引擎用户可以获取更加智能化的答案,如搜索关键词"Marie Curie",会得到居里夫人的详细信息以及与之相关的历史人物。知识图谱的出现引起了搜索引擎行业的变革,不仅美国的微软必应,中国的百度、搜狗等搜索引擎公司也纷纷推出了自己的知识图谱。 ... [详细]
  • 本文讲述了作者通过点火测试男友的性格和承受能力,以考验婚姻问题。作者故意不安慰男友并再次点火,观察他的反应。这个行为是善意的玩人,旨在了解男友的性格和避免婚姻问题。 ... [详细]
  • 1,关于死锁的理解死锁,我们可以简单的理解为是两个线程同时使用同一资源,两个线程又得不到相应的资源而造成永无相互等待的情况。 2,模拟死锁背景介绍:我们创建一个朋友 ... [详细]
  • 《数据结构》学习笔记3——串匹配算法性能评估
    本文主要讨论串匹配算法的性能评估,包括模式匹配、字符种类数量、算法复杂度等内容。通过借助C++中的头文件和库,可以实现对串的匹配操作。其中蛮力算法的复杂度为O(m*n),通过随机取出长度为m的子串作为模式P,在文本T中进行匹配,统计平均复杂度。对于成功和失败的匹配分别进行测试,分析其平均复杂度。详情请参考相关学习资源。 ... [详细]
  • 动态规划算法的基本步骤及最长递增子序列问题详解
    本文详细介绍了动态规划算法的基本步骤,包括划分阶段、选择状态、决策和状态转移方程,并以最长递增子序列问题为例进行了详细解析。动态规划算法的有效性依赖于问题本身所具有的最优子结构性质和子问题重叠性质。通过将子问题的解保存在一个表中,在以后尽可能多地利用这些子问题的解,从而提高算法的效率。 ... [详细]
  • Java验证码——kaptcha的使用配置及样式
    本文介绍了如何使用kaptcha库来实现Java验证码的配置和样式设置,包括pom.xml的依赖配置和web.xml中servlet的配置。 ... [详细]
  • 如何查询zone下的表的信息
    本文介绍了如何通过TcaplusDB知识库查询zone下的表的信息。包括请求地址、GET请求参数说明、返回参数说明等内容。通过curl方法发起请求,并提供了请求示例。 ... [详细]
  • 在Android中解析Gson解析json数据是很方便快捷的,可以直接将json数据解析成java对象或者集合。使用Gson解析json成对象时,默认将json里对应字段的值解析到java对象里对应字段的属性里面。然而,当我们自己定义的java对象里的属性名与json里的字段名不一样时,我们可以使用@SerializedName注解来将对象里的属性跟json里字段对应值匹配起来。本文介绍了使用@SerializedName注解解析json数据的方法,并给出了具体的使用示例。 ... [详细]
author-avatar
每天洗脸的小媳妇_853
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有