一般人对于企业产品的预期,可能仅停留在功能要强大,信息要安全,能够帮助企业提高工作效率。企业产品大部分都是强需求软件。
但今时已不同往日,人们开始更注重产品的用户体验。现在我们的用户在使用互联网的过程中,体验了很好的用户体验,无论是邮件系统,社区产品等。这就使得他们的使用企业产品的时候,也会希望有相同的使用体验。
企业产品竞争激烈的时候,功能差别不再是壁垒。大家都可以做到60分。好的用户体验是附加值,帮你做出差异化,赢得用户。
最近一直在搞前端技术的调研,选型,最后,我们决定基于Bootstrap3做定制,并做了一些DEMO。对Bootstrap3有了一定的了解,当然,相比大神级人物还是有很多差距的。
还是先科普一下吧。
BootStrap3 是来自Twitter的页面技术,他的JS技术是基于Jquery 1.1*的。他的CSS技术是基于LESS的动态CSS。当然他完美的将CSS3和HTML5,流体式响应布局整合起来,让三者不仅仅停留在刀耕火种的概念阶段,让三大潮流前端技术在快速应用上成为了可能。
优秀的用户体验仅仅靠靠bootstrap当然不够,还有很多,简单列举几个:
可以看出来,如果想成为一个优秀的前端工程师,要学的东西还是蛮多的。
今天,我们主要介绍下Bootstrap,别的后续会慢慢和大家聊。
先来看第一个问题,什么是Twitter风格?
两句话,扁平化设计,极简原则。如果你想象不出来,ios7,windows 8的磁贴,甚至mx3的系统都是扁平化设计的典范。
依然不明白,看下面网站;http://expo.bootcss.com/
第二个问题,什么是流体式响应布局?
适应各种分辨率的屏幕,跨平台,一次开发多次应用。
这意味着什么?以后我们开发的应用,既可以适应pc机,也可以适应pad端,手机端,甚至连TV端也适应。
这一切都归功于12栅栏系统。
栅栏系统把页面定义成了一个拥有1行12列的表格,可以各种嵌套,无任何限制。唯一的规则是这一行的列宽度要相加等于12。
非常简单就可以做出适应各种屏幕的应用。
第三个问题,Bootstrap 3到底如何简化我们的开发?
不得不说的BootStrap3 开发理念,不让你写一行JS代码,不让你写一行CSS,不让你找一张素材图。你只需要设计思路,然后就能让你做出完美的效果和页面,轻松利用上所有最新技术,并且完美兼容各种浏览器。
一句话概括:你只要知道什么时候,用什么样的class标签就可以了。
简单会用,会照猫画虎,那么你已经入门;
如果会熟练组合class,那么你已经是中级选手了;
如果你掌握足够多的class,并能轻松组合出绚丽的页面,那么你就已经高手了。
如果你心动了,想要下手了?推荐给你下面的内容:
0、http://www.bootcss.com/ 中文网
1、http://getbootstrap.com/ 英文官网
2、http://www.w3cschool.cc/bootstrap/bootstrap-tutorial.html
3、http://bootswatch.com/ 免费主题,照着抄袭吧。
4、https://wrapbootstrap.com/ 付费主题,真他奶奶的漂亮。
有这5把刀,学习Bootstrap足矣。
如果你想快速开发HTML5 流体式Web应用,如果你喜欢扁平化设计,如果不懂得那么多js和css,那么选择Bootstrap吧,BS3能用最简单的办法让你完成几乎完美的产品,并且他的Twitter团队一直在维护它,并且文档社区非常齐全。