最新详解开源HTML5框架Amaze UI

目前正处于内测期。根据Amaze UI的官网介绍，该框架以mobile first为特点，解决了Web应用从PC向多屏适配的问题，并且兼容国内主流浏览器和平台，并且专注解决中文排版优化问题。

1.现在有很多前端框架，为什么还要开发Amaze UI?

虽然国内有很多前端框架，但能够解决跨屏适配和兼容性问题的技术却很少。再加上国内对开源技术意识不够强烈，许多成熟技术都被封闭在公司内部使用，在整个产业链上难以实现相互交流。

同时移动和跨屏已经成为当前互联网最热门的技术，前端开发者在开发网页时常常需要解决繁琐的跨屏和适配问题，这耗费了大量精力，影响了工作效率和产品开发进度。

2.与Amaze UI功能类似的其他框架有哪些？你认为它们有什么不足之处？

目前国外有一些功能类似的开源框架，如Bootstrap、Foundation、Semantic UI。

Bootstrap是Twitter于2011年8月推出的一个开源WEB前端框架，集合了CSS和HTML，并使用最新浏览器技术，为快速WEB开发提供了一套前端工具包。Bootstrap拥有美观的样式和完善封装的JQ插件，并且使用方便。基于Bootstrap还有很多扩展可用，这是其他框架无法比拟并且最受欢迎之一。

Foundation自称是全球最好用的响应式前端框架，默认支持5种网格布局。它是三个框架中最复杂也最灵活的一个。而Bootstrap默认支持四种网格布局，Pure只支持一种。

Semantic UI则是一个语义化设计的前端框架，在UI组件上更加直观，可以实时调试输出。它最大的特点是充分利用了CSS3动画特效，样式简洁实用漂亮。

我们也使用过上述各种产品，当时发现全球近6%的网站都是基于Bootstrap开发的。但对于中国开发者来说，Bootstrap门槛较高，并且本土化支持不够好。首先，Bootstrap只支持英文字体，并未设置中文字体。在不同操作系统和浏览器下，默认中文字体可能会有所差异，导致网页显示效果不佳。此外，英文和中文字号大小也有差异，在使用Bootstrap进行文字排版时无法达到最佳效果。另外，在国内浏览器种类繁多的情况下，Bootstrap无法完全适应国内浏览器需求。我们希望能够加强对各种本土浏览器的支持，并帮助前端开发者摆脱繁琐而痛苦的兼容性问题。

其次, Bootstrap最初是从PC端开始设计的, 所以在某些方面更偏向PC而非移动设备. 而Amaze UI则采取了先移动后PC 的思路. 例如, Bootstrap使用jQuery库, 而Amaze UI则选择了Zepto.js. Zepto.js相比jQuery体积更小, 对移动端性能有很大提升. 因此, 针对中国市场的、移动优先的跨屏前端开发框架是开发者们迫切需要的，也是一个行业空白。

3.Amaze UI针对上述问题提出了什么不同的解决思路？

在解决思路上，Amaze UI通过拆分和封装常用网页组件，以规范化方式开发移动网站，并统一用户体验。

具体措施如下：

语义化。

Amaze UI遵循语义化原则，在类名等信息中直观传达元素功能角色，并关注结构、样式和行为分离，降低各部分之间的耦合度，提高开发效率和可维护性。

移动优先，跨屏适配。

遵循“移动优先”和“渐进增强”的理念，在移动设备上开始开发网站，并逐步扩展到更大屏幕设备上。专注于最重要内容和交互，在流行趋势下实现轻松创建跨屏适配的网页。

模块化，按需定制。

AUI使用LESS编写样式，结构良好，易于扩展和维护。使用Seajs进行模块化开发和组织JavaScript，自然而优雅。

本地化支持。

相比国外的前端框架，Amaze UI专注解决中文排版优化问题。根据操作系统调整字体以实现最佳中文排版效果，并提供更好的兼容性支持以适应国内主流浏览器和App内置浏览器。这将节省大量兼容性调试时间。

4.Amaze UI目前处于内测期，有什么期待和下一步计划？

Amaze UI目前正在进行内测阶段，并希望能够收集到更多有建设性的反馈意见与看法。我们希望与广大优秀前端开发者共同完善Amaze UI功能，并推动中国移动跨屏前端技术的发展。