响应式Web设计从入门到精通(套装共5册)电子书

《响应式Web图形设计》

内容提要

其他

前言

第1章 了解HTML

1.1 为什么要学习HTML？

1.1.1 HTML使得因特网更受欢迎

1.1.2 学习HTML，更好地理解网页设计

1.1.3 学习HTML很容易

1.2 HTML编程基础

1.2.1 文本编辑器

1.2.2 文字处理软件不是文本编辑器

1.2.3 用HTML编写代码

1.3 构建网页

1.3.1 指定DOCTYPE

1.3.2 保存和查看页面

1.4 布置页面内容

1.4.1 HTML标题

1.4.2 HTML文本标签

1.4.3 为网站创建链接

1.4.4 添加title属性

1.4.5 网站的链接

1.5 总结

第2章 使用CSS设置样式

2.1 CSS来帮忙

2.2 初识样式

2.2.1 声明

2.2.2 选择器

2.2.3 更多的CSS选择器

2.3 添加CSS格式

2.3.1 链接到CSS

2.3.2 内联样式

2.4 块和行内格式化

2.4.1 HTML的通用元素

2.4.2 伪类和伪元素

2.5 专门为IE写CSS

2.6 常规流和定位

2.6.1 静态文本流（static）

2.6.2 固定定位（fixed）

2.6.3 相对定位（relative）

2.6.4 绝对定位（absolute）

2.7 总结

第3章 网页排版

3.1 网页字体

3.1.1 size属性和值

3.1.2 那么，你应该使用什么测量值呢？

3.1.3 粗细、样式、变形和修饰

3.2 网页安全字体实践

3.2.1 网页安全字体

3.2.2 移动安全字体

3.3 制作更好的字体栈

3.4 网页中的“Real Fonts”

3.4.1 @font-face属性

3.4.2 生成嵌入文件

3.4.3 免费字体

3.4.4 商业字体

3.5 总结

第4章 网页设计中的挑战

4.1 网络环境

4.1.1 揭示浏览器问题

4.1.2 使用测试页

4.1.3 颜色

4.1.4 屏幕和像素

4.1.5 可访问性

4.2 决定你的跨浏览器目标

4.3 针对不同设备开发网站

4.3.1 重置和标准化浏览器样式

4.3.2 特殊前缀

4.3.3 检验

4.3.4 测试

4.4 总结

第5章 网页中的颜色

5.1 网页颜色编码

5.1.1 十六进制颜色标记

5.1.2 重写HTML的默认颜色

5.1.3 图像边框

5.1.4 带透明度的CSS颜色

5.2 颜色属性

5.3 原色系统

5.4 颜色组合

5.5 构建配色方案

5.5.1 寻找基色

5.5.2 文化与颜色

5.5.3 浏览颜色的启示

5.5.4 构思方案

5.6 一致的颜色

5.6.1 校正颜色

5.6.2 拾取颜色

5.7 CSS颜色表

5.8 总结

第6章 网站图像

6.1 位数的问题

6.1.1 像素深度

6.1.2 色调分离和抖动

6.1.3 更多位意味着更多颜色

6.1.4 为什么位深度如此重要？

6.2 光栅图像格式

6.2.1 GIF图像格式

6.2.2 JPEG图像格式

6.2.3 PNG图像格式

6.3 图像压缩表

6.4 SVG：网页中的矢量文件

6.5 总结

第7章 为网页创建图像

7.1 使用Illustrator

7.1.1 为网页设置工作区

7.1.2 设置文档尺寸

7.1.3 导出光栅图像

7.1.4 使用Illustrator导出矢量图像

7.2 使用Photoshop

7.2.1 新建文档

7.2.2 导出光栅图像

7.3 管理Web图像文件

7.4 减小文件尺寸

7.4.1 压缩光栅图像

7.4.2 使用HTTP压缩

7.5 总结

第8章 透明度和阴影

8.1 使用GIF图像创造透明度

8.1.1 杂边

8.2 PNG半透明图像

8.2.1 8位PNG

8.2.2 24位PNG

8.3 CSS透明度

8.3.1 圆角

8.3.2 图像蒙版

8.3.3 元素透明

