V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
kenshin
V2EX  ›  分享创造

为了达到完美的阅读模式这个小目标 ,我适配了 120+ 个网站,因此诞生了简悦 - 让你瞬间进入沉浸式阅读的 Chrome 扩展

  kenshin ·
kenshin · 2017-06-13 07:19:55 +08:00 · 21587 次点击
这是一个创建于 2722 天前的主题,其中的信息可能已经有所发展或是发生改变。

好吧,这应该是我写过最长的标题了,但不是标题党... 同样,也是我业余项目中单个版本开发周期最长的一个项目。


在「信息过载」的当下,如果你有与我一样的 「阅读障碍」,本篇文章会对你所有帮助。


logo

简悦 - SimpRead

让你瞬间进入沉浸式阅读的 Chrome 扩展,还原阅读的本质,提升你的阅读体验。


简悦是什么:

简悦是 沉浸式阅读的 Chrome 扩展,取自:「单阅读,心情愉」 之意。

简悦解决的问题:

为了避免文章开头所说的信息过载,我经常会使用「类似 Safari 中的阅读模式」,无奈 Chrome 下并没有太好的扩展,陆续使用了很多类似扩展,但这些扩展大多存在如下的一些问题:

  • 加载过慢,因为使用了 iframe 方案;
  • 某些图片无法显示,因为这些图片增加了 防盗链 功能;
  • 个别页面图文排版混乱,因为这些页面并没有按照常规方式生成,尤其是含有代码类的网页;

所以,初衷是为了有更好的阅读体验,结果事实却往往 “打脸” 打的厉害...

本着前端开发工程师的一贯 “特质”:既然没有好用的扩展,撸袖子,自己动手丰衣足食。为了避免犯同样的 “错误”,所以这个 Chrome 扩展 不能走老路,即:

  • 不使用 iframe 的方式,避免了 加载过慢 / 防盗链 的问题;
  • 生成适合 中文阅读 习惯的页面;

前者很容易实现,使用 Chrome extension API: content_scripts 即可达到注入页面,并能控制页面元素的目的。

后者不能按照常规的办法,因为没办法要求每个页面都按照良好的风格生成。但是,毕竟一个人经常阅读的网站就那些多,而且这些网站并不会经常更改其页面结构,所以如果能逐一适配这些网站,并且按照符合中文阅读的习惯生成页面即可。

最终通过分析一些常用的阅读咨询类 网站 / App 的数据,再加上精准适配,最终诞生了标题说的内容!

主要功能一览:

  • 阅读模式; 逐一适配了 120+ 个网站,并提取 标题 描述 正文 媒体资源( 图片 / 视频 ) 等,生成 符合中文阅读 的页面
  • 聚焦模式; 只高亮需要阅读,并隐藏掉其余部分,不分散用户的注意力,适合 非适配阅读模式 的网站,或者 临时阅读
  • 站点编辑器; 可编程,定制化,详细请看 站点编辑器
  • 多种主题; 白练、白磁、卯之花色、丁子色、娟鼠、月白、百合、紺鼠、黒鸢
  • 同步、上传 /下载 配置、同步适配列表等;
  • 稍后读;

截图:

(视觉效果) 简单阅读,愉悦心情!

(阅读模式) 简悦 - 阅读模式

(阅读模式 · 控制栏界面) 简悦 - 阅读模式 · 控制栏界面

照片集:

详细功能:

功能一览

如何使用(阅读模式):

简悦会自动检测当前页面是否已经适配,如适配则在浏览器右上角显示 Imgur ,使用以下三种方式启动:

  • 点击浏览器右上角 红色 icon

  • 右键选择 简悦 - SimpRead阅读模式

  • 快捷键;(默认为 双击 A )

如何使用(聚焦模式):

聚焦模式 会自动获取当前鼠标所在的段落并高亮,适合任意页面。

  • 在需要高亮的区域,右键选择 简悦 - SimpRead聚焦模式

  • 快捷键;(默认为 A S )

投票:

简悦是一个免费并开源的项目。如果觉得不错,请给我 投票 。这样让更多人了解并受用与 简悦 带来的便利,你的认可是对我最大的鼓励。

