后台管理UI的取舍

目录

近几年来要做二个厂家的OA系统,以前一贯采取EasyUI,1切都好,但认为有点土了,想换来现在风行的Bootstrap为底蕴的后台UI风格,想满意的基准应该达到如下多少个:

1、美观、大方、简洁

贰、包容IE八、不思索包容IE6/IE7,因为明天还有不少公司在使用Win柒系统,系统内置了IE八

三、能经过选项卡张开八个页面,不想做单页,iframe也没涉及

4、品质好,不要太笨重

5、最好以Bootstrap为基础

陆、还可望在其后别的系统中能够复用。

1遍次频仍纠结的抉择起来了,给大家介绍下我思索过的UI,也给大家三个参阅。

一、EasyUI

easyui是壹种基于jQuery的用户分界面插件集结。

EasyUI,easyui为创设当代化,互动,JavaScript应用程序,提供必需的机能。

行使easyui你不须求写过多代码,你只须要经过编写制定一些简练HTML标志,就足以定义用户分界面。

easyui是个圆满协理HTML5网页的完整框架。

easyui节省您网页开辟的命宫和局面。

easyui很简短但成效庞大的。

EasyUI 1

EasyUI 2

可取:轻量、功效庞大、无偿、包容性好、帮忙详细、使用的人多生态好

缺点:非响应式布局、有些系统看起来有点土(客户与业主的感觉、确实与新型的这一个UI有反差)

赢得:上网查找、网盘寻找大把被搭建好了基础成效的框架。下载

下载后大家可以替换来最新的一.5版的easyui

官网:http://www.jeasyui.com/,有免费版,有商业版,商业版收取金钱,协助越发详细

资源:http://www.jeasyui.net/,easyui是同胞的的著述,但服务器在国外,官方网址也是英文的,那些网址类似官网的粤语版

二、DWZ JUI

特征:DWZ富客户端框架(jQuery 福睿斯IA framework),
是礼仪之邦人温馨费用的基于jQuery落成的Ajax 锐界IA开源框架.
设计目标是简约实用,飞速支付,降低ajax开拓开销。

EasyUI 3

官网:http://jui.org/

下载:https://github.com/dwzteam/

三、HUI

H-ui前端框架是在bootstrap的思量根基上根据HTML、CSS、JAVASCCR-VIPT开垦的轻量级web前端框架,开源免费,轻易利落,包容性好,满足大好些当中华网站。分了前端UI与后端UI。

EasyUI 4

EasyUI 5

官网:http://www.h-ui.net/H-ui.admin.shtml
后台,http://www.h-ui.net/ 前台

下载:https://github.com/jackying/

症结:认为用的人少,人气小,资料不全,配套零件不多,但国人的产品符合国人的意气。

四、BUI

BUI她是依据jQuery,包容KISSY的UI类库,专致于消除后台系统的框架方案,BUI提供了丰盛的DPL含有庞大的控件库对事情做了细密的分析。

EasyUI 6

官网:http://www.builive.com/

下载:https://github.com/dxq613/bui

以为也十分冰冷、与HUI有点类似的亮点全体框架符合本人的渴求,但作风大胆说不出的认为。

五、Ace Admin

响应式Bootstrap网站后台管理种类模板ace
admin,分外不错的轻量级易用的admin后台管理种类,基于Bootstrap叁,具有无敌的功效组件以及UI组件,基本能满意后台管理种类的急需,而且能依据差异道具适配显示,而且还有几个大旨得以切换。从前收取报酬,好像最新版不再收取薪俸了。

EasyUI 7

EasyUI 8

EasyUI 9

EasyUI 10

下载:https://github.com/bopoda/ace

官网:http://ace.jeka.by/

感觉相比较全,效能庞大,组件多,美观,只是用了数不胜数两样的插件,包容性不错。

合作的浏览器:

  • Internet Explorer 10
  • Internet Explorer 11
  • Internet Explorer 8
  • Internet Explorer 9
  • Latest Chrome
  • Latest Firefox
  • Latest Opera
  • Latest Safari

应用的插件:

EasyUI 11EasyUI 12

EasyUI 13

jQuery 2.0.3

jQuery UI 1.10.3 (Custom Build)

Twitter Bootstrap 3.0.0

FontAwesome 3.2.1

Google "Open Sans" Font

jQuery Flot Charts 0.8.1

jQuery Sparklines 2.1.2

Easy Pie Chart 1.2.5

jQuery Knob 1.2.0

jQuery Validate 1.11.1

FuelUX 2.3.0 (Spinner & Wizard & Treeview)

FullCalendar 1.6.4

jQuery ColorBox 1.4.27

jQuery dataTables 1.9.4

