跳到正文
@LyaQanYi
返回文章列表
随笔精选

把个人网站慢慢写成自己的样子

从姓名和近况,到一点克制的动效与更方便的阅读,记录这个网站的这一轮调整。

3 分钟读完

这个网站正在慢慢成形。这一轮的调整,从一个很小的地方开始:把页面上的名字统一为浅忆QanYi,再让它更像一个可以长期留下记录的地方。

给内容一个自己的入口

首页不需要讲完所有事情。它可以先回答几个简单的问题:这是谁的网站,这里有什么,最近在做什么,以及怎样联系。项目和文章各自有完整的页面,愿意继续了解的人可以顺着读下去。

所以这次把近况放到了首页,并标上实际更新日期。它不需要是一份郑重的公告,几句话就能说明眼下正在推进的事;日期则让读者知道,这些内容是什么时候写下的。

名字也要适应屏幕

在宽屏顶部,页头显示「浅忆QanYi · @LyaQanYi」。往下读,或者把窗口缩小时,前半部分渐隐,只留下账号。这样既保留了身份,也给导航和正文让出空间。

这个变化很小,却让桌面和手机不必强行使用同一种排布。名称、所在地和社交入口也统一到了共享配置里,后续修改时不必逐页寻找。

动效留在合适的地方

首屏文字依次出现,向下滚动时区块轻轻进入视野,悬停项目卡片时封面略微放大。这些变化的作用是提示顺序和可操作性,文字本身仍然保持稳定,方便阅读。

已经读过的区块不会反复消失再出现。系统开启减少动态效果时,页面也会相应收起动画,让内容可以直接被看到。

让长文更容易读下去

文章在桌面端使用侧边目录,当前章节随阅读位置高亮。手机屏幕有限,目录放在正文之前,默认折叠,需要跳转时再展开。选中章节后,目录收起,把空间还给正文。

读完之后也留了两个简单的出口:通过邮件聊聊这篇文章,或者通过 RSS 订阅后续更新。邮件入口会带上文章标题和地址,省去重新解释上下文的步骤。

接下来,慢慢把内容填进去

页面搭起来只是开始。这次先把网站本身记成一个项目,把调整过程写成第一篇建设笔记。其他示例内容留作草稿,等有了真实的过程和材料,再逐步补充。

比起一次填满所有栏目,更希望每次更新都留下点具体的东西:做了什么,为什么这么做,还有什么没有想完。这个网站会和这些记录一起继续生长。

  • #personal
  • #website
  • #design

聊聊这篇文章

有不同的想法,或是想继续聊聊?欢迎给我写信。也可以通过 RSS 订阅后续更新。

相关阅读