如何现代化院系的网站

2014-8-22

从界面上来说,很多院系、部门的网站已经过时了。过时的还可能有这些网站使用的其他技术。不过时的是对IE的完美兼容。

视觉上的现代感


如何让一个院系的网站有现代感呢? 我们先看一下Rachel Sprung在The 7 Elements of Modern Web Design中提出的现代化网页设计的7个要素。

  • 独特的排版:独特的排版可以使得用户很快地识别出这个网站,这个排版也包括字体的样式和大小。
  • 扁平化设计:扁平化设计以其简洁的外观出名。扁平化设计并不使用3D效果等技术,而使用简单的带有鲜艳色彩的插图。
  • 悬停效果:悬停效果可以让你辨别你在网站的什么位置。当你的光标放在网页中的某个位置上时,这个部分会产生悬停效果。悬停效果通常以改变颜色或者高亮的形式让你知道你在看哪里。
  • 滚动到网页的不同部分:有些网站有这样一个特点,当你点击一个链接,这个链接会把你带到网页的其他部分。
  • 大尺寸的产品图片:这样的图片可以让设计者更好地去诠释产品的各个特点。
  • 有深度的关于产品的视频:根据一项调查,多数B2B谷歌会观看在线视频。
  • 大尺寸的响应式图片:大尺寸的响应式图片会和屏幕大小保持一致,用户不需要滚动窗口就可以知道图片的内容。

这些网站的设计可以参考一下:
http://www.newyorker.com/
http://wistia.com/
http://www.amerifirst.com/
http://www.urbanbound.com
http://www.hubspot.com/products/content-optimization-system
http://www.ge.com/
https://www.uber.com/

上面给出的要素并不全面,Jake Rocheleau在Web Design: 20 Hottest Trends To Watch Out For in 2013给出了更多的要素。

  • 响应式布局。
  • 支持视网膜屏。
  • 固定的顶部菜单。
  • 大尺寸的图片背景。
  • 基于CSS的透明化。
  • 极简的着陆页
  • 数字化的二维码。
  • 社交媒体图标。
  • 细致的插图。
  • 瀑布流。
    ….等等。

基于上面的这些要素,就可以设计出更有现代感的网页出来。

如何使用更现代的技术

笔者并不清楚现有的学院网站是如何实现的,可能是指定的IT公司来实现,IT公司可能使用自有的模块来拼接一个网站。

所谓更现代的技术,也只是相对于以前的网页设计技术、后台管理方式、产品的模块化程度等方面而言的。在笔者看来,Worpress作为当前一个极为流行的博客框架,是可以用来做院系的官方网站的。若使用Wordpress,后台的功能都是够用的,前台的话,写个现代化的Theme即可。

更进一步


关于学生邮箱

学生邮箱系统可以加上Oauth功能。这样在学校/院系有多个相异的服务的情况下,可以方便地使用它们。

不如换种方式来思考BBS

有些院校还保留着BBS这一论坛服务。在今天,BBS更像一个“百度贴吧”,而非“知乎”,从这点上,BBS算是已经过时了。出于个人喜好的原因,以discuz为例子,笔者觉得页面过于拥挤,让人眼花缭乱,无法专心关注实质内容。也许,一个院系有一个单独的论坛是一个不错的选择。以计算机相关院系为例,可以为学生搭建一个类似http://cnodejs.org/的技术论坛,如果引导得当,这样能让整个学院热闹起来,学生之间的交流会更多,甚至带动整个学院的技术氛围都是很有可能的。另外一个好处是,可以发现更多的优秀学生。

( 完 )