8.3.4 背景色透明度

8.3.5 文本阴影

8.3.6 3D文本阴影

8.3.7 盒阴影

8.4 总结

第9章 收藏夹图标和移动书签

9.1 收藏夹图标在哪里

9.2 收藏夹图标的图像格式

9.3 将收藏夹图标插入到网站中

9.3.1 为子网站设定收藏夹图标

9.3.2 推广收藏夹图标

9.4 为网页创建收藏夹图标

9.5 移动书签

9.5.1 文件格式

9.5.2 命名规范

9.5.3 自动图像处理

9.5.4 插入图标

9.6 混合收藏夹图标与移动书签

9.7 总结

第10章 列表和图标字体

10.1 无序列表

10.1.1 CSS项目符号图标

10.1.2 插入定制图标

10.2 定义列表

10.3 有序列表

10.3.1 改变顺序

10.3.2 设置目录

10.3.3 添加有序标记的另一种写法

10.4 高效列表设计

10.5 图标字体

10.5.1 选择一种图标字体

10.5.2 突出字符或者短语

10.5.3 创建可点击的单独图标

10.6 总结

第11章 图像映射

11.1 创造图像映射

11.1.1 基础的手工编码

11.1.2 使用Fireworks

11.2 响应式图像映射

11.3 总结

第12章 页面布局

12.1 CSS浮动

12.1.1 float属性

12.1.2 多重浮动

12.1.3 clear属性

12.2 浮动页面布局

12.2.1 页面结构

12.2.2 两栏流式布局

12.2.3 两栏固定布局

12.2.4 三栏流式布局

12.2.5 三栏固定布局

12.2.6 使用浮动布局的优缺点

12.3 CSS框架

12.3.1 网格系统

12.3.2 最后看看框架

12.4 响应式布局

12.4.1 适应媒体查询

12.4.2 流式布局

12.4.3 文本回流

12.4.4 媒体查询实战

12.4.5 响应式框架

12.5 总结

第13章 响应Web设计中的图像

13.1 缩放图像和媒体

13.2 缩放图像带来的问题

13.2.1 大尺寸图像

13.2.2 更大尺寸的图像

13.2.3 把网速考虑进来

13.3 自适应图像解决方案

13.3.1 另寻他法

13.3.2 压缩Retina图像

13.4 多图像解决方案

13.4.1 picture元素

13.4.2 srcset属性

13.4.3 使用图像补丁脚本

13.5 总结

第14章 对齐图像

14.1 图像与文本的对齐

14.1.1 baseline

14.1.2 text-bottom

14.1.3 text-top

14.1.4 top和bottom

14.1.5 middle

14.2 在浏览器窗口中居中图像

14.2.1 使用CSS设置背景

14.2.2 仅用CSS

14.2.3 幸亏有jQuery，我们不用把数字写死了

14.3 在浏览器中伸展图像

14.4 总结

《移动Web实现指南——面向移动设备的网站优化、开发和设计》

内容提要

致谢

前言

第1章 移动化用户体验设计

1.1 设备并没有移动，移动的是人

1.2 移动=正在做

1.3 移动=繁忙

1.4 移动=分心

1.5 移动=轻松

1.6 移动=任务

1.7 与你的客户聊聊

1.8 撰写用户故事

1.9 将用户故事分解成设计需求

1.10 创建带有优先级的用户任务分解表

1.11 小结

第2章 移动化页面布局

2.1 标准化的页面布局已符合响应式了

2.2 是什么固定了宽度

2.3 使宽度不固定

2.4 拖曳方块

2.5 我们的网站

2.6 小结

项目访谈1 亚利桑那州立大学和MTV O Music Awards

第3章 移动化导航

3.1 表

3.1.1 尺寸

3.1.2 比例

3.1.3 设计

3.2 汽车界面

3.2.1 尺寸

3.2.2 位置

3.2.3 数量和复杂性

3.3 iOS 应用程序界面

3.3.1 计算器

3.3.2 电话界面

3.3.3 iPod

3.4 那么现在……移动化导航设计

3.4.1 HTML

3.4.2 CSS

3.4.3 移动网页CSS

3.5 小结

第4章 移动化图片

