构建漂亮的应用
一个web app的视觉设计不仅要看起来美，也要用起来让人觉得方便，你的应用的美学设计将直接影响人们使用应用时的易用性。一个有着丰富视觉感受的应用既能让人用起来愉快，又不会分散人的注意力。它注重美观，使用类似于native apps设计模式的同时又不失易用性。
美观的图片、颜色、字体和速度、易读性、易用性之间需要达到均衡。用户和文化背景也非常重要，因为在不同文化中，颜色、布局以及文字选择可能有不同含义。应用的视觉设计不仅要让用户感觉愉悦，也要让他们觉得使用方便。
广州网站建设,网站建设,广州网页设计,广州网站设计
使用开放web特性来提供漂亮的设计
人们期待看到的web apps是与客户端或者mobile apps有着同样的视觉感受，而不是和平淡的web内容一样。
Figure 4.1 -美不美由应用的使用者说了算!
开发者可以通过使用以下技术来创造丰富的沉浸体验：
1.具有交互性和用户相关性的实时绘图界面。
2.加强可读性的字体和排版特性。
3.增加美观的纹理、渐变和变形，又要保证不会让人分心。
4.提示应用当前进度的图像和动画。
5.高质量高分辨率的图片，无论用户如何调整浏览器窗口，这些图片都不失美观。
6.在应用中使用现实世界中也有的图像、图示和图标，增加熟悉感和现实感，让用户容易将现实生活中的经验转移到应用中去。
广州网站建设,网站建设,广州网页设计,广州网站设计
有用的资源：
文章
- 更有意义的字体 –来自于 Tim Brown所写的书的一掌
- 网页排版 – 来自于 Jason Santa Maria所写的书的一章
- SAFARI CSS 视觉效果指南
手册
库& 框架
- GOOGLE WEB FONTS API -Google Web Fonts让每个人都能很快制作web fonts，包括专业设计人员和开发人员。我们相信在制作好网站的道路上不应该有任何障碍。
- TYPEKIT -简单、符合标准的、容易获取的、完全合法的web字体。
- CSS3 GRADIENT GENERATOR - 展现了CSS gradients的强大力量。
- ULTIMATE CSS GRADIENT GENERATOR -来自于 ColorZilla 的一个强有力的类似于Photoshop CSS gradient 编辑器。
样例
使用全屏
Web页面和web apps之间的一大区别就是它们如何使用可用的屏幕空间。好的web apps和客户端应用一样，会占满可用的屏幕空间。
要有一个好的视觉设计，设计者应该做到：
让你的app看起来像是一个应用，而不是一个有着左右边框的网站。
将可用的屏幕空间占满。因为你不能确定设备具体尺寸，那么让内容可以根据屏幕大小进行调整，支持屏幕窗口大小调整，并且在需要的时候使用滚动。
避免固定宽度的布局，因为这样的布局的左右边框会让用户联想起web页面。
使用Full Screen API在合适的时候提供一个全屏界面。
Figure 4.2 -采用各种方式去引导你的用户!
使用全屏的web apps包括：
Web apps不应使用传统的导航元素
Web apps不应以来传统的浏览器导航元素，比如后退、前进、刷新按钮的等。它们也不应该使用传统的页面内导航元素，比如左侧或者顶端的向下链接。
尽管web apps不使用这些传统的导航元素，它们可能使用地址栏以保存或共享状态，使用向前或向后按钮在不同状态间切换。用户不再使用链接在不同页面间切换，而是使用按钮来改变当前内容的状态。。
让使用变得简单
人们在面对复杂冗长的注册过程时往往会望而却步。如果你的应用需要用户登录，那么，这个过程需要非常简单，只需要最少的信息就可以了。如果可能的话，让用户可以通过一个已有的OpenID来注册。在可以少管理一些账户和密码的时候，用户是非常开心的。
为了减少用户被吓走的几率，让注册登录过程更为简单，可以按如下方式去做：
1. 对于不想登录或注册的用户提供应用。
2. 对于选择注册登录的用户进行一些奖励，比如附加功能或是更为完整的服务。
3. 支持通过OpenID来注册，比如Google账户，以减少用户需要记忆的用户名和密码。
4. 如果你已经有了一个登录系统，考虑将其与OpenID建立关联。
在这些方面做的很好的WEB APPS ：
ETHERPAD - EtherPad让用户可以立刻开始使用应用，并且只在用户想要保存的时候才要去他们注册。
PICNIK -让登陆门槛很低，用户可以不用登陆或注册就能编辑并保存照片。
Figure 4.3 – 让人们在初次尝试时就觉得简单!
有用的资源：
库 & 框架
GOOGLE IDENTITY TOOLKIT (GITKIT) 是一个免费工具包，网站经营者可以使用它让用户通过邮件地址和密码登陆，并通过联合登陆替换密码。
JANRAIN LOGIN HELPER 帮助网站实现基于电子邮件的注册，通过内联电子邮件验证帮助注册转换。
样例
OPENID WIKI GALLERY –– 一个使用用户已有账户的创新性的登陆注册应用。
提供离线功能，提升性能
开发者应该提供离线应用功能，并且通过在本地缓存应用数据来提升性能，在用户联网的时候只解析需要的数据。
要提升性能并提供离线功能，可以按如下方式去做：
◆ 使用应用缓存来确保浏览器将必须的应用代码进行了缓存，比如HTML、CSS和Javascript。
◆ 使用web存储来保存少量需要快速获取的信息，或者将这些信息保存在cookies中。
◆ 将组织好的数据存储一个web数据库，比如IndexedDB，它能让你存储大量数据，并且能进行高效查询和遍历。
在这方面做的很好的WEB APPS：
AMAZON KINDLE CLOUD READER – 使用 AppCache, 本地存储以及WebSQL可以在 iOS上的以及桌面版的浏览器中工作。
SPRINGPAD- 使用 AppCache, 本地存储以及WebSQL，提供了一个不论是否在线都能使用的应用。
THE NEW YORK TIMES WEB APP – 使用 AppCache以及WebSQL，提供了一个再iOS以及桌面浏览器上都能工作的离线应用。
Figure 4.4 – 让数据保存在手边以提升性能!
有用的资源：
文章
库 & 框架
