写作方法2022hogbaysoftware.com
Bike:创新的富文本编辑
Bike: Innovative Rich Text Editing
导读
这篇是 Bike 编辑器作者对其「亲和光标」(affinity cursor)设计的说明:在同一屏幕位置上,格式标签的内侧与外侧其实对应两个不同的插入点,普通编辑器往往悄悄跳过其中一个,而 Bike 用小尾巴把二者的差别显示出来。对写作者来说,它提醒我们「改文字」与「改结构/格式」是两件不同的事;看清自己正处在哪一层,修改会更精准。
可以直接用的写作要点
- 01
修改文稿时要分清自己改的是文字内容还是格式标记,二者常在同一视觉位置重叠,改动前先确认动的是哪一层。
- 02
插入点位于格式边界的内侧还是外侧,决定新输入的字符是否继承已有格式;同理,增删一句话前先判断它归属于哪个段落或论点单元。
- 03
与其像多数编辑器那样跳过某个位置、把实现细节藏起来,不如把差异用极小的视觉提示显性化——写作中一个破折号或标点也能起到同样的分层作用。
- 04
工具上的一点小革新(如光标上的一条小尾巴)就能显著降低误操作,选写作工具时可以留意这类细节是否让编辑更可控。
HN 评论精选
格式标签内外其实是两个光标位置,用小尾巴显性化比偷偷跳过更诚实也更好用。
「亲和光标」是个很妙的创新。多数基于 HTML/DOM/contenteditable 的富文本编辑器最后都会加一个「虚拟光标」,让你能在浏览器原生光标不支持的位置插入内容(比如浮动图片旁、表格行末)。这篇说的本质上就是这件事。内部实现上,行内格式会像 HTML 一样被标记成标签,于是格式标签的内外各有一个可能的光标位置,但屏幕上看起来是同一个点。用这种方式提示两者的区别非常优雅。比如代码 Something <b>bold</b>,有两个视觉上完全相同的插入点:Something |<b>|bold</b>。多数编辑器会「跳」过其中一个,把实现细节藏起来;这个设计则用光标上的小尾巴把它暴露出来。
samwillis查看英文原文
The "affinity cursor" is a really lovely innovation. Most HTML/DOM/contenteditable based rich text editors end up adding support for virtual cursors that enable you to have the insertion cursor somewhere that the native browser cursor hasn't got support for (next to a floating image, end of a table row). Effectively this is what this is doing. Internally the inline formatting will be marked as tags in a rage, exactly like html. Essentially there is a possible cursor position both inside and outside a formatting tag, but both appear as the same visual location on the screen. This is such a lovely way to indicate the difference. So with this code: Something <b>bold</b> There are two cursor positions that are visually the same place: Something |<b>|bold</b> ^ ^ Most editors "jump" over one of those positions to hide the implementation detail from users. This idea exposes it with a little tail on the cursor.
开发者本人征集意见:自动补全的痛点常在周边界面而非候选词本身,可预测性才是关键。
我是 Bike 的开发者,谢谢大家的评论。趁还有人看,我想请教一下:我正在给 Bike 加自动补全,但我个人觉得 macOS 的自动补全很难用、不可预测,我索性关掉了它,结果打了很多错字。我说的主要不是候选词建议,而是周围的界面。想收集一些让自动补全更好用、更可预测的思路或链接。我熟悉 Mac 应用,其他平台了解不多。你们最喜欢的(无论过去还是现在的)自动补全实现是哪个?如果能让你「修好」macOS 的自动补全,它会是什么样子?
jessegrosjean查看英文原文
I'm Bike's developer. Thanks everyone for the comments. While I have the eyeballs I hope you don't mind me asking... I'm in process of adding autocomplete to Bike. Problem is that I generally find macOS autocomplete painful and unpredictable. I both disable it and have many typos. I'm not talking so much about the suggestions, but about the surrounding UI. I'm looking for ideas/links for how to make autocomplete better and more predictable. I know Mac apps, I do know much else. What are your favorite autocomplete implementations past or present? If you could have a "fixed" macOS autocompletion what would it look like?
同类还值得读
被低估的工程技能:把文章写好
Undervalued Engineering Skills: Writing Well
这篇文章讨论为什么“写得好”是被低估的工程能力,以及它如何在团队协作、系统设计和职业发展中持续带来回报。
写作方法2019 · 1,109 分 · 371 评4 条写作要点编辑精选每行只写一句话:让写作和修改都更轻松的排版法
Writing one sentence per line
这是 Derek Sivers 的一篇短文,主张写作时每行只放一个句子,而不是按段落排版。
写作方法2022 · 849 分 · 297 评4 条写作要点编辑精选书面沟通是远程工作的超级能力
Written communication is remote work super power
这篇文章讨论远程工作中书面沟通的价值,评论区则补充了异步与同步沟通的适用场景,并提醒读者:备忘录、结论先行、结构化命令格式等书面沟通传统早已有之。
写作方法2020 · 831 分 · 190 评4 条写作要点编辑精选如何写出有用的文字
How to Write Usefully
保罗·格雷厄姆在这篇文章里给"有用的写作"下了一个可操作的公式:有用≈重要×新颖×正确×清楚,任一项为零,整篇文章就等于零;他还主张敢下确定判断、删掉让自己心虚的句子。
写作方法2020 · 821 分 · 285 评4 条写作要点编辑精选如何写得更清楚、想得更清楚,并学会复杂材料(PDF)
How to write more clearly, think more clearly, and learn complex material [pdf]
这份 PDF 讨论如何把文章写清楚、把思路理清楚,并用写作来学习复杂材料。
写作方法2022 · 779 分 · 153 评4 条写作要点编辑精选