jQuery Chosen 1.0

jQuery Masked Input 1.3.1

jQuery Input Limiter 1.3.1

jQuery AutoSize 1.17.7

Bootstrap Colorpicker

Bootstrap Datepicker

Bootstrap Timepicker v0.2.3

Bootstrap DateRange Picker 1.2

Bootbox.js 4.0.0

jQuery Gritter 1.7.4

jQuery slimScroll 1.1.1

Spin.js 1.3.0

jQuery UI Touch Punch 0.2.2

Google Code Prettify

ExplorerCanvas

Mindmup Wysiwyg Editor

Toopay Markdown Editor 1.1.4

X-editable 1.4.6

Select2 3.4.2

Bootstrap Tags 2.2.5

jQuery Mobile 1.3.2 (Custom Build)

jqGrid 4.5.2

Dropzone.js 3.0

Nestable lists plugin

EasyUI 14

View Code

采纳到的插件并从未分别存放,使用起来会麻烦一些。

除此以外该插件也被许几人简化、修改成选项卡+iframe风格了。

六、Metronic

Metronic 是1套精美的响应式后台管理模板,基于庞大的 照片墙 Bootstrap
框架完结。Metronic 具有简洁优雅的 Metro UI 风格分界面,6 种颜色可选,7十多个模板页面,包涵图形、表格、地图、音讯中央、监察和控制面板等后台管理项目所需的各类零件。

EasyUI 15

EasyUI 16

EasyUI 17

页面标准、精致、细腻、美观大方;功效强大、卓殊全;在享有小编来看过的依照Bootstrap的网址模板中,Metronic是本身觉着最理想的之一,其外观之和谐、作用之周详令人惊愕。Metronic
是3个自适应的HTML模版,提供后台管理模版和前端内容网页模版两种风格。

优点:

支持HTML5 和 CSS3
自适应,基于响应式 推文(Tweet)Bootstrap框架,同时面向桌面Computer、平板、手机等终端。
整合AngularJS 框架。
可自定义管理面板,包罗灵活的布局、主题、导航菜单、侧边栏等。
提供了1部分电子商务模块:CMS, C途胜M, SAAS。
多风格,提供了三个前端风格,捌个后端处理面板风格。
言必有中扁平风格设计。
700三个网页模版,1500八个UI小组件,100七个表单,80八个jQuery插件。
提供申明文书档案。

缺点:

太大了,真的不明白从那边开头

对IE的合作不佳,纵然官方注脚帮助IE八,但作者测试结果不扶助

收取费用,明天的价钱是$2八

EasyUI 18

七、H+ UI

官方网址的牵线:H+是3个全然响应式,基于Bootstrap三.三.6风尚版本开荒的扁平化大旨,她运用了主流的左右两栏式布局,使用了Html五+CSS三等当代技巧,她提供了重重的有力的能够重新组合的UI组件,并集成了流行的jQuery版本(v2.一.四),当然,也合并了好多功用庞大,用途普遍的jQuery插件,她能够用于全数的Web应用程序,如网址管理后台,网站会员大旨,CMS,CBMWX5M,OA等等,当然,您也能够对他张开深度定制,以做出更加强系统。

EasyUI 19

官网:http://www.zi-han.net/theme/hplus/

与Metronic与INSPINIA非凡像,插件格外多,收取金钱99六个人民币。

八、Admin LTE

AdminLTE 是3个依据Bootstrap
叁.x的无偿核心,它是3个全然响应式管理模板。高度可定制的,易于使用。适合从小型移动设备到大的台式机大多的荧屏分辨率。

EasyUI 20

EasyUI 21

EasyUI 22

下载:https://github.com/almasaeed2010/AdminLTE (目前star 11652+)

预览: http://almsaeedstudio.com/preview/

官网:Free Bootstrap Admin
Template

浏览器扶助:
IE 9+
Firefox (latest)
Chrome (latest)
Safari (latest)
Opera (latest)

插件:

EasyUI 23EasyUI 24

EasyUI 25

Boostrap Slider
Ion slider
Bootstrap WYSIHTML5
CKEditor
Bootstrap Colorpicker
Bootstrap Date range Picker
Bootstrap Time Picker
Data Tables
Flot
Morris.js
Sparkilne
Full Calendar
iCheck
jQuery input mask
jQuery Knob
jVector Map
Slim Scroll
Pace
Bootstrap Social Buttons

EasyUI 26

View Code

特点:

  • 响应式布局,帮衬三种设备
  • 打字与印刷增强
  • 累加可排序的面板组件
  • 二11个插件与二个自定义插件
  • 轻量、快速
  • 杰出主流浏览器,IE8不包容
  • 支持Glyphicons, Fontawesome和Ion图标