下一步:

新版本的功能,大家说的算,目前包含了以下几点:

  • 稍后读可以直接发送到 Pocket
  • 增强型 聚焦模式
  • 自行添加新的站点到 阅读模式
  • 自定义主题;

相关链接:

已知的一些问题:

说了一大堆 简悦 的优点,必须要自黑一下,列举几个发现的缺陷:

简悦需要你的帮助才能变得更好:

如果遇到了一篇需要使用 阅读模式 的网址却没有适配怎么办?

  • 请提交网址 到这里;当我适配完成后关闭此 issues,之后通过 简悦选项手动同步适配列表 更新;
  • 同样,你也可以直接提交已完成适配的代码,关于如何适配请看 站点编辑器

最后,如果你对 简悦 并不满意,提供给你其它一些同类产品:

  • Mercury Reader, Just Read, Dyslexia, 阅读模式 等等,总有一款适合你。 :)
第 1 条附言  ·  2017-06-13 09:46:38 +08:00

截至到目前 阅读模式 适配的网址已经是 141 个了,具体有哪些网址 猛击这里 (手动通过 ctrl + Fcontrol + F 查找)


如果有未适配的网址,可以提交,详细方法请看 这里


我在 http://next.36kr.com/posts/38183 上有个分享,希望大家给投个票。

或者 Chrome Webstore 上投票 或者 在 Github 上面 Star


希望让更多的人知道这个项目,能帮助更多的人。

第 2 条附言  ·  2017-06-14 10:12:50 +08:00

感谢各位 v2 在 Chrome Webstore 的评分,都是 ⭐⭐⭐⭐⭐ 好评!


下个版本 1.0.1 除了修复一些 issues 外,会增加如下功能:

  • 阅读进度 加入设定,可关闭;

  • 聚焦模式 点击遮罩后关闭 的逻辑,加入设定,可关闭;

  • 如果有适配的网站,自动进入 阅读模式 的选项,可关闭;

  • 控制栏自动隐藏 加入设定,可关闭;


大家比较关心的 站点编辑器,会增加一个新的功能:

类似 Adblock 订阅阅规则 的功能

方便社区维护,以及自己批量添加网站。

这个功能应该会放到 1.0.1 的下个版本中。

第 3 条附言  ·  2017-07-23 12:24:50 +08:00
为了方便大家沟通,我在 Telegram 上建立了群,地址 https://t.me/simpread
第 4 条附言  ·  2017-09-07 16:41:03 +08:00
简悦 1.0.3 已经发布,详细请看 /t/388202
第 5 条附言  ·  2018-10-26 11:35:46 +08:00

由于「七牛」去掉了测试域名,所以很多图都挂了,如果本篇文章对你有所帮助,请手动将


ojec5ddd5.bkt.clouddn.comsr.ksria.cn


最后,切忌不要在使用类似「七牛」这样的测试域名... 😈

157 条回复    2018-01-01 18:58:11 +08:00
1  2  
zerOlike
    101
zerOlike  
   2017-06-15 11:09:24 +08:00   ❤️ 1
赞,,6666666
kenshin
    102
kenshin  
OP
   2017-06-15 11:29:09 +08:00
右下角的 「控制栏」 与 顶部的 「阅读进度」 在下个版本中都可以设定为不显示。 :)
panzhc
    103
panzhc  
   2017-06-15 12:59:11 +08:00
@kenshin chrome 插件的设定我一般都是一次性配好,后面懒得去改,反而退出是强需求,所以建议一定要有个退出的快捷键。
kenshin
    104
kenshin  
OP
   2017-06-15 13:30:15 +08:00
@panzhc #103
okay,没问题,下个版本就会提供。( 但暂时不提供自定义,只是将 「常用的 esc 」 加入到快捷键操作。)
kenshin
    105
kenshin  
OP
   2017-06-15 15:47:44 +08:00
@YvesX #50
我重现了你说的情况,可以 Fix 掉。 :)
malagebidi
    106
malagebidi  
   2017-06-15 16:15:09 +08:00 via Android   ❤️ 1
右键菜单能禁用吗,强迫症不能忍啊
sumuu
    107
