当サイトのリンクには商品・サービスのPRを含む場合があります。

Google Chromeでリーダーモードを実現する拡張機能「Reader View」

【広告】 Parallelsお買い得情報

macOS 15 Sequoia対応の【Parallels Desktop 20】10月6日まで10%オフ。
クーポンコード:GU7-396-UWJ
MacでWindowsを使えるソフトウェア【Parallels】

「Google Chrome Web Store」アイコン
更新日:2021年04月17日

投稿日:2021年01月12日
この記事は約5分で読めます。

Google ChromeでWebページをPDF保存・印刷するときに、広告やバナーなどを除去できる拡張機能の紹介です。

似た機能として広告除去の拡張機能がよく使われますが、このページで紹介するのは「リーダーモード」を実現する拡張機能です。

このページは、以下の方向けに書いています。
スマホやタブレットではなく、Windows/Mac/Linuxのパソコンユーザーが対象です。
(スマホやタブレットでは、Chromeの拡張機能が使えないため)

  • WebページをPDFに保存や印刷するときに、広告やサイドバーを除去したい人
  • 広告除去のChrome拡張機能は、はJavaScriptで不具合が起きることがあるので、あまり使いたくない人
  • SafariやMicrosoft Edgeの「リーダーモード」のような機能を、Google Chromeでも使いたい人
スポンサーリンク

「リーダーモード」って何?という人へ、簡単な説明をします

「リーダーモード」がどんなものかわかっている方は、この部分は飛ばしてもらって大丈夫です。

わかってない方向けがイメージが湧きやすくなるように、具体例を2つあげます。

Webブラウザの標準機能として「リーダーモード」が使える場合

ここでは、最もわかりやすい例として、iPhoneのSafariで説明します。

以下の①の画像はSafariの通常表示モードですが、トップバナー・SNS用ボタン・広告といった部分も含めて表示されています。

②の画像では、Safariのメニューから「リーダー表示を表示」を選択しています。

最後の③の画像では、①で表示されていたトップバナー・SNS用ボタン・広告といった部分が消えて、スッキリとした表示になっています。

① 通常表示モード

iPhoneのSafariでWeb表示中の画面

② モードを切り替える

iPhoneのSafariでWeb表示中の画面

③ リーダー表示(リーダーモード)

iPhoneのSafariでWeb表示中の画面

 

 

Webサイトの機能として「リーダーモード」が使える場合

これは、すべてのサイトで使えるわけではありませんが、IT系のニュースサイトなどで「印刷」ボタンが用意されている場合があります。

具体例ですが、以下の図は「日経クロストレンド」というニュースサイトの画面です。

矢印が指し示している部分に「印刷」ボタンが付いていて、これをクリックすると「リーダーモード」同等の表示に切り替わります。

macOS用SafariでWebページを表示中

以下は、「印刷」ボタンをクリック後の画面です。

最初に表示されていたトップバナー・SNS用ボタン・広告・サイドバーといった部分が消えて、スッキリとした表示になっています。

macOS用SafariでWebページを表示中

 

スポンサーリンク

実は、隠し機能でGoogle Chromeには「リーダーモード」がある

Google Chromeでリーダモードを使う方法
Fossbytesは7月6日(米国時間)、Google Chromeでリーダモードを有効にする方法を紹介した。Google Chrome 75にはリーダモードが搭載されているが、デフォルトでは無効にな...

上記のニュースサイトで紹介していますが、Google Chromeの設定を変更すると、「リーダーモード」が使えるようになります。

しかし、まだ一般公開されてないベータ版的な機能のため、モード切り替えができなかったり、表示が崩れたりといった不具合が起きる場合があります。

 

スポンサーリンク

拡張機能「Reader View」の基本的な使い方を紹介

インストール方法

拡張機能は、以下のリンク先からインストールできます。

https://chrome.google.com/webstore/detail/reader-view/ecabifbgmdmgdllomnfinbmaellmclnh/related

「リーダービューモード」の切り替え方

Google Chromeのアドレスバーの横の拡張機能ボタンの中から、「Reader View」ボタンをクリックすると、「リーダービューモード」と「通常表示モード」の切り替えができます。

まず、「通常表示モード」です。

Google Chromeで「Reader View」ボタンをクリック

 

次に、「リーダービューモード」です。

これでPDF保存したり印刷すると、画面のイメージのままで出力できます。

また、左側に表示されているボタンについては、このあと説明します。

Google Chromeで「Reader View」ボタンをクリックして、「リーダービューモード」に切り替わったところ

 

各種ボタンの説明

ボタンに①〜⑩まで番号振って、このあと説明します。

Google Chromeで「Reader View」ボタンをクリックして、「リーダービューモード」に切り替わったところ

  • ① 「リーダービュー」を終了
    • 「リーダービュー」から「通常表示モード」に切り替わります。
  • ② 表示オプション
    • フォントの種類や大きさ、行間ありなし、背景色の選択ができます。
    • Google Chromeで「Reader View」ボタンをクリックして、「リーダービューモード」に切り替わったところ
  • ③ 印刷
    • 印刷画面が表示されます。PDF保存または印刷ができます。
  • ④ メール
    • テキスト部分のみ抽出して、標準設定されたメールアプリが起動します。
  • ⑤ 保存
    • テキスト部分のみ抽出して、html形式で保存できます。
  • ⑥ 全画面表示
    • 全画面表示に切り替わります。
  • ⑦編集モード切り替え
    • マイクロソフト・ワードのように、内容編集ができます。不要な部分を削除したり、何か追加で記載することができます。
  • ⑧テキスト読み上げ
    • テキスト部分を機械音声で読み上げます。日本語もあります。
    • Google Chromeで「Reader View」ボタンをクリックして、「リーダービューモード」に切り替わったところ
  • ⑨ 画像オプション
    • 画像部分の拡大・縮小、表示・非表示の切り替えができます。
    • Google Chromeで「Reader View」ボタンをクリックして、「リーダービューモード」に切り替わったところ
  • ⑩ ハイライトボタン
    • ⑦で編集モード切替時に、ハイライト(黄色のマーカーを引く)ができます。

 

このページの記事は、ここまでです。

コメント

PHP Code Snippets Powered By : XYZScripts.com
タイトルとURLをコピーしました