设计与用户体验
本章帮助你了解Web交互设计和优化用户体验的相关方法。
设计最佳的用户体验：帮助你了解什么事最佳的用户体验。
用户体验基础知识：本文介绍的工作流程可以帮助团队、产品、初创企业以及公司打造一个可靠而又有意义的流程，为其客户开发更优质的用户体验。
怎样才算出色的移动网站：通过与美国参与者进行长达 119 小时的亲自易用性实验来完成的研究发现的 25 个移动网站设计原则。
无障碍功能：本指南旨在帮助您了解如何才能让所有人都能访问和使用您的网站。
焦点：谈论焦点以及如何在应用中对其进行管理。
DOM 顺序至关重要：使用原生元素对了解焦点行为极有帮助，因为是根据这些元素在 DOM 中的位置自动将它们插入跳格顺序的。
使用 tabindex：原生元素 DOM 位置提供的默认 Tab 键顺序虽然方便，但有时您需要修改 Tab 键顺序。
语义：我们将发动您思考其他无障碍因素。
ARIA：我们将探究如何表达 HTML 无法自行表达的语义。
可访问的样式：了解可访问性的第三个方面，即样式化。
动画：本章将帮助你了解使网络应用和网站吸引人的重要因素，动画。
CSS动画 vs JavaScript 动画：在网页上创建动画有两种主要方法：使用 CSS 和使用 JavaScript。您选择哪种方法实际上取决于项目的其他依赖关系，以及您尝试实现什么类型的效果。
缓动的基础知识：自然的运动会让用户对您的应用感觉更舒适，从而产生更好的总体体验。
自定义缓动：有时您不想使用 CSS 随附的缓动关键字，或者要使用 Web Animations 或 JavaScript 框架。在这些情况下，一般可以定义自己的曲线（或公式），这让您能更好地控制项目动画的感觉。
在视图之间设置动画：您常常需要让用户在应用的各视图之间切换，不管是从列表换到详情视图，还是显示边栏导航。在这些视图之间设置动画可以吸引用户，并让您的项目更生动活泼。
选择合适的缓动：前面已经讨论了可在动画中实现缓动的各种选项，您应当在项目中使用哪种？您的动画应采用哪种持续时间？
给模态视图设置动画：模态视图用于重要消息，并且您有很好的理由来阻止用户界面。应谨慎使用模态视图，因为它们具有破坏性，如果过度使用，会很容易破坏用户体验。但是，在某些情况下，它们是适合使用的视图，并且加上一些动画将使其变得生动。
不对称的动画定时：不对称的动画定时可让您在表达个性的同时快速响应用户交互，从而提升用户体验。还能使感觉出现对比，使界面在视觉上更吸引人。
动画与性能：在设置动画时应保持 60fps，因为任何卡顿或停顿都会引起用户注意，并对其体验产生负面影响。
响应用户界面：创建灵活设计，而不是固定的设计,布局。并且能够在任何尺寸的屏幕正常运行。