对网站改版的一些思考
政府网站设计改版的一些经验总结
文章关键词
信息架构、设计目标、走查
（阅读本文需15分钟）
一、项目背景
（有点啰嗦，嫌长可以跳过）
前阵子接了一个活，是对惠州的政府类型网站进行UI改版。设计是附赠的，主要的合同当时并不是以设计为主，但是还差这项工作就要完成验收了。这个工作去年就做过一次优化，当时还有去惠州政府参加会议有讲述是怎么思考的，甲方也挺认可对网站修改的意见。但因为开发不是由我们公司负责，技术听到我的建议都是一直在反驳我，很明显他们也不想增加工作量吧。
这一年的时间，我再看到这个网站时已经有了不同的看法和思考方式。之前主要是一些表面的感受，这个网站除了不够美观比较老旧，还有一些明显的问题。但是这次我尝试了使用信息架构图去还原整个网站，我发现了一些根本性的问题。于是发现这个问题后我很快就跟领导沟通。我说这个网站如果只是改样式，解决不了它存在的问题，修改的程度也很有限，大概也只能从3分改到4、5分的样子；但是如果改结构，不亚于重新改版，毕竟也是4、5年前的网站设计，对于我们投入成本必然会增加。
于是我先整理了一份文档去描述问题，由于不是由我当面主讲。是由一个不懂产品开发的妹纸去讲，我需要用非常通俗的语言去给她讲述为什么要这么修改。把她讲明白了，她在会议上再跟那边的领导讲。后来妹纸跟我说，领导听到了很满意，决定要大改！！！
我觉得能把你的东西用很简单易懂跟一个小白讲明白，本身也是一件非常有意思的事情。我们做设计不就是这样，让用户能明白我们的产品是干嘛的，怎么用。在极力想让我的同事明白，这篇文档，我写的很简单易懂直白，这样客户也能听懂我想要表达的意思。再和她沟通讲述时，我尝试了很多方式，所以我对整个网站模块又有了新的认知。
好了 ，啰嗦完毕。正文。
二、网站模块剖析
1.网站的定义
一般对网站的定义，是功能的集合。由顶部导航+首页（重要功能模块）+搜索+子级页面组成。
2.核心——顶部导航
我认为，网站最核心的就是它的信息架构——顶部导航。当网站褪去它的外壳，就是它在支撑整个网站。它决定了用户到达每个目标的路径长短。如果这里没有做好，用户就不能在这里发现网站有什么。除非用户像我一样，去建一个信息架构图。但那样就本末倒置了，我们应该审视信息架构图，去布局设计界面，去让用户快速获取整个网站有什么。
设计目标：
•导航清晰——文字含义清晰，分类明确
•完整——包含网页全部功能
•简单易懂——使用更简洁易懂的文字
走查一：
导航功能设计是否能让用户在非常短时间了解网页的全部功能，或者快速找到想要的功能。
优化前vs优化后：
1.重新将导航内容合理分类，使之更简洁，分类明确。
2.点击一级分类标签，展示二级标签内容，可以快速告诉用户这个模块下有什么功能，缩短用户路径；
3.重要功能可以提供简短文字介绍，帮助用户理解功能模块；
4.还可以添加一下热门标签，帮助用户快速识别热门服务；
5.信用服务大厅模块，增加简易文字描述，使功能标签更易懂。
3.亮点——首页（重要功能模块）
重要功能模块是首页重要的组成部分。可根据板块重要性从上而下排列，因为用户浏览是从上至下的。在这里可以展示你想要告诉用户的，或者网站的主要功能模块，或者用户最常用的功能。
设计目标：
•信息等级——根据重要等级从上而下排列
•可视化——根据模块内容特性，使内容更好展示
•风格定位——符合品牌调性
走查二：
首页功能模块视觉传达效果是否与其板块的重要性保持一致。
4.体验——搜索功能
搜索是不用去导航里找目标的最快方式。也是在海量信息中快速检索到匹配信息的方式。如何帮助用户快速精确到结果是搜索的最重要目标。
设计目标：
•简单易用——容易使用
•精确结果——能够快速匹配结果
走查三：
搜索功能是否能帮助用户快速且精准找到想要的信息。
我们可以看到，搜索结果非常多。搜索结果没有具备筛选功能（例如文章类型、发布部门、发布时间等），用户不能通过模糊搜索的情况下，用户无法从大量的模糊搜索结果中更精确找到自己需要的信息或服务。
5.可视化——子级页面
根据内容级功能可视化展示，同样需要考虑信息等级。按重要程度去设计。
设计目标：
•信息等级——根据重要等级布局
•可视化——根据板块内容特性，使内容更好展示
走查四：
子级页面视觉传达效果是否与其功能的重要性保持一致
（原文链接附上https://shimo.im/docs/RDqvPTPwTtDXXt6Y）
三、案例展示
设计改版方案如下：
四、总结
依此类推，app与网站也是一样的。它的核心也是信息架构，当你不知道怎样去优化现有的产品时，把它的架构图整理一下，很多问题就会暴露出来。对于每个模块的设计目标也有了明确的方向，这样在完成设计的时候不会容易陷入个人喜好，有更多设计理论支撑。
尝试建立设计目标，建立属于自己的走查。回顾一下本文的设计走查：
•走查一：导航功能设计是否能让用户在非常短时间了解网页的全部功能，或者快速找到想要的功能。
•走查二：首页功能模块视觉传达效果是否与其模块的重要性保持一致。
•走查三：搜索功能是否能帮助用户快速且精准找到想要的信息。
•走查四：子级页面视觉传达效果是否与其功能的重要性保持一致。
