找每次换工作的间隙，我总要折腾一遍博客。除了有闲功夫，也是希望提升自己的作品质量。这么一个简单的纯信息展示类网站，我已经改过数不清次版了。我还记得第一版个人博客用了一张巨大花哨的海星图片作为背景，文字淡到看不清，颜色用了不下5种。直到上一版，本博客才第一次能称得上一件合格的产品，在那之前，只是一味在设计花哨的首页而已

不管怎么说，这算是我最早的一件互联网产品。我对于视觉设计与用户体验的理解，有相当一部分来源于这个产品的反复折腾，同时也逐渐形成自己的设计风格与理念。我在其中所扮演的角色，涵盖了产品经理、交互、视觉、开发、运营，更能让我从不同的角度考虑产品，虽然做不到那么专业

上一版的视觉语言可以用这么几条来概括：

1. 扁平设计，纯白背景

2. 无边框，大空隙

3. 以草绿与橙色为主色，提亮关键信息

4. 圆作为视觉符号广泛使用

此次改版仍然延续了之前的部分视觉语言，重点在于优化了关键信息的展现方式，并且重新设计了几张特殊页面。主色略有变化，用砖红代替了纯度较高的橙色，可以令色调更加轻松缓和。圆的运用也不到位，使用过多略感凌乱，改为圆角方形，立马就有点APP化的感觉了

主导航的动画效果是个亮点，稍稍改变形状，继续保留。其实这里做了一个很细微的视觉差滚动，滚动条往下滚时，LOGO会加速向上移动。导航按钮后方的轴线，也会略微下移，变成悬浮导航的背景阴影

文章标题信息我不爽很久了，标题和时间在一头，评论数和分类在另一头，谁会这么来回两头看啊？（说得好像这个不是出自我手似的……）当时的考虑是，整个页面的宽度显示文字段落，看着太累，我把文字区域宽度限制在650像素，那空出来的部分放点什么呢？于是就有了这两个突兀的圆

的确，当美观与实用性冲突的时候，一味追求视觉效果，很容易做出愚蠢的产品。实际上，冲突，不代表两者不可兼得。改换思路，大胆抛弃曾经引以为豪的小把戏，从实用性出发，总能找到同样美观的解决方法

header和footer是这次首页改版的重头戏，header的搜索与二维码使用频率很低，应该扔到底部去，至于登陆注册入口，只对我本人有用，果断隐藏。这样header就干干净净只剩个LOGO了，很好

footer内容多起来了，可以考虑用较重的色调与内容区域区分开。个人的外站链接、友链、搜索和版权信息都加大。显示器分辨率越来越高，网页设计也不该再拘泥于12、14像素字的尺寸。其实这个思想早已被大量国外网站实践过，放在这里的确适用

真正改变大的，不是首页，而是两个与求职密切相关的特殊页面：作品和关于我

旧版作品页已经看不到了，简单说是图片墙形式。类似于songtaste首页，只是图片较大。点击小图弹出浮层显示大图，在大图界面中可以直接前后翻页

实际浏览中，没人会打开关闭再打开关闭，使用者打开了大图界面，就会直接通过翻页浏览所有作品。而且设计作品涉及不同领域，每个领域的作品也有时间和类别区分，我设定的图片顺序是有它意义在的。既然如此，整这个图片墙干什么呢？这个作品页面其实更应该看作一部幻灯片，那么给个播放按钮就行啦，详细的内容，都靠图片说话

关于我之前非常简陋，有一小段基本信息，接下来就是朋友熟人的评价，都是纯文字列表展示，大量文字可没谁有耐心看下去。数据类尽量都图形化，其他内容也需要合理组织起来。整理过后，各种内容就一目了然了

博客类产品，最关键的就是图片与文字信息展示，展现方式是否合理，直接决定了读者的阅读耐心。与此相比，装饰性的设计，真没那么重要