别再用浏览器收藏了这个 skills 轻松保存网页到本地 Markdown痛点这东西总是要攒到一定程度才会逼着人换方案。我浏览器收藏夹里躺了上千条网页链接真正常翻的不超过二十个剩下的绝大多数都是当初觉得“有用、以后要看”的——结果这个“以后”永远没来。真正让我下定决心换掉收藏夹做法的是我玩了一段时间 AI 助手的自定义能力模块也就是标题里说的 skills。用这个东西我可以把任意一篇网页正文直接转成一份干净、可编辑、内容完整的 Markdown 文件按自己的分类体系存到本地硬盘。链路打通之后我才发现原来“收藏网页”这件事完全可以做得比想象中更扎实——离线可用全文可搜还能让 AI 顺手帮我做摘要。这篇文章就把整套方案的思路、配置细节、实操步骤、踩坑记录都掰开揉碎讲清楚适合被收藏夹绑架的人也适合正在研究怎么把 skills 真正用起来的人。1. 内容整体设计与思路拆解1.1 为什么偏偏是 Markdown不是 PDF 也不是收藏夹浏览器收藏夹的本质是一个 URL 列表它只存地址不存内容。你收藏的时候依赖的是“对方网站还活着、链接没失效、内容没被删”这个前提。一旦网站改版、页面下线、文章被误删这条收藏就变成一具空壳。更关键的是收藏夹是索引式而非内容式管理它对你“以后想找什么”没有任何帮助——你只能靠标题和模糊记忆去翻翻不到就永远找不到了。PDF 能解决内容丢失的问题但它太重。一份网页正文转成 PDF 往往有几兆到几十兆打开慢检索差想改一两个字都要重新导出。它更像一个“截图”很难继续参与你的内容流转。而 Markdown 是纯文本格式体积通常只有几 KB 到几十 KB随处可见的文本编辑器都能打开又能跟 Git、笔记软件、知识库系统无缝打通。做全文检索很方便想二次加工也不用经过复杂的解压和转换。一句话Markdown 是最接近网页原文、同时又能长期属于你自己的格式。这里要注意把网页转成 Markdown 和用浏览器“另存为”完全是两件事。“另存为”可能存下一个饱含广告、侧边栏、相关阅读的页面而 Markdown 转换追求的是去芜存菁——只留正文主线删掉一切噪音。这个“删噪音”的环节恰恰是 AI 助手比手动复制粘贴强的地方也是 skills 最大的价值所在。1.2 用 skills 把“保存网页”变成一套流程如果你想用传统方式把网页存成 Markdown你得做这么几件事打开网页、选中正文、复制、粘贴到编辑器、清理格式、改文件名、放进正确的文件夹。偶尔存一篇还好一周存十几篇的话这套重复劳动很容易让人放弃。skills 的思路是把这些步骤写进一个可复用的能力模块。你跟 AI 助手说一句“保存这篇”它自己就知道要去抓取网页、抽取正文、转成 Markdown、命名、归档甚至还帮你提取标题和标签。核心逻辑不是“替代你做一步”而是“替代你做整条链路并且稳定执行”。我最初接触 skills 时花了不少时间琢磨它到底跟普通指令提示词有什么区别。后来我理解为提示词是对话时临时给的指令质量取决于你这次表达得怎么样而 skills 是预先定义好的规则AI 在合适的时机自动调用质量是可复制的。这就像你自己炒菜每次水平随心情波动但餐厅后厨有标准作业流程——skills 干的就是标准化这件事。1.3 这套方案解决了哪几层痛点第一层是链接失效问题。收藏的网页没了本地文件还在内容永远不会凭空消失。第二层是检索问题。本地 Markdown 文件可以被全文搜索工具索引也可以让 AI 按语义帮你找比在收藏夹里一条条翻靠谱得多。第三层是整理问题。直接保存网页会产生一堆乱七八糟的命名文件用 skills 归档的话可以让 AI 读取内容后自动判断这篇属于“技术笔记”“产品文档”“行业资讯”还是“随手灵感”然后放进对应的目录甚至生成一份索引清单。我自己的使用经验是这三层痛点解决之后收藏这个动作才开始真正为我的知识管理服务而不是变成负担。2. 核心细节解析与实操要点2.1 先搞清楚 skills 到底是什么在不同 AI 助手平台上skills 的定义大同小异它是一种可复用的能力封装通常由一个描述性的配置文件和若干执行指令组成。当用户的输入被 AI 判断为匹配该技能的使用场景时AI 就会按预先定义好的步骤去处理而不是从零开始在对话里问东问西。放到“保存网页到本地 Markdown”这个场景里skill 要做的事情包括识别用户提供的 URL必要时自动补齐协议头访问目标网页并获取正文内容识别并剥离导航栏、页脚、广告模块、评论区、侧边栏等无关元素将清洗后的 HTML 转换为规范的 Markdown决定图片资源的处理方式建议下载到本地防止源站删图生成合理的文件名并归档到预设目录保存后对文件做质量检查必要时返回摘要给用户确认一个设计良好的技能至少要在配置里说清楚这三件事触发时机、处理步骤、输出规范。触发时机决定了 AI 何时使用这个技能处理步骤决定了操作顺序输出规范决定了最终文件的质量。2.2 skill 配置的核心组成模块下面是我在一套通用配置中反复使用的结构你可以理解为“配置文件骨架”name: web2md description: 将用户提供的网页链接保存为本地 Markdown 文件 trigger: - 用户提到保存网页 / 收藏链接 / 转成 Markdown - 用户直接粘贴一个 http 链接并带有保存意图 steps: - fetch_url: 获取页面内容默认使用移动端请求头 - extract_main_content: 优先提取 article 主节点回退到 body 内密度最高文本区 - cleanup_html: 移除 nav/footer/script/style/advertisement 等节点 - convert_to_markdown: HTML - Markdown 转换 - process_images: 下载图片到 assets 目录并改写引用路径 - generate_filename: 规则为 [域名]_[发布年份]_[标题slug].md - save_to_local: 保存至 ~/web2md/[分类]/ 目录 quality_check: - 转换后文本字数小于原正文 30% 则触发告警 - 文件名冲突时追加时间戳这个配置看起来不算复杂但每一项背后都有实际经验支撑。比如为什么请求头要默认移动端因为很多网站的移动端页面比桌面端干净导航和广告少很多转换出来的 Markdown 噪音更小。再比如图片处理我强烈建议下载到本地——不然你当时保存的内容三个月后可能变成一堆裂图。2.3 设计保存技能时最重要的三个取舍第一个取舍抓正文还是抓全页我的回答是抓正文。除非你保存的是某种需要保留网页交互逻辑的页面否则导航、评论、侧边栏在你后续阅读时只会干扰视线。真正值得保留的是文章的核心内容和关键图片。第二个取舍格式保真还是内容保真有人喜欢连样式一起保存但 Markdown 本身就不是为了像素级还原设计的。我宁可损失一些排版细节也要保证转换后的文本是可读、可编辑、可搜索的。遇到复杂的表格、嵌套列表、代码块Markdown 依然能表达得很好。第三个取舍文件名用中文还是英文如果你以后要在命令行里操作文件纯中文名会遇到一些编码问题如果全用英文 slug可读性又差。我目前的方案是“域名前缀 年份 标题中文”例如sspai_2025_如何搭建个人知识库.md。中文标题保留可读性域名前缀保证来源可溯这样既方便人看也方便机器检索。3. 实操过程与核心环节实现3.1 前置准备本地目录与工具链在配置 skills 之前先想清楚你希望文件存在哪里、怎么分目录。我的结构是这样~/web2md/ ├── 技术笔记/ ├── 产品分析/ ├── 行业资讯/ ├── 随笔灵感/ ├── assets/ └── index.mdassets专门放从网页下载的图片每个保存任务在该目录下建一个以任务 ID 命名的子文件夹。这样做的好处是让 Markdown 文件和图片相对路径稳定全库迁移时不会碎掉。index.md是一个动态索引文件每次保存新网页后由 AI 自动追加一条带链接的记录。前置工具方面建议本机装好命令行版的文件监听器和全文搜索工具例如ripgrep用来做全文检索和fd用来快速找文件。这些工具与系统自带功能相比速度更快在大量 Markdown 文件里搜关键词几乎是秒出结果。装好之后做一次软链接把~/web2md指到常用目录即可。3.2 编写保存技能的完整流程第一步是“拿到链接先解析”。用户给的可能是一段带追踪参数的乱七八糟的 URL比如带utm_source、from之类的后缀。保存前先把这些追踪参数删掉只保留干净的页面地址。这个动作叫 URL 清理别小看它——带着一堆参数的文件名会丑到你不想看第二眼。第二步是“抓取页面”。这里我常用的办法是带上移动端用户代理去抓。如果页面内容是通过 JavaScript 动态渲染出来的就需要借助无头浏览器来获取渲染完成后的 HTML。当然无头浏览器比较重实际执行时速度也慢所以我只在检测到页面是单页应用或正文为空时才启用。第三步是“正文抽取”。这一步是决定最终文件质量的关键。通用做法是优先找 HTML 里的article标签找到就直接用它作为正文容器找不到时就计算每个div的文本密度取文本密度最高的那个区域作为正文候选。这一步在技术上对应“正文抽取算法”很多主流浏览器都有内置的“阅读模式”其背后的原理就是这么来的。第四步是“清洗与转换”。清洗的规则要写得明确nav、footer、script、style、广告标记节点全部删掉。评论区块也建议删掉除非你想保存评论区里的讨论。之后把 HTML 转成 Markdown重点处理好标题层级、链接、加粗、列表、代码块和表格。转换工具用开源库就行我个人的经验是先用现成的转换器跑一遍再做二次正则修正比完全手写解析器靠谱得多。第五步是“图片处理”。遇到网页里的图片我会先把图片 URL 提取出来逐个下载到assets/任务ID/目录并把 Markdown 里的引用路径改成相对路径。这里要设置两个超时参数单个图片下载超时 10 秒整批下载超时 60 秒。图片较多时等太久会影响使用体验容易超时的就先保留原 URL并在文件开头注明“该文件部分图片未本地化”。第六步是“命名与归档”。我设计了一个简单的规则[来源域名]_[年份]_[主标题].md。文件名里的非法字符统一替换成下划线长度控制在 80 个字符以内。归档时先让 AI 读一遍正文判断分类再放进对应目录。分类不确定时宁可放到“待整理”也不要乱归。第七步是“保存后校验”。这一步容易被忽略但特别重要。保存完后程序应该自动检查生成的 Markdown 文件是否为空、正文长度是否和原页面差距过大、图片是否下载成功、文件是否写入了预期目录。检测异常时记录到日志方便事后排查。3.3 不同的网页类型处理策略也要调整技术文档类页面正文内容主要靠标题和代码块驱动转换时一定要保护好代码块的缩进和语言标记。遇到一行超长的代码建议在 Markdown 里启用代码自动换行否则阅读体验会非常差。新闻资讯类页面重点保存发布时间、作者信息和正文侧边栏的“相关阅读”“热门推荐”通通删掉。有些资讯站内嵌大量图片建议压缩后再存避免本地文件夹变成一个庞然大物。论坛讨论类页面情况比较特殊。狭义上的“正文提取”只适合主题帖但很多场景下你希望连回复一起保存这时就不能只提取article还要匹配楼层结构。我的做法是把所有楼层正文拼接到一起用 回复人前缀来区分不同层主这样最终 Markdown 读起来像一场结构清晰的对话记录。3.4 配置技能的完整日志与提示词示例如果你希望在每次保存网页之后都得到一份反馈可以要求 AI 输出类似下面的保存报告保存完成 - 标题如何搭建个人知识库 - 来源某技术社区 - 分类技术笔记 - 本地路径~/web2md/技术笔记/某社区_2025_如何搭建个人知识库.md - 正文长度约 3200 字 - 图片5 张已下载0 张失败 - 摘要文章介绍了知识库的结构设计、工具链选择和日常维护方法这份报告不仅是操作回执也是一个很好的“二次抽取”入口。攒了一段时间之后我可以快速浏览这些摘要信息决定哪些文件值得深度阅读、哪些直接删除。4. 常见问题与排查技巧实录4.1 页面正文抓取不到得到的只有一片空白原因通常是目标网站的内容是异步加载的初始 HTML 里根本没有正文。排查分三步先看抓取下来的原始 HTML 里有没有文字如果没有说明是动态渲染启用无头浏览器再抓一次再不行检查是否是登录可见内容需要在请求中携带会话凭证。这个问题的底层经验是遇到技术平台和论坛时提前把“可能需要渲染”内置到判断条件里不要每次看到空白才手动切模式。我测试过的大部分技术类站点都有相当比例的页面是动态渲染的。4.2 转换出来的 Markdown 里混入了大量与正文无关的内容最常见的原因是正文抽取阶段选错了节点。比如有些网站把正文拆成多个div只取第一个文本密度高的节点就漏了后半部分。解决方法是抽取后先按“正文候选节点 后续同父级兄弟节点合并”的方式处理再通过校验步骤对比总字符数。如果发现转换后的文本量远小于正常值自动触发重试并降低抽取阈值。4.3 代码块和表格转换后格式全乱这一类问题主要出在转换器的规则不完整上。Markdown 对代码块的要求是必须标注语言类型表格则需要表头列和分隔行。针对代码块保存时先识别原始 HTML 中code节点是否带class属性把语言类型对应到标准名称没识别出来的统一标为text。针对表格遇到“合并单元格”时无法在标准 Markdown 中完美表达我的做法是保留单元格内容但拆成普通表格结构并在文件末尾注明“原表格存在合并单元格已按等价结构拆分”。4.4 图片保存失败导致本地 Markdown 里一堆外链图片失败无非两种一是目标服务器有防盗链按普通请求直接返回 403二是请求频率过高被限流。对付防盗链关键是带上目标网站的Referer请求头伪装成从原页面发出的图片请求。对付限流把图片下载间隔拉长到 500 毫秒以上必要时分批完成。如果某个图片重试 3 次仍然失败就保留原 URL 并记录到日志不要阻塞整个保存流程。4.5 文件名重复导致旧文件被覆盖这是最隐蔽也最伤的一个问题。同一个网站的文章标题有时会重复比如“年度盘点”这种名字几乎每年都有。如果不做冲突检测新文件会直接覆盖旧文件。解决方式很简单保存前检查目标路径是否存在同名文件存在就追加一个时间戳。这件事一定不能在命名规则里偷懒我因为偷懒丢过一次重要资料从此老老实实加了冲突处理。4.6 遇到网页里嵌着的大量广告怎么处理广告模块通常带advertisement、banner等特征类名按类名过滤能解决大部分问题。差劲的站点喜欢把广告伪装成正文段落这类很难直接靠节点特征识别。我的经验是结合内容特征判断如果某个文本块含有明显的“领取”“点击领取”“限时优惠”等广告高频词并且它前后文语义不连续就大概率是广告。另外我也会统计正文里的超链接密度如果某个段落里的链接多到不正常优先怀疑是推广内容。5. 进阶玩法与个人心得分享5.1 把浏览器里几千条旧书签批量迁移进来别急着手工一条条复制。常规做法是先用浏览器自带功能把收藏夹导出成 HTML 文件这个文件里每一个条目就是一个带标题和链接的记录。接着让 AI 批量读取这份文件把链接去重、过滤失效项再逐个按“给定 URL 列表”走保存流程。我整理旧收藏时发现真正值得保存的比例大概不到三成其余大多是工具站、购物链接、临时参考。这一轮整理下来收获的不仅是 Markdown 文件库更是一次真正意义上的信息减负。5.2 用全文搜索代替记忆Markdown 库建好之后最强的能力不是“收藏得整齐”而是“想找就能找到”。我在本地把~/web2md目录挂了索引搜索某个技术名词时秒出结果。这个体验对比浏览器收藏夹是碾压级的收藏夹搜标题都不一定搜得到而 Markdown 可以直接搜正文任意一行的内容。配合 skills我甚至可以问 AI 一句“我上次保存过一篇讲索引优化的文章吗”它直接返回文件路径和摘要。5.3 我实际踩过的三个典型坑第一个坑是把所有网页无脑当作静态页面处理。第一次遇到全动态渲染的站点时整个流程直接卡住正文提取出来只有几个字符。后来我在配置里加了“内容过少自动重试渲染模式”的判断这个问题才算解决。第二个坑是图片路径写成了绝对路径。最初我把图片统一放到一个全局assets目录结果保存几百篇之后目录乱得像垃圾场文件之间还会互相覆盖同名图片。后来改成“每篇任务独立子目录 相对路径引用”才彻底解决。第三个坑是分类规则写得过于理想化。AI 总能把一篇“讲产品设计的技术文章”分到产品分析但它对“技术还是产品”这个边界并不敏感。后来我在分类规则里给每个类别加了一个“特征词表”和“排除词表”还是分不准的直接落到“待整理”。承认分类存在灰区是这套流程长期稳定运行的前提。5.4 给新手的配置建议第一次搭建时不要追求面面俱到。我建议先用最小配置跑通抓取正文、转成 Markdown、保存到一个临时目录不做图片本地化、不做自动分类。跑一周觉得顺手了再加图片下载和分类归档。一次性上全部功能的话出了问题你根本不知道是抓取环节错了、转换环节错了还是归档环节错了排查成本会高到让你放弃整个方案。另外做出来的技能文件记得做版本管理改动之前先备份这是所有配置类系统的通用保命法则。用了一两个月之后再回头看浏览器那个积灰的收藏夹已经没有多少想保存的新东西了。这个习惯一旦转过来你会发现自己对“网页内容”的掌控力明显提升——看到好文章第一反应是存下来而不是仅仅留下一个链接。把内容放进自己的结构里才真正完成了一次收藏。