博客的核心定位是“内容传递”与“用户信任”，但部分技术反向会破坏体验、流失读者。在这些负面技术特征下，用户可能因反感直接关闭页面，甚至不再回访。
- 一位不知名群友
请问你的博客是那个给文本加上渐变配色代码块，用衬线字体article巨大阴影半透明背景加莫名其妙的地方抄来的canvas动效，打开会自动播放网易云音乐且加载一个Live2D小人挡住播放器控件，还有自定义光标加上点击特效且复制文本的时候会自作主张加上版权通告，切出网页以后title还会变成莫名其妙的文本内容的吗
部分技术的滥用确实造成了糟糕的体验，下面谈谈一些不受欢迎的技术特征。
用户体验
切换标签页时更改标题
一些博客网站在用户离开时，会将网页标题改为挽留文本，这当然十分有趣。但当打开一组标签页时，后果便变得灾难起来，用户无法识别各标签页的内容。
| 🍊 ♪(^∇^*)欢迎肥来！ | ❄ (｡•́︿•̀｡) 别走呀！还没看完呢～ | ⭐ (๑•́ω•̀๑) 等等！别切走呀～ |
|---|---|---|
| 📌 (≧∇≦)ﾉ 不要离开！再看看嘛～ | 🎨 (´･ω･`) 别走啦！多留会儿呀～ | 📖 (｡･ω･｡)ﾉ 等等！别切换呀～ |
| 🍃 (๑˃̵ᴗ˂̵)و 不要走！再停留会儿～ | 💫 (´• ω •`)ﾉ 别走呀！再看看～ | 📝 (≧∇≦)ﾉ 等等！别离开嘛～ |
| 🎈 (｡･ω･｡)ﾉ 不要切走！再留会儿～ | 🍀 (っ´ω`c) 别走呀！再看看嘛～ | ✨ (｡•́︿•̀｡) 等等！别离开呀～ |
| 📮 (≧∇≦)ﾉ 不要走！多留会儿呀～ | 🌸 (´･ω･`) 别走啦！再看看嘛～ | 📌 (๑˃̵ᴗ˂̵)و 等等！别切走呀～ |
🐔
这不像是网上冲浪，倒像是在一大片尖叫鸡中行走。
打开网页时自动播放声音
页面自动播放声音容易产生一些尴尬场面，所以浏览器特意限制了自动播放能力，等到用户真正和页面开始交互时……有人正在利用规则！
无预警的音乐、解说声，在办公、公共场合会让用户陷入尴尬，第一反应是“关闭页面”；常见的就是博客欢迎播报、朗读更新日志、自动播放背景音乐等。这真的是一个好功能吗？
正文使用难以阅读的艺术字体、对比度过低的配色
字都看不清，不读了！
将鼠标光标改为难以识别的指针样式
让我想起了用别人电脑时找不到鼠标指针的尴尬经历。
\0/\0/\0/
光标一定要能看清✍️✍️️✍️
更改右键菜单
右键菜单没什么用，但开发者觉得右键菜单没什么用不太可能，于是在博客中加入了右键菜单。它能——阻止召唤出真正的右键菜单。
如果你的右键菜单有特色功能，用户只有在点击右键时才会知道，但用户点击右键时，希望看到的是有所需功能的右键菜单……
\0/\0/\0/
右键一定要能召唤右键菜单✍️✍️️✍️
阻止交互的弹窗、加载动画
打开博客，先被一个“更新日志”弹窗阻塞，关闭后才能显示网站主页，想要看文章，结果被全屏 Google Ads 贴脸输出……
别笑，你试你也过不了首屏加载动画：全屏白色里，一个孤零零的圆形头像在画面中央闪烁，页面就这样一直卡在加载了。
技术误用
质量不佳的 JS CDN
jsDelivr、UNPKG 并非最优解。国内大量的 JS CDN 都是对 cdnjs 的镜像，它不像 jsDelivr、UNPKG 那样全部收录，而是只收录热门的库，因此国内 JS CDN 大都镜像 cdnjs。
明确方向后，就可以先在 cdnjs 找到库，然后直接替换为国内的 JS CDN。
至于其他服务？公共 CDN 没有义务提供，保障稳定性、加载速度、安全性才是公共 CDN 应该做的。
Pjax + PACE
博客只有背景没有字？博客一直卡在加载动画？这是因为 Pjax 加载页面时，会在后台请求资源，而 PACE 加载动画会在请求完成后显示，若有任一资源加载失败，PACE 加载动画就会一直阻塞。再搭配上质量不佳的 CDN 或者被滥用的服务（下文会讲），那简直是灾难级的体验。
- 纸鹿
没有金刚钻，别揽瓷器活。人只能掌握认知以内的技术。
禁用选中、复制
应该还没有技术博客不让用户选中文本吧……CSDN 除外。
禁用开发者工具
从来没有一种方法能真正的禁用开发者工具，反而只会恶心到用户和开发者。
还有可爱的开发者，用控制台打印的语句成功骗到了用户。
[32;7m NCC2-036 [0m 调用前置摄像头拍照成功，识别为【小笨蛋】. [34;7m WELCOME [0m 你好，小笨蛋. [34;7m W23-12 [0m 你已打开控制台. [33;7m S013-782 [0m 你现在正处于监控中.
一些热门的检测开发者工具的库十分容易误报，当用户打开垂直标签页，或是下载列表、历史记录出现在侧栏时，这些库就会误判。
一些页面在检测到开发者工具时，会用各种声光警告用户并阻止用户浏览网页，把用户当作窃取页面代码的黑客，却防不住真正的 DevTools 远程调试。
当我打开 DevTools 时，大概率是想要看 bug 到底有多荒唐。
服务滥用
PWA
渐进式 Web 应用程序，支持这个特性的网页可以在桌面创建快捷方式，是好特性。但在 PWA 的早期版本中，一旦页面支持 PWA，就会在访问网站时弹窗“是否安装此应用”，十分恼人。目前浏览器已经不会自动弹窗了。
滥用 Service Worker + CacheStorage
这是最容易被低估的问题：Service Worker + CacheStorage 能轻松构建离线程序，但博客显然不需要这个功能。一些对此技术一知半解的开发者，开始秀肌肉，用 Service Worker 缓存所有静态资源，美其名曰“全站离线化”。
😭
Bro，我访问这些网站被占用的硬盘空间谁来补啊！
- CacheStorage 缓存的资源无法通过“清除缓存”功能清除。
- 部分网站如代码随想录，初次访问就会在硬盘留下 400MB 坚固缓存。
- Service Worker 不当使用，容易导致站点资源不一致而出现问题。
Windows 用户可以按下 ，输入下方路径，看看你的 CacheStorage 多大。
Edge%LOCALAPPDATA%\Microsoft\Edge\User Data\Default\Service WorkerChrome%LOCALAPPDATA%\Google\Chrome SxS\User Data\Default\Service Worker将公共服务滥用为图床
许多教程在教小白如何把 GitHub、npm 等公共服务用作图床，这是对公共服务的滥用。开源开发者在享受基础设施便利的同时，不应滥用公共服务，尤其是将代码托管、CI/CD 用在不相关的服务上。
尤其是一些人，打出了一套 npm 托管 + 公共 CDN 下载的二进制资源分发连环招，简直是在败坏环境。
npm 竞速
基于上面的方案，还有开发者利用 Service Worker + npm + 公共 CDN，实现了全站托管在 npm，并在多个公共 CDN 上并发对相同资源竞速，并把资源缓存在用户设备中。
真正做到托管平台、CDN、用户均不受益。
影响自身
频繁更换域名
不知道怎么评价，因为已经访问不到了。
无订阅源
个人认为现一代博客是早期互联网博客精神的延续，Atom 或 RSS 订阅源就是一种技术浪漫。
CSR 站点
我偶尔会刷到一些哔哩哔哩的视频，讲《我用Vue写了一个博客》，但这种项目很难放在生产环境使用，原因有二：
- Vue是JavaScript框架，所有Vue中的元素都需要浏览器执行代码后才会生成，因此HTML是一个空壳
- Vue是单页应用，搭配Vue Router的默认实现是哈希模式（
#/path），本质上所有页面都在同一个路径下
这两点都不利于 SEO，因此需要借助 SSR/SSG 等技术，将基于 JavaScript 框架的内容渲染为 HTML 再交付，才容易被搜索引擎索引。
不关注 SEO
Meta 元数据名称、Open Graph、Twitter Card、JSON-LD……先别急着配置这些，你的 <link rel="canonical"> 配置对了吗？
它的 href 应该指向当前页面的权威地址，例如有多个域名指向同一个博客，那么它就应该指向主域名的对应页面；如果文章页面的此标签指向了主页，那么搜索引擎就会认为这是一个重复页面，从而排除收录。
🤔🤔🤔
说了这么多，博客的文章在哪里？
评论区
评论加载中...