sumuu  
   2017-06-15 16:45:46 +08:00   ❤️ 1
这个牛逼!先赞
kenshin
    108
kenshin  
OP
   2017-06-15 17:48:05 +08:00
@malagebidi #106
下个版本提供,还有比我还强迫症的 :)
witcherhope
    109
witcherhope  
   2017-06-15 21:23:20 +08:00   ❤️ 1
很贴心的功能, 目前体验良好
kenshin
    110
kenshin  
OP
   2017-06-15 21:38:47 +08:00 via Android
@witcherhope
谢谢评价,下个版本重点搞定一些细节的定制化。
huamingrui
    111
huamingrui  
   2017-06-15 23:24:29 +08:00   ❤️ 1
本来想提议加个退出快捷键和隐藏顶部进度条, 发现作者已经决定下个版本就实现了, 大赞!
kenshin
    112
kenshin  
OP
   2017-06-16 09:34:23 +08:00
@huamingrui #111
众心所向 😄
Aether
    113
Aether  
   2017-06-16 10:17:25 +08:00
试用了一下,感觉 Evernote 提供的 Clearly 更好一些。主要的问题有两个:1、红色的按钮太刺眼了,完全削弱了初心; 2、段落宽度控制有问题。现在的排版是自适应的宽度,然而在比较高的分辨率下,阅读会有问题。这部分建议楼主研究一下排版,应该有很多文章讨论中英文文章,适合阅读的最佳宽度、最宽宽度等等。
kenshin
    114
kenshin  
OP
   2017-06-16 11:18:38 +08:00
@Aether #113
感谢回复,我也挺喜欢 Clearly,用它用了很久。

但 Clearly 有些问题,我也在帖子里面说了,你可以看看 #43 #46 楼的截图,以及我刚刚使用 Clearly 的对比,这还不包括 各种更奇葩的 页面结构 或者 含有大段代码的 页面等。

设计良好的页面结构,Clearly 效果



设计良好的页面结构,简悦 效果



设计良好的含有代码的页面结构,Clearly



设计良好的含有代码的页面结构, 简悦



高分辨率下的 2560 * 1600 Clearly



高分辨率下的 2560 * 1600 简悦



另外,你说的 控制栏 在下个版本中可以设定为隐藏;段落问题可以通过 站点编辑器 解决。
solobat
    115
solobat  
   2017-06-16 11:33:03 +08:00   ❤️ 1
功能挺丰富,希望越做越好
kenshin
    116
kenshin  
OP
   2017-06-16 11:59:09 +08:00
@solobat #115
谢谢~
sumuu
    117
sumuu  
   2017-06-16 12:08:09 +08:00   ❤️ 1
哥们,报个 Bug!

系统: Linux Minit 1 8.01 MATE 64bit
chrome: Version 59.0.3071.104 (Official Build) (64-bit)

在 V2EX 上面选择"使用阅读模式打开此链接" 点击无效
kenshin
    118
kenshin  
OP
   2017-06-16 12:30:27 +08:00   ❤️ 1
@sumuu #117
3ks~
虽然在页面的任何位置都可以显示「使用阅读模式打开此链接」 ,但只能在 「网页的链接」 上有效,非链接的位置无效...
hester
    119
hester  
   2017-06-16 14:38:55 +08:00   ❤️ 1
我就是从 Readability -> Clearly -> Mercury Reader -> 简悦 一路走过来的,Readability 虽然不是专门做这个的,本来也不错,后来发现解析越来越差,后来迁移到 印象笔记,但是印象笔记放弃它了... 即便没有放弃,也存在一些问题。
后来又用了一段时间 Mercury Reader,它支持 E 文 的页面还不错,中文就够呛了,而且速度还慢。

之后完全不使用阅读模式类的扩展了,反正也没太好用的,直到发现了简悦。 :)
kenshin
    120
kenshin  
OP
   2017-06-16 16:38:42 +08:00
@hester #119
😄 感谢这么中肯的留言~
bookit
    121
bookit  
   2017-06-16 17:11:30 +08:00   ❤️ 1
不错,不过我用 firefox。。
kenshin
    122
