技术写作与文档2020debuggingcss.com
Show HN:我写了一本关于调试 CSS 的书
Show HN: I wrote a book about Debugging CSS
导读
这是一位前端开发者为自己写的《Debugging CSS》做的推介:用浏览器开发者工具定位 CSS 问题,并汇总最常见的坑。对写作者来说,它示范了如何把一个零散、口耳相传的手艺整理成结构清晰、有明确读者定位的实用书,评论区还提供了关于排版制作与经验归纳的旁证。
可以直接用的写作要点
- 01
选一个网上资料稀缺、大家却天天遇到的题目(如 CSS 调试),比再写一遍热门主题更容易被读者需要。
- 02
把个人经验压缩成一句可复述的口诀(“十有八九是 position: relative 或 overflow: hidden”),读者记得住、也用得上。
- 03
写作时明确回答“谁能读、读完能得到什么”,并给出免费样章或示例,降低读者试读门槛。
- 04
把零散技巧组织成“工具用法和常见问题清单”这样的结构,让书更像手册而非随笔集。
HN 评论精选
排版/制作方式值得关注,而“资料稀缺的题材”正是这本书的价值所在。
这本书看起来很有意思。好奇你是怎么排版制作的?非常漂亮!是用 HTML/CSS 做的吗?如果是,我猜你用了 Prince XML,因为分页做得很准。另外说回正题:CSS 调试很难写成书,网上关于 CSS 的资料也偏少(Stack Overflow 对编程语言很好用,但对前端设计我觉得不够),所以对学 CSS 的人和想成为 Web 开发者的人来说,这可以是一个很好的入门资源。
abhinav22查看英文原文
This looks very interesting. Out of curiosity how did you typeset / format the book? It looks gorgeous! Was it in HTML/CSS? In which case I assume you are using Prince XML I guess since you got the pagination just right. Separately on topic, CSS debugging is a hard thing to put in book form, and there is a lack of materials on the web on CSS (stack overflow which is usually great for programming languages, is not as good for front end design in my opinion), so for those learning CSS, or aspiring to be web developers, this could be a great starting resource.
把高频经验凝练成一句口诀,是让技术写作好记好用的办法。
CSS 调试经验法则第一条:十次里有九次,你需要的是 position: relative 或 overflow: hidden。
nicoburns查看英文原文
CSS debugging heuristic #1: 9 times out of 10 it's a `position: relative` or `overflow: hidden` you need.
给读者一个可以直接上手的工具,比抽象描述方法更有说服力。
我搞定棘手布局和 UI bug 的秘密武器是 Pesticide(附 GitHub 与 Firefox 插件链接)。它本质上是给所有元素加边框的更高级做法,悬停交互特别好用,能暴露出你没想到自己正悬停其上的元素。
chiyc查看英文原文
My secret weapon for squashing tricky layout and UI bugs is Pesticide. https://github.com/mrmrs/pesticide https://addons.mozilla.org/en-US/firefox/addon/pesticide-css-for-firefox/ It's basically the more sophisticated way of putting a border on everything. The hover interactions are great for revealing elements you didn't think you were hovering over.
同类还值得读
编写更好文档的框架
A Framework for Writing Better Documentation
这是 Divio 的文档写作框架,把技术文档按「读者的目标」分成四类:教程(学习导向)、操作指南(问题导向)、参考(信息导向)、解释(理解导向)。
技术写作与文档2021 · 637 分 · 76 评4 条写作要点编辑精选写好一份设计文档
Writing a good design document
这篇 HN 帖子标题为《Writing a good design document》,主题是如何写好一份设计文档;对写作者来说,它值得作为技术写作和结构化说明文的参照。
技术写作与文档2025 · 581 分 · 147 评3 条写作要点编辑精选技术写作课程
Technical Writing Courses
这是 Google 官方免费技术写作课程(两门),讲受众定义、主动语态、短句、文档结构等基础方法。
技术写作与文档2020 · 571 分 · 73 评4 条写作要点编辑精选写出更好的错误信息
Write better error messages
这篇帖子讨论如何写出更好的错误信息,评论补充了开发者场景下的具体做法和真实反面案例。
技术写作与文档2022 · 566 分 · 253 评4 条写作要点编辑精选写一本技术书的经济账
The Economics of Writing a Technical Book
一位技术书作者拆解写书的真实经济账:版税收入往往远低于投入的时间成本。
技术写作与文档2018 · 519 分 · 149 评4 条写作要点编辑精选