杂货铺

杂货铺中囤杂货

👉 所有文章
技术 理解 HTML 中的 pre 标签 使用 prismjs 代码高亮库 理解 sitemap.xml 解决 Intellij IDEA 右下角不显示 git 分支的问题 并发与并行的区别 ASCII码对照表 理解字符编码、Unicode、UTF-8、UTF-16 认证与鉴权的区别
工具 DBeaver: 跨平台的数据库管理工具 Snipaste: 一个非常好用的截图、贴图工具 常见的网页版流程图、UML建模工具 实用 Chrome 谷歌浏览器插件 低多边形图片生成工具 一些好用的 Markdown 编辑器 Windows 下好用的软件 使用 Genymotion 模拟 Android 环境 实用工具整理 实用网站整理 calibre - 电子书管理软件
其他 试用Atom编辑器 解决谷歌索引404网页的问题 解决论文编译后没有参考文献 思维导图,认清自己,制定目标 想法若干——关于地图 man2:一个快速查找命令使用示例的工具 浅入浅出CouchDB:CouchDB安装 浅入浅出CouchDB:使用curl管理CouchDB 如何修改自己在github中的项目 对c++指向数组指针的一些理解 升级wordpress出现错误:Request exceeded the limit of 10 internal redirects The spirit of softwares 方法链 一些不错的网站 苹果的swift 如何现代化院系的网站 事前、事中、事后 关于选择的一些思考 重要紧急矩阵 二八定律 真相 如何在电脑上使用微信读书 ? 如何关闭微信读书的「看一看」? 从零开始Docker化Ghost博客系统 ghost博客添加多说评论 以生产模式运行Ghost博客系统 Ghost博客主题制作简明教程 将Ghost打造成一个本地APP 重置Ghost博客中的用户密码 在Ubuntu中安装Ghost博客系统 为Ghost博客添加标签云
已迁移 【已迁移】故事: 2020 【已迁移】故事: 2019-nCoV 肺炎

如何现代化院系的网站


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/的技术论坛,如果引导得当,这样能让整个学院热闹起来,学生之间的交流会更多,甚至带动整个学院的技术氛围都是很有可能的。另外一个好处是,可以发现更多的优秀学生。


( 本文完 )

文章目录