kenshin  
OP
   2017-06-16 18:09:40 +08:00
@bookit #121
等 for Chrome 稳定后,弄个 Firefox extension 试试。 :)
maemolee
    123
maemolee  
   2017-06-16 18:45:33 +08:00   ❤️ 1
很强,火钳刘明。
zzk819166453
    124
zzk819166453  
   2017-06-17 08:37:07 +08:00 via Android   ❤️ 1
一直在用阅读模式,马克一下,待会用用看有什么不同
kenshin
    125
kenshin  
OP
   2017-06-17 10:25:55 +08:00
@zzk819166453 #124
欢迎试用。 :)
kenshin
    126
kenshin  
OP
   2017-06-17 13:15:37 +08:00   ❤️ 1


@daimazha @panzhc @makry @BlueWolf @xinhangliu @panzhc @malagebidi @huamingrui
你们想要的功能,下周会发布~

PS:不得不赞一个 Material Design,拯救了像我这样的 Developer !
tyhunter
    127
tyhunter  
   2017-06-17 16:43:36 +08:00   ❤️ 1
棒!另外能否做一下 V2EX 的适配呢?
kenshin
    128
kenshin  
OP
   2017-06-17 18:13:27 +08:00 via Android
@tyhunter
v2 已适配,但只限于用 markdown 生成的页面,比如本页,非 markdown 页面不适配。
siyiye
    129
siyiye  
   2017-06-17 22:04:05 +08:00   ❤️ 1
期待有一键分享至 onenote
kenshin
    130
kenshin  
OP
   2017-06-18 08:54:22 +08:00
@siyiye #129
未来会跟 发送到 Pocket 功能一起上线。

1.0.1 (下周发布) 版本现已提供 「转换当前页面为 md 并下载」 的功能,这个功能由 @ksky 编写~
hester
    131
hester  
   2017-06-18 10:06:58 +08:00
@kenshin
这么勤劳,周末也工作?
kenshin
    132
kenshin  
OP
   2017-06-18 10:33:41 +08:00
@hester #131
上午有点时间撸代码,下午看场电影,晚上跟小伙伴撸串。 😄
过的比平时还忙... 😓
29EtwXn6t5wgM3fD
    133
29EtwXn6t5wgM3fD  
   2017-06-18 10:55:38 +08:00 via iPhone
能适配 firefox 么
kenshin
    134
kenshin  
OP
   2017-06-18 11:31:43 +08:00 via iPhone
@shengyu
暂时不会考虑,等上线社区版后,才会考虑其它浏览器的适配。 😀
NICEghost
    135
NICEghost  
   2017-06-20 08:54:11 +08:00 via Android   ❤️ 1
哇很喜欢!安装支持!
kenshin
    136
kenshin  
OP
   2017-06-20 10:35:05 +08:00
@NICEghost #135
感谢支持~
另外,1.0.1 版本即将发布,可以看下 126 楼的截图。( 跟真正的 1.0.1 版本有些细节的差别而已。)
treycheng
    137
treycheng  
   2017-06-21 16:27:39 +08:00
kenshin
    138
kenshin  
OP
   2017-06-21 16:52:07 +08:00
@treycheng #137
okay ~ 加好后,我会在这里通知你。

我顺便也会把 http://www.ituring.com.cn/article 加到适配列表

不过,你给出的地址似乎只是电子版图书的试读吧?
treycheng
    139
treycheng  
   2017-06-21 18:53:36 +08:00
@kenshin tks.... 不是 你购买了 是可以直接阅读的。。
wweir
    140
wweir  
   2017-06-21 22:02:00 +08:00
推荐一个拓展,希望能给楼主以后版本的迭代提供一些思路

https://chrome.google.com/webstore/detail/boamfheepdiallipiieadpmnklbhadhc
kenshin
    141
kenshin  
OP
   2017-06-22 09:30:17 +08:00
@wweir #140
感谢推荐 在开发简悦的时候就有留意过这个扩展。
之前在这里也说过,当前版本的聚焦功能比较弱,未来会加强聚焦功能,而参考依据之一 就是它 或者 adblock。 :)
zfree
    142
zfree  
   2017-06-22 12:03:28 +08:00 via iPhone