4.1 图片移动化的整体分析

4.2 内联图片

4.2.1 有时候，移动化就意味着要变小……

4.2.2 而有的时候，移动化却意味着变大

4.3 响应式图片栅格

4.4 小结

第5章 移动化文字

5.1 使用以用户为中心的方法来移动化文字

5.2 使用哪种单位：Point 还是 em

5.2.1 标题部分

5.2.2 正文：段落

5.2.3 正文：副标题

5.3 使用展示和隐藏

5.3.1 HTML

5.3.2 CSS

5.3.3 JavaScript

5.4 小结

项目访谈2 波士顿环球报

第6章 移动化表单

6.1 移动化可以提升网页表单的用户体验

6.2 Input 类型

6.2.1 input type=“text”

6.2.2 input type=“email”

6.2.3 input type=“url”

6.2.4 input type=“tel”

6.2.5 Select

6.3 小结

第7章 移动化社交媒体

7.1 大部分社会化媒体可以提供“免费”的移动改造

7.2 Twitter

7.3 Facebook

7.4 Google+

7.5 Quora

7.6 LinkedIn+

7.7 YouTube

7.8 与社交化网站连接

7.9 小结

第8章 移动化内容策略

8.1 事先对移动环境的理解，会带来更好的内容策略

8.2 移动化设计为你做好可用性评估的准备

8.3 可用性评估是优秀内容策略的第一步

8.3.1 网站说了什么

8.3.2 网站是如何组织的

8.4 内容策略的制定为你的第一个移动化设计做好准备

8.4.1 从移动滞后转变为移动先行

8.4.2 任务清单和策略化的内容也要前置

8.5 小结

项目访谈3 洲际酒店集团网站

第9章 更多移动化改造的方法：JQuery Mobile

9.1 jQuery Mobile 网页框架

9.2 jQuery Mobile 的优点和不足

9.3 网页头部

9.4 主体区域和顶栏

9.5 导航

9.6 工具栏和按钮

9.7 模态对话框菜单

9.8 表单

9.9 横屏模式

9.10 小结

第10章 更多移动化方法：设备检测和PHP引用

10.1 什么是 PHP

10.2 使用 PHP

10.2.1 修改你的HTML文件

10.2.2 设置移动屏幕和完整屏幕按钮的CSS样式

10.2.3 添加PHP引用

10.2.4 设备探测

10.2.5 完整网站和移动版的PHP引用

10.2.6 一些特殊的CSS

10.3 小结

10.4 总结

《响应式Web设计实践》

译者序

其他

致谢

第1章 无处不在的Web

1.1 我们错在哪里

1.2 设备来了，设备来了

1.2.1 屏幕尺寸

1.2.2 网速

1.2.3 对于标准的支持

1.2.4 输入方式

1.2.5 使用环境

1.3 独立站点

1.4 成为响应式的

1.5 为什么又是一本关于响应式设计的书

1.6 本书包含哪些内容

1.7 这本书写给谁

1.8 代码格式

第2章 流动布局

2.1 布局选项

2.1.1 固定布局

2.1.2 流动布局

2.1.3 弹性布局

2.1.4 混合布局

2.1.5 哪种布局是最具响应性的

2.2 字体大小

2.2.1 像素

2.2.2 em

2.2.3 百分比

2.2.4 奖励关卡：rem

2.2.5 哪种单位是最具响应性的

2.2.6 从像素转换

2.3 网格布局

2.3.1 从内容出发

2.3.2 设置网格

2.4 混合固定宽度和流动宽度

2.5 结束语

第3章 媒介查询

3.1 视口

3.1.1 像素就是像素，除非它不是像素

3.1.2 视口标签和属性

3.2 媒介查询结构

3.2.1 媒介类型

3.2.2 媒介表达式

3.2.3 逻辑关键词

3.2.4 规则

3.3 内嵌样式与外部样式

3.4 媒介查询顺序

3.4.1 从桌面端向下设计

3.4.2 从移动端向上设计

3.5 创建核心体验

3.6 确定断点

3.6.1 追随内容

3.6.2 增强对大屏幕的支持

3.6.3 使用em为媒介查询增加灵活性

