这周末不用加班,人闲下来了,打开电脑,chorme浏览器键入 usj.cc ,简单看了一下博客的样式,有几处我还不是很满意。
怎么说呢,虽然一直都在用,但总感觉在一些交互细节和视觉呈现上,还有提升的空间。既然发现了问题,那就趁着有空,把这些“边边角角”打磨一下。
为了避免毫无意义的折腾,这次我并没有什么大刀阔斧的重构,只是做了一些修修补补的工作,希望能让来访的朋友(包括我自己)看着更舒服一点。
毕竟新年新气象,博客作为心灵的镜子,也需要“翻新”一下。
视觉上的“透气感”
之前的界面设计,色块感比较强,看久了难免觉得有些沉闷。
最近留意到一种叫 Glassmorphism(毛玻璃) 的设计风格,通过背景模糊和透明度,能营造出一种层次感。于是尝试着给顶栏和文章卡片加上了这种效果。
调整后的界面,背景若隐若现,整体视觉上轻盈了不少。就像是给窗户擦去了灰尘,通透感出来了,心情也跟着明亮了一些。
首页搜索框的“改造”
之前的搜索框,一直放在右下角作为工具栏存在,思来想去,还是感觉和整体的极简风格不太搭。
于是在蹲坑的时候,奇思妙想,我为何不放到随笔上,这样既能保证风格的简约,又能增加一个搜索文章的入口
就是简单CSS的调整,然后把之前的搜索文章逻辑进行复用,于是就有了现在的效果,做完,还美美的欣赏了一遍,真别说,还不错!
一些贴心的小功能
除了视觉上的调整,也加了两个实用的小功能:
昼夜切换:对于像我这样喜欢深夜阅读的人来说,刺眼的白底黑字简直是“视力杀手”。加上这个切换按钮,是对眼睛最基本的尊重,你可以点击头像进行切换,也可以在其他页面通过工具栏进行切换昼夜模式,这里听取了一个博友的建议,改了昼夜切换的逻辑,默认第一次获取访客的深色模式状态,后续再根据访客的操作进行切换。
蕉太狼温馨提示:在首页右下角加了一个小小的“蕉太狼”挂件。它会在早晨问好,深夜催睡。虽然只是简单的几行代码逻辑,但让博客多了一点“人情味”。
丝滑的图片加载:给文章里的图片加了个“懒加载”动画。以前图片是“刷”的一下出来的,现在是当你滑到它的时候,它会优雅地从下往上浮现出来,那种顺滑的感觉,就像是德芙巧克力一样(夸张了哈),反正我是盯着看了好几遍。
效果展示
旧样式
新样式
写在最后
其实做博客这么久,越来越觉得,内容始终是核心,而样式只是容器。
我们花时间去优化样式,不是无休止的折腾,而是为了让盛在里面的内容能以更优雅、更舒适的姿态呈现给读者。
这次的调整,算是一次小小的“大扫除”吧。看着焕然一新的小站,心里也觉得踏实了不少。希望你们也会喜欢这些细微的变化。