mark 一下
pengfei
    143
pengfei  
   2017-06-22 14:41:17 +08:00   ❤️ 1






昨天无意间看到的不知道算不算 bug,第一张第一次进入,第二张选择简悦,代码有点模糊,第三张关闭后,正文字体变大了. 希望有所帮助
kenshin
    144
kenshin  
OP
   2017-06-22 15:57:52 +08:00
@pengfei #143
的确如图所示
这是个 Bug,已报 issues https://github.com/Kenshin/simpread/issues/1
已修复,下个版本(下周)更新后就可以了。
hester
    145
hester  
   2017-06-26 08:56:40 +08:00 via Android
K 大,什么时候发布新版本?😳
kenshin
    146
kenshin  
OP
   2017-06-26 10:03:24 +08:00
@hester #145
嗯嗯,抱歉晚了,本周内发布~
由于为了下个版本使用 minimatch 所以改了适配列表中的 URL 规则,所以花费了一些时间,再加上上周比较忙... 😭

PS:上周有几个网址没有增加,下午或者明天会把它们加入到 适配列表。
kenshin
    147
kenshin  
OP
   2017-06-26 16:15:15 +08:00
@treycheng #137

![Imgur]( )

抱歉晚了,上述两个新站已经加入,请使用 「设置 → 同步适配列表」 的方式更新。
kenshin
    148
kenshin  
OP
   2017-07-03 10:27:12 +08:00
@daimazha @panzhc @makry @BlueWolf @xinhangliu @malagebidi @huamingrui @hester
大家提的需求已经转化为 1.0.1 发布了,传送门 /t/372576
如有打扰大家,请见谅~
treycheng
    149
treycheng  
   2017-07-23 10:52:17 +08:00
@kenshin github 的 markdown 使用聚焦模式阅读, 但是聚焦模式需要点 2 次,快捷键怎么设置的。。 好像不太灵敏
kenshin
    150
kenshin  
OP
   2017-07-23 11:41:32 +08:00
@treycheng
额?我刚试过,没问题,你能稳定重现吗?聚焦模式的快捷键设置请看下图

treycheng
    151
treycheng  
   2017-07-23 12:13:34 +08:00
@kenshin 抱歉,我知道在这里设置, 应该是我刚刚设置的快捷键和别的冲突了? 用了两个 shift 快捷键是 ok 的。 还有个问题是,这个快捷键设置在一行里,设置的时候容易误导了...
treycheng
    152
treycheng  
   2017-07-23 12:14:04 +08:00
@kenshin 用这个看 github 的书体验真的不错
kenshin
    153
kenshin  
OP
   2017-07-23 12:22:25 +08:00
@treycheng
如果 Chrome 之前装了 cVim 之类的扩展,的确有冲突,暂时还没什么好的解决办法。
我也是装了 cVim,聚焦模式与阅读模式的快捷键分别是:shift shift 与 1 1

快捷键输入框的逻辑做了验证限制以及格式化,所以无论如何输入,最终显示的格式 为 xxx xxx

只要是被适配的网址,用简悦看都不错 😃 😉
kenshin
    154
kenshin  
OP
   2017-07-23 12:23:58 +08:00
@treycheng
我在 Telegram 上弄了个群,方便沟通~
地址 https://t.me/simpread
CEBBCAT
    155
CEBBCAT  
   2018-01-01 17:03:38 +08:00 via Android
不错,谢谢您
kenshin
    156
kenshin  
OP
   2018-01-01 18:49:09 +08:00 via Android
@CEBBCAT
不客气,不过…这是挖坟贴了 😓
新版以及评论请前往 https://www.v2ex.com/t/418635
CEBBCAT
    157
CEBBCAT  
   2018-01-01 18:58:11 +08:00   ❤️ 1
@kenshin #156 没关系的, 过于陈旧的帖子是不会被顶上去的
1  2  
关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3150 人在线   最高记录 6679   ·     Select Language
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.8.5 · 26ms · UTC 13:48 · PVG 21:48 · LAX 05:48 · JFK 08:48
Developed with CodeLauncher
♥ Do have faith in what you're doing.