完全以为与Metronic类似、成效庞大,UI精致,被众多商行选拔。

评说中多谢网上朋友(dotNetDR_醉丶千秋)推荐,鲜明是值得关切的3个UI。

九、INSPINIA

INSPINIA是平面设计观念的军管模板。它是充裕响应的由Bootstrap三+框架开采的沙盘,HTML5和CSS三。它有不少可选用的UI组件和购并了最新的jQuery插件。它能够用于全数项目标web应用程序自定义管理面板中,项目管理连串,管理仪表板,应用程序的后端,CMS或CEscortM。

EasyUI 27

EasyUI 28

EasyUI 29

与Metronic一样,风格也比较像,个人感觉比Metronic还要庞大学一年级些,页面规范、精致、细腻、雅观大方;作用庞大、分外全;在享有小编看出过的依靠Bootstrap的网址模板中,Metronic是自个儿认为最地道的之壹,其外观之和煦、成效之周到让人愕然。Metronic
是二个自适应的HTML模版,提供后台管理模版和前端内容网页模版两种风格。

浏览器兼容:

  • IE 9, 10, 11
  • Latest Chrome
  • Latest Firefox
  • Latest Opera
  • Latest Safari

收取工资,先天的标价是$1八。

演示地址:http://wrapbootstrap.com/preview/WB0R5L90S

特点:

EasyUI 30

相对Metronic他筹算了广大个本子,比如:

Static version, AngularJS, ASP.NET MVC5/MVC6, Meteor and Ruby on Rails
version

插件诸多,但都按引用分文件夹存放了,静态版本中本身看了便是420个插件,有PSD源文件,提供的文书包蕴:

EasyUI 31EasyUI 32

EasyUI 33

Static Full Version
Static Seed Project
MVC5 Full Version
MVC5 Seed Project
MVC6 Full Version (.NET RC1)
MVC6 Seed Project (.NET RC1)
Ruby on Rails Full Version
Ruby on Rails Seed Project
Meteor Full Version
Meteor Seed Project
Angular Full Version
Angular Seed Project
Angular Seed Project Grunt
Angular Seed Project Gulp
Angular Seed Project MEANJS
Documentation
Landing Page
LESS
SASS
SCSS
PSD Files (more than 20 main views and components full layered)

EasyUI 34

View Code

详见介绍:https://wrapbootstrap.com/theme/inspinia-responsive-admin-theme-WB0R5L90S

十、LigerUI

LigerUI 是依照jQuery
的UI框架,其焦点设计目标是全速支付、使用简便、作用强大、轻量级、易扩充。简单而又有力,致力于高效缔造Web前端分界面消除方案,能够运用于.net,jsp,php等等web服务器景况。

EasyUI 35

EasyUI 36

EasyUI 37

官网:http://www.ligerui.com/

演示:http://www.ligerui.com/demo.html

特点:

应用简易,轻量级
控件实用性强,成效覆盖面大,能够化解超过四分之二商厦音讯应用的准备场景
登时支付,使用LigerUI能够比古板支付收缩十分的大的代码量
易扩充,包罗暗中同意参数、表单/表格编辑器、多语言扶助等等
支持Java、.NET、PHP等web服务端
支撑 IE陆+、Chrome、FireFox等浏览器
开源,源码框架等级次序简单易懂。

下载:http://pan.baidu.com/s/1o83vRZk

API: http://api.ligerui.com/

示范地址: http://demo.ligerui.com/

源码下载: http://git.oschina.net/ligerui/LigerUI/ (源码托管)

     http://pan.baidu.com/s/1D0AVO (V1.2.3)

才干匡助: http://www.cnblogs.com/leoxie2011/

个人感觉文书档案相比较全,也有集团的音讯系列采纳了该UI(2018年本身去一家市四培养他们就选择该UI,前边上头说要换美丽些的,他们纠结好久),但结合认为比不上EasyUI,与DotNet亲一点深感,DWZ则与Java新一些。

LigerUI中夏族民共和国人支付的、无需付费。

十一、其它UI

EasyUI 38

EasyUI 39

十二、总结

平素不方式就向来不内容、UI主要,更加是当客户与总COO不懂太多关于代码、作用、品质的时候。

地点的UI你恐怕能够透过种种渠道获得,但生意利用请慎重。

想来想去照旧拿不定主意,不过有些主张:

1、使用HUI和bootstrap

二、使用EasyUI的框架,内容页使用HUI+BootStrap,iframe选项卡

3、从各种作用强大的页面中拿一些插件过来

http://www.cnblogs.com/best/p/5782891.html

 

相关文章