RedCoral改版和重构

Yeolar   2014-03-13 15:15  

RedCoral网站系统 日程管理工具设计和FullCalendar、qTip2、Fancybox三个js控件介绍

这几年的移动浪潮似乎已经把整个世界改造了一遍。大大小小的公司都在以淘金般的热情投入其中,大家拼命地把自己原有的PC端应用在手机上重新造出来,以在全世界的人们都把自己的时间转移到手机上之时,不至于遭到冷落。

不过还有大量的网站仍未能在手机上适配,我自己的这个小站就是其中一个。最近时间有闲,于是把网站做了改版,过程当中也许有些经验可以分享给大家。

移动开发分成客户端和WEB两类,这里只讨论一下WEB端。对于移动WEB来说,其实在服务器上工作的网站后台和PC时代的情况并没有多少不同,区别只是我们现在需要对手机上的展示效果做针对性的适配。

经验一 使用一个能很好地适配移动设备的前端UI框架,比如Bootstrap

Bootstrap是Twitter的一个开源前端UI框架,采用移动优先的设计理念,扁平化的设计风格。应该说Bootstrap是现在最好的开源移动UI框架。使用Bootstrap可以大量节省界面开发的时间,而且很漂亮(对于非专业前端而言),要注意的是它已经不支持IE7和以下的版本了,不过这一点问题并不大。

可以每个组件都尝试用一用,就能体会到它的优秀。

经验二 简化你的应用

这包括三点:

  1. 同一件事情尽量用一种方式来表达,这样可以避免重复和歧义。
  2. 去掉不常用的东西。在你几乎用不上的东西上花时间是奢侈的。
  3. 减少单页面上的元素,因为移动设备的可视区域和可操作性都要低于PC。

我在重构网站时充分地遵从了这些原则:去掉了不常用的book、news和finance应用;去掉了国际化支持,国际化支持在改动网站时带来了很大的不便,而且网站本身也主要面向国内,所以它其实是不必要的;在UI设计上,也简化了很多。

经验三 引入版本管理

这招已经不新鲜了。主要是因为我的网站是自己一个人开发,而且上一版本也是几年前的了,那时还没接触到这些版本控制的工具。这次重构引入了GIT做版本管理。

在此向大家推荐GIT,相比SVN,感觉它更灵活一些,而且还有Github这样的成熟的版本管理的前端。

经验四 遵循适用原则

和杀鸡不用牛刀是一个意思。本来在这次重构之前,打算用Tornado重新搭建网站,而且分为内容展示和内容管理两个系统,展示使用Tornado+Bootstrap,管理仍使用Django。但是因为时间和精力的原因,最终放弃了这个方案。

对于一个个人的小站来说,Django的性能已经足够,丰富的特性和组件使开发上又比Tornado要节省很多工作量,所以最终对后台并没有做太大的改动。

个人很喜欢Tornado,忍住冲动而做出正确的选择确实是不容易的。

http://www.yeolar.com/note/2014/03/13/redcoral-ui-redesign-and-code-refactoring/

http://www.yeolar.com/note/2014/03/13/redcoral-ui-redesign-and-code-refactoring/