diff options
| author | Eltrac <hi@guhub.cn> | 2025-08-31 13:51:18 +0800 |
|---|---|---|
| committer | Eltrac <hi@guhub.cn> | 2025-08-31 13:51:18 +0800 |
| commit | aa8ceb5b6d84f2e15ad50131ae561341014827a3 (patch) | |
| tree | c4148eb72aaccf923ac6c60c3bf6672f0f042038 | |
| parent | 14699526b15c779223550b4c3c46a3fea1d269b0 (diff) | |
docs: new post and update drafts
| -rw-r--r-- | content/posts/weekly/44.md | 78 | ||||
| -rw-r--r-- | content/posts/极客死亡计划的设计哲学.md | 119 |
2 files changed, 162 insertions, 35 deletions
diff --git a/content/posts/weekly/44.md b/content/posts/weekly/44.md index 68f49843..a05e96fa 100644 --- a/content/posts/weekly/44.md +++ b/content/posts/weekly/44.md @@ -29,14 +29,15 @@ endnotes: ## ↯ · 当下 - 博客做了一些改动 - 1. 内容页面中的超链接样式进行了调整,现在不再是蓝色,下划线的颜色也不那么显眼了,避免超链接起到不该有的强调作用(强调文本应该用粗体或者高亮样式)。 - 2. 书评页面的底部会显示图书馆中存在的,相同作者编写的书。 + 1. 调整了超链接的样式,现在不再是蓝色,下划线的颜色也不那么显眼了,避免超链接起到不该有的强调作用(强调文本应该用粗体或者高亮样式)。 + 2. 书评页面的底部会显示图书馆中存在的、同一个作者写的书。 3. 现在目录显示在页面右侧;以前目录只会显示在普通文章中,现在书评页面和[关于页面](/about/)也会显示目录了。 - 4. 脚注(`littlefoot.js`)的样式做了调整,现在更小巧,解决了箭头和按钮对不齐的问题;移动端的样式也得到了改善。 + 4. 脚注(`littlefoot.js`)的样式做了调整,现在更小巧;解决了箭头和按钮对不齐的问题;移动端的样式也得到了改善。 5. 根据本站的 Umami 统计,搜索是一个低频操作,所以我移除了 ⌘K 这个快捷键;现在搜索 UI 显示在和标签以及文章系列整合在一起的[搜寻](/categories/)页面中。 6. 优化了文章页面的加载速度,一些阻塞页面渲染的脚本会延迟加载。 7. 其他样式微调,包括新的交互动画。 -- +- 去医院复查癫痫,医生把我这个学计算机的当成了艺术生(大概是因为长发且穿着考究),我好像已经习惯了,毕竟我博客的读者可能也觉得比起技术,我对文学和哲学更感兴趣。 +- 趁着假期最后一两个星期,开始研究希腊神话,结果一开始就被各种乱伦和阉割创死了,*以及爱与美的女神阿芙罗狄忒怎么是乌拉诺斯的阳具啊喂!?* --- @@ -44,7 +45,14 @@ endnotes: {{< callout "这是八月的最后一期周刊,在此进行八月的文章回顾,精选了我认为不错的内容。" "🔍" >}} +- [F.U.C.K. 工作法](/posts/fuck-工作法/) <br/> + 戏谑地模仿了 PARA 工作法和 CODE 工作法,分享了我个人记笔记的一些心得体会。我的主要观点是:锻炼真正的记忆才是更重要的,思考能力也是,而不是把思考和记忆全都交给一个所谓的第二大脑,无论是笔记软件还是 AI。 +- [为什么请教 AI 和占卜算命极其相似?](/posts/为什么请教ai和占卜算命极其相似/) <br/> + 首先,向 AI 和占卜师发问的第一步都是组织语言把自己的问题描述出来,而两者回答这个问题的方式也是相似的,都是借助随机性和统计学(只不过一个基于计算,另一个基于卡牌或其它的工具)。最重要地,人们向 AI 和占卜师寻求帮助的目的在很多时候是相似的,都是为了消除不确定性,试图找到一个答案。人们很多时候并不在乎答案是否正确。 +- [物品的解放](/posts/物品的解放/) <br/> + 本文阐述了在我眼里人与物品的关系——人经常将自我的一部分投射到外物当中。这种情感链接使得人们收藏物品,也导致了不健康的囤积行为。囤积的本质是情感问题未能得到解决——人们不愿割舍的并非物品,拥有物品也是一种枷锁,厌恶损失、痴迷获取本质是一种作茧自缚,解放物品实质上也是在解放自己。 +八月的文章质量相比七月依然是下滑的状态,自裁!自裁!大概是因为直到 12 号,我的感情问题才得到了结,而在那之后我一直生活在[余震](/posts/%E4%BD%99%E9%9C%87)里,到八月的最后几天才缓过神来吧。一切都会好起来的,毕竟夏天已经过去了。 --- @@ -54,7 +62,7 @@ endnotes: {{< callout "文章链接:[How does a screen work?](https://www.makingsoftware.com/chapters/how-a-screen-works#how-an-lcd-works)" "📜" >}} -作者在写一本关于软件开发的书,但第一个章节他选择了讲解计算机中最少被提及但也最重要的硬件,甚至可以说,如果没有现代的显示技术,计算机的形态将会大不相同。作者简要地讲解了屏幕显示技术的发展历史、现在常用的两种屏幕(LCD 和 OLED)以及技术原理、显示器的未来发展等等。作者认为,对开发软件的程序员来说,理解屏幕的工作原理对软件开发也十分重要,否则在理解色彩显示的各种限制和权衡取舍时,会觉得莫名其妙。 +作者在写一本关于软件开发的书,但第一个章节他选择了讲解计算机中最少被提及但也最重要的硬件,甚至可以说,如果没有现代的显示技术,计算机的形态将会大不相同。作者简要地讲解了屏幕显示技术的发展历史、现在常用的两种屏幕(LCD 和 OLED)及其技术原理、显示器的未来发展等等。作者认为,对开发软件的程序员来说,理解屏幕的工作原理对软件开发也十分重要,否则在理解色彩显示的各种限制和权衡取舍时,会觉得莫名其妙。 这篇文章的语言较为通俗,除了少部分物理学、光学和计算机科学的专有名词可能需要查阅词典之外,任何人都可以花半小时到四十五分钟的时间读一读。 @@ -64,22 +72,76 @@ endnotes: > If you made it to this point without losing the will to live, congrats, you have the same type of mental illness that I do and you are in the exact right place. > -> 如果你读到这里还没有想死的话,恭喜你,你和我疯得一模一样,而且你算是来对地方了。 +> 如果你读到这里还没有想死的话,恭喜,你和我疯得一模一样,而且你算是来对地方了。 我在想,我的这种好奇心是不是真的只有为了一盘醋包饺子的「疯子」才会有呢?无论如何,我都认为,如果自己每天都要面对和使用某项技术,从底层理解它是有必要的,否则容易陷入对技术的过度想象(看看人们是怎么想象 AI 毁灭世界的吧!),脱离实际,把科学当成魔法一样的存在。 +### 网购服装「货不对板」的系统性成因 + +{{< callout "文章链接:[为什么网购总买不到满意的衣服?拆解「货不对版」的系统性成因 - 少数派](https://sspai.com/post/101980)" "📜" >}} + +作者作为从业者,解释了在网上买衣服「货不对板」的复杂原因——并不是商家单方面的故意偷工减料,而是在整个服装市场,人们普遍更愿意在成本更低却立竿见影的宣传投入资源,对于设计和产品质量,由于成本更高且见效更慢,通常被人们忽视了。又因为大多数人都把营销看得很重,那些轻营销、重质量的品牌则被挤压了生存空间,使得市场趋于「低质量、高包装」的状态。 + +对于消费者来说,高包装意味着高期待,而期待和实际产品之间的差距则加剧了心理落差,加重了「货不对板」的直观感受。讽刺的是,这些包装、宣传的成本最终也会以各种形式落到消费者的头上。 + +#### 我的观点 + +我一直觉得,很多产品和服务的成本根本对不起它们的价格,但销售人员却极力说服你这笔交易很值,让你忽视各种客观因素、陷入幻觉当中。很多时候,人们付钱买的不一定是服务,买到的是来说服你花这笔钱的人。从我自己的兼职经历中,我发现我所工作的教培机构的市场部的人员规模要远远大于教学部的人员规模,这家工作花在招生和转化上的成本要远远大于实际教学的成本,然而我却经常听到市场部的员工说服学生这笔钱花了有多么值、对自己多么有帮助。 + +因此,我抗拒推销,推销表面上是让顾客发现好的产品,但实际上是求着顾客给推销员佣金(包括推销员手上的传单、推销员所受到的话术培训,最终都是顾客付钱买的)——究竟在什么地方,我才不需要为广告付钱、为那些引诱我消费的宣传付钱,真正地为好的商品买单?这似乎没办法做到。更可悲的是,如今有成千上万的人在想购买商品时找所谓的「评测视频」,到直播间里自愿被带货——不知何时,给自己找广告看居然成了常态。 + +我认为,比起相信推销员、相信「评测」、相信直播间,不如去找身边真实的人。如果找不到真正体验过商品或服务的人,那自己就去做那个人——去尝试不同的品牌并做出自己的判断,并持续地光顾自己认为好的店铺。 + ## ⁂ · 星群 ### FocusFlight +中文名为「专注飞机」,是 iOS、iPadOS 和 macOS 上的专注时钟应用。在包括笔记软件和番茄钟软件泛滥成灾的今天,我认为 FocusFlight 开辟了一条很新的路。 + +FocusFlight 把每一次专注比作一次「模拟飞行」,用户可以通过选择航班来到达地球上的不同地方,软件会根据距离计算飞行时长,而飞行时长就是用户在这次模拟飞行中的专注时长。我认为,比起新奇,这种设计有很多好处: + +1. **仪式感**。每次选择航班都会有选择座位(选择专注场景)、打印登机牌、检票的动画,在这些「无用步骤」完成之后才会出现「起飞」按钮。这看起来本末倒置,却能够作为一套工作前的「启动仪式」。就我而言,我在阅读、写作、写代码之前往往会有一些繁琐的准备工作,比如把手机放到另一个地方、拿出笔记本、调整座椅等等。在使用 FocusFlight 时,我可以先决定接下来要做什么(选择航班、检票……),然后在正式起飞之前磨蹭一下,完成准备工作,然后再正式起飞。这有点像登机之后找位置、放好行李的步骤,为接下来长时间的专注提供了一个缓冲时间,显得不那么急迫。 +2. **沉浸感**。起飞之后,用户能在地图上看到飞机从 A 点到 B 点的飞行路径,也可以切换到「舷窗视角」,透过飞机的窗户观察移动的云层。作为专注应用来说,白噪音当然也少不了;比起雨声和海浪声,其实我更喜欢 FocusFlight 默认的飞机飞行时产生的噪音,听起来很舒服。这种沉浸感给我一种我真的在飞机上,现在除了干好要做的事情什么也做不了的感觉。 +3. **鼓励更多的专注时间**。用户通过模拟飞行抵达一个地点之后,就会留在那里,可以通过下一次的专注飞行去往另一个地方。我选择的起始地点是重庆,在那之后就一直在往西北方向飞行,期待有一天能飞到北欧。如果心中有一个目的地或期望的飞行轨迹,就会更愿意专注下来。 + +这种设计也有缺陷,作为一个专注应用,用户不能自行选择专注时间,因为从一个机场到另一个机场的距离和飞行时间都是固定的,而且,如果飞到一些人烟稀少的地方,周围可供选择的机场就很少,对专注时间的选择就更加局限(虽然大部分情况下还是能找到 40 分钟左右的「航班」)。不知道未来开发者会不会解决这个问题。 + +{{< gallery >}} + + + + + +{{</ gallery >}} + +访问:[App Store 中的 "FocusFlight"](https://apps.apple.com/us/app/focusflight-deepfocus-timer/id6648771147) + ### DockDoor +MacOS 上的工具软件,开源且免费,提升窗口切换的体验。将鼠标移动到 Dock 栏上的某个已启动应用的图标上时,就会显示这个应用的所有窗口。对于日历应用和 Apple Music,还会相应地显示今天的日程和正在播放的音乐。 + +按下 ⌥+Tab 键,就能像 ⌘+Tab 一样切换窗口,但 DockDoor 使得你能在切换时看到所有的窗口,而不是只能看到图标。不过我还是更喜欢在触控板上三指上划打开调度中心。 + +{{< gallery >}} + + + +{{</ gallery >}} + +访问:[DockDoor](https://dockdoor.net) + ## ※ · 妙语 -{{< quotecard >}}{{</ quotecard >}} +{{< quotecard >}}ὁ δὲ ἀνεξέταστος βίος οὐ βιωτὸς ἀνθρώπῳ{{</ quotecard >}} +这句古希腊文出自苏格拉底,意思是:**未经审视的人生是不值得过的。** +审视的意思是用理性思考做出自己的判断,而不是听从社会主流意识形态。在主流价值观的驱动下,人们很容易陷入和其他人相同的人生路径,或者用别人的标准衡量自己是否幸福。不是所有人都想要生儿育女,但很显然大部分人都这么做的,这是因为他们的意识形态认为这是「应该的」,他们主动地把关于人生的思考让渡给了别人,没有思考「应该的」究竟是不是「适合自己的」。苏格拉底认为,就算接受主流价值观,那也应该是自己理性思考之后做出的判断。 + +苏格拉底认为缺少自我反思和独立思考的生活是无意义的[^1]。苏格拉底的另一句名言是:我知道我什么都不知道。在具体的自我审视当中,审视自己的无知也是有必要的。人们更容易关注自己知道的东西,但若是不清楚自己的知识盲区、视野盲区和认知盲区在哪里,就没有拓展的空间——认识自己的无知是通往智慧的第一步。 ## ∬ · 切片 --
\ No newline at end of file +由于各种不成文的想法、吐槽和日常分享都放在了 [Telegram 频道](https://t.me/geedeapro)里,所以「切片」这个栏目在之后就不会出现在周刊里了。 + +[^1]: 参见:[The unexamined life is not worth living - Wikipedia](https://en.wikipedia.org/wiki/The_unexamined_life_is_not_worth_living#:~:text=Socrates%20believed%20that%20a%20life%20devoid%20of%20introspection%2C%20self%2Dreflection%2C%20and%20critical%20thinking%20is%20essentially%20meaningless%20and%20lacks%20value.) diff --git a/content/posts/极客死亡计划的设计哲学.md b/content/posts/极客死亡计划的设计哲学.md index 2d1a7eaf..03566f68 100644 --- a/content/posts/极客死亡计划的设计哲学.md +++ b/content/posts/极客死亡计划的设计哲学.md @@ -1,47 +1,49 @@ --- title: 「极客死亡计划」的设计哲学 -subtitle: 极客死亡计划书 III categories: 极客死亡计划书 tags: - Web - 设计 -date: 2025-08-22T12:04:00 -draft: true +date: 2025-08-31T13:51:00 +draft: false toc: true --- -这个博客有过很多名字,相应地也有过很多外观设计,能被我记起来的有「考拉咖啡馆」「Isla」「Taco」等等。它们在我的脑中只有过一些模糊的印象,比如「考拉咖啡馆」有点像一块洁白的瓷砖,「Isla」……,「Taco」是纸张、照片和贴纸拼凑出来的内容。 +这个博客有过很多名字,相应地也有过很多外观设计,能被我记起来的有「考拉咖啡馆」「Isla」「Taco」等等。 过去的我常常推翻整个网站的理念、设计、代码然后重头来过,一些文章也在这个过程中丢失了。我现在把那些行为当作是一个小孩子寻找自我的方式,一遍又一遍请求别人「重新认识我」。如今我对自己建立起来的形象终于有些满意了,我便想要回顾、总结一下那究竟是什么样子,至少从最浅显的方面开始。<!--more--> --- -{{< callout "本人并非设计师,仅仅分享一些业余见解<br/>本文内容包括网站的配色、排版、内容设计和交互设计等。" "💡" >}} - - - ---- - -## 总则 +{{< callout "本人并非设计师,仅仅分享一些业余见解。" "💡" >}} 最近发现,对于个人来说,比起建立阐述完备的精确到每个细节的系统和文档,最重要的可能是明确且严格执行的「原则」。比如,我记笔记的原则是「用完即删」「提炼,永远不复制粘贴」和「保证清晰可理解」,除此之外我就不需要再耗费时间精力建立复杂的系统了。 以下是我在折腾这个网站时有意或无意遵守的一些设计原则,现在整理成文字: -### 1. 文字优先于一切 +## 1. 文字优先于一切 对于注重用文字表达思想的博客网站来说,文字当然是最重要的。曾经加入过一个名为 [Essay](https://www.essay.ink) 的文字社区,主理人对于图片非常谨慎,因为图片一旦出现,就必然比文字更吸引注意力。一开始 Essay 的用户无法在发表的内容中添加图片,开放图片上传之后,图片默认是隐藏的,需要鼠标点击之后才能看到展开的图片——我很喜欢这种「文字优先」的做法。 这一原则的具体实践有: 1. 页面中不允许出现比文字更吸引注意力的元素,除了网站 Logo 等必要的元素。 -2. 装饰和个性化的设计,先从文字下手。 - - 标题上的文字扭曲效果(实际上是模仿老旧复印机复印后产生的扭曲)[^1] -3. 如果一段文字没必要出现,那就不要出现。 - -### 2. 灰度优先于颜色 - -我之前很喜欢折腾色彩搭配,但任何配色方案都有一个问题(至少对我来说是一个问题)——容易看腻。腻了之后就想换掉,然后再折腾一番。为了减少审美疲劳,网站使用了黑白的配色方案,如果要元素的主次,那么就通过调整灰度来实现(也可以用字体粗细来辅助)。 +2. 装饰和个性化的设计,先从文字下手,让文字更具吸引力。 + - 例如标题上的文字扭曲效果(实际上是模仿老旧复印机复印后产生的扭曲)[^1]。 + - 可以通过修改颜色、字重和缩进实现的效果,尽量不要添加边框等色块;如果这样的装饰过多,会让页面看起来杂乱。 +3. 注重内容页面的阅读体验。 + - 减少页面宽度有助于减少换行时视线移动的距离,能缓解阅读时产生的疲劳。 + - 选择适当的行距,不让文字太紧凑。 + - 选择合适的字体大小,避免疲劳。 +4. 注重文字的主次关系。<br/> + 如果正文、强调的文本、脚注、尾注和标签等文本的颜色、大小和缩紧都很相似,读者难以把握主次,就会在阅读时感到不知所措。不过,比主次更重要的是删掉一切不必要的元素。 + - 元信息(发布时间、标签、分类等)和尾注等文字应当使用更小的字体和灰度更低的颜色,以突出正文。 + - 在正文中,需要额外强调的文本应当与普通的正文有着明显的差异,比如字重的差异应该足够大;由于中文字体的粗体与普通字体的自重差距往往没有那么大,不足以起到强调突出左右,可以考虑为粗体字加上显眼的颜色。 + - 副标题的字体大小应该是适宜的,太大会让整个页面的比例失调;对于层级较低的标题,字体大小与正文一致是可以接受的,通过字重和行距突出标题就足够了。 + +## 2. 灰度优先于颜色 + +我之前很喜欢折腾色彩搭配,但任何配色方案都有一个问题(至少对我来说是一个问题)——容易看腻。腻了之后就想换掉,然后再费时间折腾一番。为了减少审美疲劳,网站使用了黑白的配色方案,如果要体现元素的主次,那么就通过调整灰度来实现(也可以用字体粗细来辅助)。 比如: @@ -50,7 +52,7 @@ toc: true 3. 图标、标签等交互元素,默认显示灰色,鼠标悬浮其上或被点击时加深灰度 4. [统计页面](/stats/) 的图表通过灰度的不同表现数量差异 -### 3. 维持视觉平衡 +## 3. 维持视觉平衡 由于元素默认靠左排列,如果元素本身的宽度比较小,右侧就会大面积留白。如果右边还有空间,而下方还有其他宽度较窄的元素需要显示,那就排在一行里。如果没有,那就尝试缩短元素的宽度以便能在一行中排列。 @@ -58,16 +60,79 @@ toc: true  -### 4. 永远不随大流 +## 4. 剔除一切不该出现的东西 -### 5. 在自己与用户之间找到平衡 +许多自称「简洁」「极简」的博客主题,其实非常繁杂,他们只是选择了灰白的配色,没有过度的装饰而已。当然,如今「简洁」这个词早就被滥用了,失去了任何意义,每个人对「简洁」都有自己的认识。我眼中的「简洁」包括两点: ---- +1. 简。一个元素出现在页面中一定是必要的。 +2. 洁。没有让人眼花缭乱的装饰。 + +这里主要谈「简」。 + +许多博客主题会在侧边栏加上「相关文章」「最近评论」等栏目,不是因为这些内容多有用,而是因为他们不知道侧边栏还能放些什么东西,尽管大部分博客的内容结构还没有复杂到需要一个侧边栏才能显示足够的信息;一些博客还会在页脚塞满图标和文字信息(我尝试理解那些信息的时间已经足够我读完一篇文章了)。我不是说侧边栏和页脚应该被剔除,而是说,为了把一栏空白填满而往页面中添加不必要的元素是不好的。如今网络上的信息已经很多了,为什么要把自己的网页也做得令人目不暇接呢? + +此外,一些低频使用的元素(可以通过 Umami 等 Web 分析工具发现)也可以删除或者合并到其他页面里。比如,在我发现「打开搜索面板」是一个低频操作之后,我就移除了 ⌘K 这个搜索快捷键(减少需要加载的 JavaScript 数量),把搜索 UI 和标签、文章系列的列表移动到了一个页面,毕竟它们都是[搜寻](/categories)文章时会用到的工具。 + +## 5. 想办法让读者发现别的内容 + +Web 分析工具中有一个指标叫做跳出率(bounce rate),指的是访客在访问一个页面之后就离开网站的比率,能够反应网站留存用户的能力。对于个人博客来说,跳出率也能反应博客的内容是否能吸引读者继续阅读。 + +当然,并不是所有的读者都会因为读完了一篇文章就继续读其他文章,这时就可以通过在页面中链接其他的页面引导读者。除了在写文章时引用旧文章,还有一些别的做法。 + +1. 在文章底部添加「相关文章」栏目。就我个人的感受来说,列出两三篇文章的标题并不会那么吸引读者。如果只是列出一篇文章,读者的决策就从「选哪个」变成了「要不要读」;如果附上摘要和估算的阅读时间,读者就有刚好的信息判断自己感不感兴趣、有没有时间继续读。 + 》") +2. 文章的第一段话并不总是能够吸引人,写得最好的句子往往在文章中间。我创建了[标记页面](/highlights/),这里列出了所有文章中的高亮标记,也就是我认为在文章中间的、写得最好的句子。我在考虑在「相关文章」和首页也显示本文的高亮标记。 +3. 博客有一个[精选](/featured)页面,列出了我认为最能代表我和我的观点的文章。如果读者已经决定留下来读一些别的文章,比起时间线上的新文章,这些内容可能更容易留住他们。 + +## 6. 对于第三方库的使用 + +为了追求舒适的开发体验,使用第三方软件库是很好的选择,避免花费过多的精力和时间重复造轮子。不过,第三方库为了考虑到不同的应用场景,会提供多种功能和设置项,其中有很多代码实际上不会被使用,这不仅浪费了网络资源,还可能导致网页加载速度变慢。所以,考虑到用户体验,尽可能使用自己编写的脚本会更好。在评估某个需求是要自己编写还是使用第三方库时,我一般会考虑这几点: + +1. 实现难度以及预估的开发时间 +2. 现有库的质量 +3. 需求是否可以用其他方式实现 -## 想办法让读者更容易发现别的内容 +有些需求不需要用到 JavaScript,比如[统计图表完全可以用 CSS 实现](/posts/zero-js-chart/)。如果使用 Wordpress 和 Typecho 这样的博客程序,或者是静态网站生成器,一些需求有自带的解决方案,不需要全部在前端用 JavaScript 实现。例如,生成目录的 [tocbot.js](https://tscanlin.github.io/tocbot/) 在压缩后仍然有 12 KB 的大小,而这完全可以用 Hugo 自带的 `{{ .TableOfContents }}` 替代;如果希望在滚动到对应章节时高亮对应的目录项,也只需要额外编写很少的代码。 + +如果某个需求真的无法用其他方式实现(比如图片灯箱,自己编写有难度),我往会考虑以下几点: + +1. 压缩后的体积要尽可能小 +2. 需要 jQuery 支持的库绝对不考虑 +3. 仍然有人维护代码仓库(最近的几个月内有新的提交) +4. 美观 + +## 7. 我不在乎老版本的浏览器 + +尽管不兼容 IE 浏览器已经成为行业共识,许多网站也会提醒用户使用现代浏览器,但一些较新的规范在现代浏览器的旧版本中并不受支持。 + +` 伪类兼容性的描述") + + + +不是所有用户都有更新浏览器的习惯,这就导致一些 CSS 或 JavaScript 的新特性不能在所有人的设备上正常工作。如果我想实验一些新特性(这里指那些还没有得到广泛支持,但已经在大部分浏览器的正式版本中实装的特性),一些使用还没有兼容这个特性的浏览器的用户可能得不到很好的体验。我开发的并不是什么需要交付给大众使用的产品,我不希望考虑太多兼容性问题,因此只要我认为一个特性已经得到大部分主流浏览器支持,我就会使用它。 + +如果你使用的是 Chrome(包括 Arc 和 Edge 等 Chromium 内核的浏览器)或者 Safari 的最新版本,访问我的博客应该不会遇到太多问题。 + +## 8. 适当地表达个性 + +不知道你有没有注意过,博客其实有颜色很淡的背景,是有骷髅头图案的墙纸。网站的图标选择也十分特立独行,大部分都来自这个 [RPG 游戏图标库](https://www.svgrepo.com/collection/rpg-game-filled-icons/)。一些操作的描述也带有某种中二气息。 + + + + + +在标签和文章系列页面中,读者可以选择隐藏带有这个标签的周刊(因为周刊的内容比较杂),隐藏周刊按钮的图标是一只乌鸦(**Crow**)。博客的周刊名字叫做「稻草人周刊」,稻草人的英文是 Scare**crow**,因为稻草人是用来吓走啄食作物的鸟类的。这里玩了一个很冷的文字游戏,让乌鸦反过来吓走稻草人。 + + + +接下来是网站的 404 页面,至于为什么这么设计我就不阐释了…… + + + +--- -## 对于第三方库的使用 +博客的内容分区和导航设计也很值得聊一聊,比如首页的三个导航(最新、精选、搜寻)实际上是包括所有分区的内容视图,而顶部的导航条则是在不同的内容分区(议叙、卡片、书评和虚构写作)之间进行切换,其他的页面都在页脚(除了更重要的关于页面),不过这就不是「设计原则」的一部分了。 -## 我不在乎老版本的浏览器 +Happy coding~ -[^1]: 这一效果来自 [endtimes.dev](https://endtimes.dev) +[^1]: 这是通过 CSS 的 `filter` 属性实现的,代码来自 [endtimes.dev](https://endtimes.dev) |
