收藏这些小书签,在 Safari 中轻松改字体、改字号、启用 Instapaper 阅读模式……

1,583 阅读5分钟
原文链接: zhuanlan.zhihu.com

我们每天都要浏览大量的网页,但不是每个网页的设计都能做到为读者着想。实际上,相当比例的网页设计十分糟糕,读起来非常费劲。对此,Safari 的阅读模式是一个不错的解决方案,但并不是在所有网页上都能成功启用、或是取得理想的效果。使用 Stylish、Tampermonkey 等浏览器插件也是一种途径,但不适用于 iOS,而桌面版 Safari 也对第三方插件 越发不友好了。

上述问题可以通过使用 小书签(bookmarklet)来解决。小书签的本质是一段 JavaScript 脚本,典型用途之一就是修改当前浏览器页面的外观,包括但不限于字体、字号、颜色等。相比于完整的浏览器插件,小书签尽管功能比较简陋,但优势在于通用性极强,可以用在包括 iOS 版 Safari 在内的任何浏览器上。

要将小书签添加到 Safari 中,最简单的方法是在桌面端操作,将下文给出的链接拖拽到书签栏即可;它们会随着 iCloud 同步到 iOS 端。如果要在 iOS 上操作,则可以先长按复制这些小书签的链接,然后任意将一个网页(例如本页)保存到收藏夹,再通过编辑功能将其链接改为前面复制的内容。

注:小书签是一个历史相当久远的功能,网上的资料也很丰富(少数派几年前有过一篇很详尽的 文章),故本文不多赘述其原理和制作方法。

关联阅读:无需安装浏览器插件,这些常用功能用「小书签」也能实现

修改网页字体

字体是网页设计中的重要环节。选用一个美观的字体组合,不仅能让用户阅读信息更加顺畅,也有利于增强网站的视觉辨识度。遗憾的是,很多网页设计者都忽略或者滥用了字体设计。有的不加考虑,放任系统调用 Arial、Times New Roman 等让人直翻白眼的回退字体;有的则矫枉过正,选择了一些乍看很有风格、实则根本不适合阅读的「个性」字体。遇到这类网页时,运行下面这个小书签,可以将页面字体统一为系统默认字体(San Francisco),获得更好的可读性。

小书签:👓 Normalize Fonts

注意:

  1. 这个小书签理论上对于绝大多数网页都能奏效,但也存在一些例外情况。例如,如果目标网页使用了 HTML 的 <font> 标签(已经被废弃)来指定字体,就超出了上面代码的控制范围。修改网页外观的第三方插件也可能与该小书签的功能冲突。
  2. 如果你嫌 San Francisco 太过沉闷,不妨选择把字体换成 Seravek(成品:👓 Normalize Fonts – Seravek)。这也是我在 Safari 阅读模式中最常使用的字体,它在保证版面清爽易读的前提下,为笔画加入了很多俏皮的细节,非常适合用来攻克那些令人眼神涣散的长篇大论。
  3. 比较遗憾的是,从 Safari 12 开始,苹果似乎 禁止 了用 font-family 属性调用系统内置字体以外的字体。换句话说,即使本机已经安装了 font-family 列表中指定的外部字体,也会被 Safari 忽略。因此,修改字体选择范围仅限于 iOS / macOS 的 自带字体

放大网页字号

另外一种常见的网页设计问题是字号过小,读起来十分吃力。虽然 Safari 中可以很方便地通过两指缩放手势放大页面,但那会让文字过宽或者超过屏幕边框,需要反复左右卷动页面才能阅读,比较影响效率;理想的解决方案应该是只放大字体,而保持其他元素大小不变。下面这个小书签就可以实现上述需求。运行后,网页字号会被放大到 17px——苹果在 iOS 设计准则 中指定的默认正文字号。如果仍然觉得字体不够大,可以反复运行,字号会以 2px 为单位步进。

小书签:➕ Zoom Text

调用 Instapaper 显示网页文章

如上文所提及,Safari 的阅读模式并不是在所有网页上都能启用,也并不是总能取得理想的页面重排效果。这时,可以考虑使用更为专业的第三方服务来替代。例如,Instapaper 作为知名的「稍后读」服务,其设计的考究是广为承认的,它的重排版引擎能「驯服」绝大多数张牙舞爪的页面。只是,对于那些一扫而过的页面,如果仅仅为了改善阅读效果就将它们统统保存到 Instapaper 再阅读,不仅有些繁琐,也会让自己的稍后读列表很不整洁。

实际上,Instapaper 提供了一个简易接口(https://www.instapaper.com/text?u=[页面链接]),可以直接调用其排版功能显示特定网页上的文章,而不用先行保存。下面这个小书签的功能就是调用该接口显示当前网页的文章:

小书签:📖 Instapaper

注意:第一次运行该小书签时,会被要求登录 Instapaper。

高亮特定关键词

阅读网页时,我们经常会希望让一些内容醒目显示,例如高亮文档中的特定术语、新闻报道中反复出现的人名等,以起到辅助阅读的效果。为此,用 ⌘F 开启自带的查找功能当然是最简单的做法,但 Safari 的查找功能并不好用,加入了很多不必要的遮罩和动画元素,反而会干扰阅读;另外,⌘F 只能做到每次高亮一个关键词。如果你被类似的问题困扰过,可以试一试下面这个小书签:

小书签:🖍 Highlight…

运行该小书签后,Safari 会先后弹出两个输入框,分别用于指定要高亮的关键词和要使用的高亮颜色(默认为 yellow 黄色,可以输入任意合法的 颜色名称 或 Hex 颜色代码)。