3.7 导航栏

3.8 对IE的支持

3.9 结束语

第4章 响应式多媒体

4.1 问题是什么

4.2 有选择地为手机提供图片

4.2.1 JavaScript

4.2.2 matchMedia介绍

4.3 响应式图片策略

4.3.1 和浏览器比赛

4.3.2 默许浏览器的行为

4.3.3 找服务器帮忙

4.4 响应式图片的实现方法

4.4.1 Sencha.io Src

4.4.2 自适应图片

4.4.3 等等，答案是什么

4.5 背景图片

4.6 高分辨率屏幕

4.7 其他固定宽度的内容

4.7.1 视频

4.7.2 广告

4.8 结束语

第5章 计划

5.1 选择成为响应式的

5.2 考虑因素

5.2.1 性能

5.2.2 使用环境

5.2.3 内容协商

5.2.4 时间投入

5.2.5 支持

5.2.6 广告

5.2.7 结论

5.3 考虑你的分析

5.3.1 倾斜的网站分析

5.3.2 哪些统计最重要

5.3.3 倾斜的市场份额统计

5.4 考虑内容

5.4.1 内容审计

5.4.2 页面表格

5.5 考虑目标平台和设备

5.6 考虑跨设备体验

5.7 准备测试平台

5.7.1 真实设备

5.7.2 模拟器

5.7.3 第三方服务

5.8 结束语

第6章 设计流程

6.1 你的里程可能会有所不同

6.1.1 一种可交互媒介

6.1.2 协作

6.1.3 用系统的方式思考

6.2 优先考虑手机

6.2.1 手机在爆炸式地增长

6.2.2 手机迫使你专注

6.2.3 手机延伸了你的能力

6.3 工具

6.3.1 线框图

6.3.2 模型

6.3.3 样式向导

6.4 结束语

第7章 响应式内容

7.1 从内容开始

7.2 内容类型

7.2.1 目的

7.2.2 创建

7.2.3 结构

7.3 在什么时候显示什么内容

7.3.1 删除内容

7.3.2 加强内容

7.4 何时改变内容的顺序

7.5 我们该何去何从

7.5.1 代码汤

7.5.2 婴儿学步

7.5.3 构建API

7.6 结束语

第8章 RESS

8.1 用户代理检测

8.1.1 用户代理字符串剖析

8.1.2 用户代理字符串可以用来做什么

8.2 功能检测

8.2.1 Modernizr

8.2.2 服务器端Modernizr

8.3 将用户代理检测和功能检测相结合

8.4 RESS：两全其美

8.5 混乱局面

8.6 安装WURFL

8.7 检测功能

8.7.1 增加功能检测

8.7.2 拨打电话

8.7.3 为触摸而优化

8.8 结束语

第9章 响应式体验

9.1 传感器系统

9.2 网络

9.3 使用环境

9.3.1 使用环境分类

9.3.2 观察及研究

9.4 设备能力

9.4.1 HTML5的输入类型

9.4.2 API

9.5 结束语

后记 展望未来

《移动网页设计与开发 HTML5+CSS3+JavaScript》

献辞

致谢

前言

多屏幕世界

难以确定的网络应用环境

本书会教些什么

第 1 章　网络平台

1.1　对术语的简短说明

1.2　你是谁，你需要知道些什么

1.3　了解什么是HTML5

1.4 　真正的HTML5

1.5　CSS3及其他

1.6　浏览器支持

1.7　测试，再测试，进行更多的测试

总结

第2章　结构和语义

2.1　HTML5的新元素

2.2　网页易读性倡议的无障碍的富因特网应用程序组件（WAI-ARIA）

2.3　语义标记的重要性

2.4　微格式

2.5　RDFa

2.6　微数据

2.7　数据属性

2.8　 Web组件：标记的未来？

总结

第3章　设置响应性CSS

3.1　媒体查询

3.2　JavaScript中的媒体查询

3.3　自适应网页设计与响应式网页设计

3.4　窗口关联的长度单位

3.5　响应式设计和被替换的对象

总结

第4章　CSS布局的新方法

4.1　多栏结构

4.2　弹性布局盒（Flexbox）

