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

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

  kenshin · 103 天前 · 9247 次点击
这是一个创建于 103 天前的主题,其中的信息可能已经有所发展或是发生改变。

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


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


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 条附言  ·  103 天前

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


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


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

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


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

第 2 条附言  ·  102 天前

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


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

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

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

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

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


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

类似 Adblock 订阅阅规则 的功能

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

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

第 3 条附言  ·  63 天前
为了方便大家沟通,我在 Telegram 上建立了群,地址 https://t.me/simpread
第 4 条附言  ·  16 天前
简悦 1.0.3 已经发布,详细请看 /t/388202
154 回复  |  直到 2017-07-23 12:23:58 +08:00
1  2  
    101
zerOlike   101 天前   ♥ 1
赞,,6666666
    102
kenshin   101 天前
右下角的 「控制栏」 与 顶部的 「阅读进度」 在下个版本中都可以设定为不显示。 :)
    103
panzhc   101 天前
@kenshin chrome 插件的设定我一般都是一次性配好,后面懒得去改,反而退出是强需求,所以建议一定要有个退出的快捷键。
    104
kenshin   101 天前
@panzhc #103
okay,没问题,下个版本就会提供。( 但暂时不提供自定义,只是将 「常用的 esc 」 加入到快捷键操作。)
    105
kenshin   101 天前
@YvesX #50
我重现了你说的情况,可以 Fix 掉。 :)
    106
malagebidi   101 天前 via Android   ♥ 1
右键菜单能禁用吗,强迫症不能忍啊
    107
sumuu   100 天前   ♥ 1
这个牛逼!先赞
    108
kenshin   100 天前
@malagebidi #106
下个版本提供,还有比我还强迫症的 :)
    109
witcherhope   100 天前   ♥ 1
很贴心的功能, 目前体验良好
    110
kenshin   100 天前 via Android
@witcherhope
谢谢评价,下个版本重点搞定一些细节的定制化。
    111
huamingrui   100 天前   ♥ 1
本来想提议加个退出快捷键和隐藏顶部进度条, 发现作者已经决定下个版本就实现了, 大赞!
    112
kenshin   100 天前
@huamingrui #111
众心所向 😄
    113
Aether   100 天前
试用了一下,感觉 Evernote 提供的 Clearly 更好一些。主要的问题有两个:1、红色的按钮太刺眼了,完全削弱了初心; 2、段落宽度控制有问题。现在的排版是自适应的宽度,然而在比较高的分辨率下,阅读会有问题。这部分建议楼主研究一下排版,应该有很多文章讨论中英文文章,适合阅读的最佳宽度、最宽宽度等等。
    114
kenshin   100 天前
@Aether #113
感谢回复,我也挺喜欢 Clearly,用它用了很久。

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

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



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



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



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



高分辨率下的 2560 * 1600 Clearly



高分辨率下的 2560 * 1600 简悦



另外,你说的 控制栏 在下个版本中可以设定为隐藏;段落问题可以通过 站点编辑器 解决。
    115
solobat   100 天前   ♥ 1
功能挺丰富,希望越做越好
    116
kenshin   100 天前
@solobat #115
谢谢~
    117
sumuu   100 天前   ♥ 1
哥们,报个 Bug!

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

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

之后完全不使用阅读模式类的扩展了,反正也没太好用的,直到发现了简悦。 :)
    120
kenshin   99 天前
@hester #119
😄 感谢这么中肯的留言~
    121
bookit   99 天前   ♥ 1
不错,不过我用 firefox。。
    122
kenshin   99 天前
@bookit #121
等 for Chrome 稳定后,弄个 Firefox extension 试试。 :)
    123
maemolee   99 天前   ♥ 1
很强,火钳刘明。
    124
zzk819166453   99 天前 via Android   ♥ 1
一直在用阅读模式,马克一下,待会用用看有什么不同
    125
kenshin   99 天前
@zzk819166453 #124
欢迎试用。 :)
    126
kenshin   99 天前   ♥ 1


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

PS:不得不赞一个 Material Design,拯救了像我这样的 Developer !
    127
tyhunter   98 天前   ♥ 1
棒!另外能否做一下 V2EX 的适配呢?
    128
kenshin   98 天前 via Android
@tyhunter
v2 已适配,但只限于用 markdown 生成的页面,比如本页,非 markdown 页面不适配。
    129
siyiye   98 天前   ♥ 1
期待有一键分享至 onenote
    130
kenshin   98 天前
@siyiye #129
未来会跟 发送到 Pocket 功能一起上线。

1.0.1 (下周发布) 版本现已提供 「转换当前页面为 md 并下载」 的功能,这个功能由 @ksky 编写~
    131
hester   98 天前
@kenshin
这么勤劳,周末也工作?
    132
kenshin   98 天前
@hester #131
上午有点时间撸代码,下午看场电影,晚上跟小伙伴撸串。 😄
过的比平时还忙... 😓
    133
shengyu   98 天前 via iPhone
能适配 firefox 么
    134
kenshin   98 天前 via iPhone
@shengyu
暂时不会考虑,等上线社区版后,才会考虑其它浏览器的适配。 😀
    135
NICEghost   96 天前 via Android   ♥ 1
哇很喜欢!安装支持!
    136
kenshin   96 天前
@NICEghost #135
感谢支持~
另外,1.0.1 版本即将发布,可以看下 126 楼的截图。( 跟真正的 1.0.1 版本有些细节的差别而已。)
    137
treycheng   95 天前
@kenshin 图灵社区 希望支持。。http://www.ituring.com.cn/book/tupubarticle/16499
    138
kenshin   94 天前
@treycheng #137
okay ~ 加好后,我会在这里通知你。

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

不过,你给出的地址似乎只是电子版图书的试读吧?
    139
treycheng   94 天前
@kenshin tks.... 不是 你购买了 是可以直接阅读的。。
    140
wweir   94 天前
推荐一个拓展,希望能给楼主以后版本的迭代提供一些思路

https://chrome.google.com/webstore/detail/boamfheepdiallipiieadpmnklbhadhc
    141
kenshin   94 天前
@wweir #140
感谢推荐 在开发简悦的时候就有留意过这个扩展。
之前在这里也说过,当前版本的聚焦功能比较弱,未来会加强聚焦功能,而参考依据之一 就是它 或者 adblock。 :)
    142
zfree   94 天前 via iPhone
mark 一下
    143
pengfei   94 天前   ♥ 1






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

PS:上周有几个网址没有增加,下午或者明天会把它们加入到 适配列表。
    147
kenshin   90 天前
@treycheng #137

![Imgur]( )

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

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

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

只要是被适配的网址,用简悦看都不错 😃 😉
    154
kenshin   63 天前
@treycheng
我在 Telegram 上弄了个群,方便沟通~
地址 https://t.me/simpread
1  2  
DigitalOcean
关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   鸣谢   ·   1578 人在线   最高记录 3541   ·  
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.7.5 · 61ms · UTC 08:28 · PVG 16:28 · LAX 01:28 · JFK 04:28
♥ Do have faith in what you're doing.
沪ICP备16043287号-1