2016年最流行的移动Web前端框架

最近，一直在做移动端 web 开发，记录一下使用的前端框架。

目前使用过两个，一个是 Amaze UI，一个是 WeUI 。

UI是什么意思 ?

这是百度百科的定义：UI 即 User Interface( 用户界面)的简称。泛指用户的操作界面，UI 设计主要指界面的样式，美观程度。而使用上，对软件的人机交互、操作逻辑、界面美观的整体设计则是同样重要的另一个门道。好的 UI 不仅是让软件变得有个性有品味，还要让软件的操作变得舒适、简单、自由，充分体现软件的定位和特点。

UI 框架又是什么意思 ?

UI 是用户界面的英文简称，那么 UI 框架又是什么呢?框架又可以理解为模板，UI框架也就是UI模板。这和编程里的封装有些类似，就是说一些UI设计的常用效果已经被别人封装成了 UI 框架，你想实现哪个效果只要直接调用就行，不需要太纠结于底层实现。例如：一个提示框。

以下转自知乎，地址如下： ，感谢原作者！

2016年最流行的移动Web前端UI框架

村长

7 个月前

目前，众多互联网公司APP都嵌入了大量的HTML5，移动端的开发越来越重视，HTML5的运用场景也越来越多了。在移动Web开发的过程中，使用合适的移动WEB UI框架可以大大提升我们的开发效率。下面就把2016年最流行的移动Web前端UI框架分享给大家。

Amaze UI

Amaze UI是一个轻量级（所有CSS和JS gzip后100kB左右）、Mobile first的前端框架， 基于开源社区流行前端框架编写。

Amaze UI Github地址：GitHub - amazeui/amazeui: Amaze UI, a mobile-first and modular front-end framework.

Amaze UI官网：Amaze UI | 中国首个开源 HTML5 跨屏前端框架

Frozen UI

Frozen UI 是一个简单易用，轻量快捷，为移动端服务的前端框架，专注于移动web的UI框架，基于腾讯手机QQ规范。

Frozen UI Github地址：FrozenUI - 专注于移动web的UI框架

SUI

SUI是一套基于bootstrap开发的前端组件库，同时她也是一套设计规范。通过SUI，可以非常方便的设计和实现精美的页面。

SUI官网：sui.taobao.org/

ZUI

ZUI是一个开源前端实践方案，帮助你快速构现代跨屏应用。

ZUI Github地址：GitHub - easysoft/zui: ZUI is an HTML5 front UI framework.

H-ui

H-ui前端框架是在bootstrap的思想基础上基于 HTML、CSS、JAVASCRIPT开发的轻量级web前端框架，开源免费，简单灵活，兼容性好，满足大多数中国网站。

H-ui Github地址：jackying (辉哥) · GitHub

pure.css

pure.css 一组小,响应CSS模块,您可以使用在每一个web项目

pure.css Github地址：GitHub - yahoo/pure: A set of small, responsive CSS modules that you can use in every web project.

UIkit

UIkit是YOOtheme团队开发的一款轻量级、模块化的前端框架，可快速构建强大的前端web界面。UIKit使用的变量基于LESS，具有体积小、模块化、可轻松地自定义主题及响应式设计可在多种环境中使用等特点。UIkit中文网为广大国内开发者提供详尽的中文文档、代码实例等，帮助开发者快速掌握并使用这一框架。

UIkit Github地址：GitHub - uikit/uikit: A lightweight and modular front-end framework for developing fast and powerful web interfaces.

Bootstrap

Bootstrap是Twitter推出的一个用于前端开发的开源工具包。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发，是一个CSS/HTML框架。目前，Bootstrap最新版本为3.0 。Bootstrap中文网致力于为广大国内开发者提供详尽的中文文档、代码实例等，助力开发者掌握并使用这一框架。

Bootstrap中文网：Bootstrap中文网

拼图

拼图号称中国版的Bootstrap，优秀的跨屏响应式布局前端开发框架(CSS框架)，国内前端框架先驱及领导者，能自动适应电脑、平板、手机等设备，让web前端开发更简单、快速、便捷。

拼图官网：pintuer.com/

Plane UI

Plane UI是一个构建 HTML5 应用的跨终端响应式前端界面框架及解决方案。

Plane UI Github地址：Plane UI - HTML5 跨终端响应式前端界面框架

Foundation

Foundation 5是我们最快、最好的构建。多用的功能来帮助编写代码和学习比以往任何时候都要快。

Foundation官网：Foundation | The most advanced responsive front-end framework in the world.

mui

mui是最接近原生APP体验的高性能框架。

mui Github地址：GitHub - dcloudio/mui: 最接近原生APP体验的高性能框架

WeUI

WeUI是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信 Web 开发量身设计，可以令用户的使用感知更加统一。包含button、cell、dialog、 progress、 toast、article、icon等各式元素。

WeUI Github地址：GitHub - weui/weui: A UI library by WeChat official design team, includes the most useful widgets/modules in mobile web applications.

Arale

Arale 立足于支付宝的前端需求和国内前端社区，基于Sea.js和spm生态圈，致力发展小而美的前端模块架构，建立了一套从编码测试到部署的开发体系， 是一个开放、简单、易用的前端解决方案。Arale 模块均兼容于 IE6+ 以及 Chrome/Firefox/Safari/Opera 的最新稳定版。

Arale官网：aralejs.org/

Semantic UI

Semantic UI 是一款语义化设计的前端开源框架，其功能强大，使用简单，为设计师和开发师提供可复用的完美设计方案。

Semantic UI Github地址：GitHub - Semantic-Org/Semantic-UI-pt-br: Semantic dá poder a designers e desenvolvedores através da criação de um vocabulário comum para UI

Jingle UI

Jingle UI是一个基于html5、css3开发轻量级的移动webapp 框架，提供一些基本交互方式，常用的组件(scroll,actionsheet,sidemenu,toggle,push2refresh……)，帮助您更方便的开发移动应用。

Jingle UI Github地址：GitHub - shixy/Jingle: Jingle UI是一个基于html5、css3开发轻量级的移动webapp 框架，提供一些基本交互方式，常用的组件(scroll,actionsheet,sidemenu,toggle,push2refresh......)，帮助您更方便的开发移动应用。

CMUI

CMUI 是一个专攻移动网页的 UI 框架，它提供了丰富的组件和简洁的接口，开箱即用。CMUI 帮助开发者摆脱样式细节和兼容性困扰，从而腾出更多精力投入到业务开发中。

CMUI Github地址：GitHub - CMUI/CMUI: Lightweight UI solution for mobile web.

以上是在长期工作中总结出来的移动WEB UI框架资源，大家可以根据自己的业务需求去选择合适的WEB UI框架。在此不评价任何一个框架的好坏，存在就有他的合理性，总有他适合的场景。感谢这些项目的贡献者，感谢开源力量！