4.3　网格布局

4.4　更远的未来

总结

第5章　现代JavaScript

5.1　JavaScript的新功能

5.2　JavaScript库

5.3　polyfill和shim

5.4　测试和调试

总结

第6章　Device（设备）API

6.1　地理定位（Geolocation）

6.2　方向（Orientation）

6.3　全屏（Fullscreen）

6.4　振动（Vibration）

6.5　电池状态（Battery Status）

6.6　网络信息

6.7　摄像头和麦克风

6.8　网络存储（Web Storage）

6.9　拖放（Drag和Drop）

6.10　文件交互

6.11　Mozilla公司的火狐OS系统和WebAPI

6.12　PhoneGap和本地封装器

总结

第7章　图像和图形

7.1　矢量和位图比较

7.2　可缩放矢量图形

7.3　canvas元素

7.4　选择SVG或canvas的情况

总结

第8章　新表单

8.1　新输入类型

8.2　新属性

8.3　数据单（datalists）

8.4　屏幕控件与部件

8.5　将信息显示给用户

8.6　客户端表单验证

8.7　客户端验证API（Constraint Validation API）

8.8　表单和CSS

总结

第9章　多媒体

9.1　媒体元素

9.2　媒体框架结构

9.3　Media API（媒体API）

9.4　媒体事件

9.5　高级媒体交互

总结

第10章　网络应用程序

10.1　网络应用程序

10.2　混合应用程序

10.3　电视应用程序

10.4　Webinos

10.5　应用程序缓存

总结

第11章　前景

11.1　Web组件

总结

11.2　CSS的前景

总结

附录A　浏览器支持，截至2013年3月

所讨论的浏览器

启用实验性特性

第1章：网络平台

第2章：结构和语义

第3章：设备响应性CSS

第4章：CSS布局的新方法

第5章：现代JavaScript

第6章：Device（设备）API

第7章：图像和图形

第8章：新表单

第9章：多媒体

第10章：网络应用程序

第11章：前景

《移动优先与响应式Web设计》

前言

移动优先

第1章 增长

1.1 变了什么？

1.2 设备不同，功能不同

1.3 原生应用又如何？

1.4 事不宜迟

第2章 限制

2.1 屏幕大小

2.2 速度

2.3 时与地

2.4 接受限制

第3章 功能

3.1 找地铁站

3.2 浏览器又如何？

3.3 扩充功能

3.4 移动优先

第4章 组织

4.1 配合移动用户的习惯

4.2 内容比导航重要

4.3 四处浏览

4.4 返回

4.5 固定置底

4.6 保持清晰焦点

4.7 组织移动体验

第5章 动作

5.1 大就是小

5.2 触控何处？

5.3 学习触控的语言

5.4 别怕NUI

5.5 填补浮动

5.6 不能触

5.7 准备，就绪，行动

第6章 输入

6.1 欢迎输入

6.2 问问题

6.3 答题

6.4 掩盖困难

6.5 铺设选项

6.6 表格与输入栏以外

6.7 输入大跃进

第7章 布局

7.1 万物皆变，唯变不变

7.2 别无他选

7.3 流畅灵活的回应

7.4 响应式设计

7.5 设备体验

7.6 删减

7.7 布局基石

响应式Web设计

第1章 响应式网页

1.1 扣好安全带

1.2 响应式建筑

1.3 未来方向

第2章 灵活网格

2.1 灵活排版

2.2 制作灵活网格

2.3 弹性外边距和内边距

第3章 灵活图像

3.1 回头，回到标记，标记

3.2 灵活图像

3.3 这工作从不简单

3.4 灵活地铺设背景图像

3.5 学会喜欢溢出

3.6 商讨内容

3.7 灵活网格和图像，智慧树之作

第4章 媒体查询

4.1 开始疗伤

4.2 当前的问题

4.3 迈向响应式设计

4.4 更能响应的机器人

4.5 媒体查询实战

4.6 兼容性事宜

4.7 为何要灵活？

第5章 实现响应式

5.1 周围环境问题

5.2 响应式工作流程

5.3 负责任地实现响应式设计

5.4 再谈渐进提升

5.5 坐言起行，制作响应式设计