「ちょうど1年前に〜Safari5になった夜〜」なんてね、ちょうど1年前にSafariに「リーダー」という機能が搭載されました。リーダーとは、Webページから装飾や広告を取り除き、本文を読みやすく整形して表示するものです。この機能がついにこの秋に登場する「iOS 5」でも追加されるようですね。
その1年前にここでも電子書籍の話ついでにSafariのリーダーについてふれてみたり、iPadでリーダーと同等の表示にする手順を解説しています。

たった1年の間にこのような機能を採用しているアプリなども増え、Safariのリーダーの元になった「Readability」もさらに進化しました。あげくの果てにはOSの標準機能として、iPhoneやiPadでも使えるようになる、と。
そんなわけであらためて、このReadability(読みやすさ、みたいな)的なことに絡めたいろんな話を書いておこうかな、と思います。最後におまけでリーダーボタンの発生条件もちょろっとね。
まずは、Readabilityのおさらい
リーダーの元はArc90ってとこの「Readability」です。今となってはSafariだけではなく、KindleやiPadアプリの「Flipboard」「Reeder」にもそれがベースの機能が載っかってますね。

開発元もReadabilityをひとつのサービスとして運営しています。

こちらの本家ではブラウザやモバイルデバイスだけで読む、それをメールしたりするっていう元々あった機能に加えて、つい先週ぐらいからKindleにその内容を転送することもできるようになりました。
そもそもなんでArc90がReadabilityを開発しようと思ったかは、「いらん装飾や広告の存在で読みにくいWebサイトをもっと読みやすくするため」のようです(昔読んだページがないのですが、この辺に似たようなことが書いてあるかな)。
制作者や運営サイドの立場で考えれば、「よりキレイな見た目やデザインで」「広告も大事」ってのは理解できます。でも、閲覧する立場で考えると本文の内容が読みにくいサイトほどイライラするものはありません。
ホントにそれ要る?みたいないらん装飾のせいで表示に時間かかったり、本文の頭や文中に差し込まれる広告、画面の端でチカチカするバナー、どうですかね?
ま、そんなわけでWebサイトの閲覧者に普通にブラウザで見る以外にもうひとつ、「読みやすくして見る」という選択肢が与えられたってことです。
試しに見てみますか?この記事(iPhone/iPadでもいいすよ)。
Readabilityは、いろんなブラウザで使えるの
Readabilityは読みやすくするものですから、読み物系のコンテンツでその実力を発揮します。過去の記事で紹介しているBookmarkletで機能をオンにする方法以外に、現在はさまざまなブラウザに対応したプラグインが公開されています。

インストールするとブラウザ内のどこかにReadabilityを有効にするボタンがあらわれます。インストール後会員登録のページが出てきますけど、いろんな機能を使わず単に読みやすくするだけなら無償で利用できます。

サイトを表示した状態でReadabilityのボタンを押せばご覧のとおり。自分が読みたい画面のテイスト、文字の色、サイズ、本文の幅などに変更可能です。
Chromeなら「Readability Redux」って選択肢もありますね。

こちらは本家のように整形したページ(とそのURL)を作らずにそのまま重ねた状態で表示が可能です。
1年前のうちの記事にも書いてるようにiPadでも使えます。

Readabilityのブックマークレットを登録して呼び出してもいいですし、その記事にも書いてるQuixから「readability」と入力しても同じように表示されます。

画面内をタップすれば、テイストや文字サイズの変更、ソーシャルメディアで共有するためのボタンが表示されます。便利ですね。
閲覧側の選択肢が増えたよ、さぁどうする?
世の中やれスマートフォンだタブレットだ、と閲覧デバイスそのものの多様化が進んでいます。それと同時にこれまでのブラウザでの閲覧以外の選択肢としてSafariのリーダーやReadabilityが出てきました。
これまでもこのような閲覧方法の変化はありました。RSSリーダーや後で読む的なInstapaperやReaditLaterなんかがそうでしょう。RSSはちょっと違いますけど、後者はサイトから装飾や広告を取り除いてテキストだけを抽出して読めるようにしてくれます。

RSS自体基本テキストですしね。RSSリーダーの多くはテキストだけを見れるでしょうし、ReederにはReadabilityのボタンが搭載されてます。もちろん通常のサイトを見るための「Safariで開く」みたいなボタンはあります(笑)。

「後で読む」的なサービスであるInstapaperは、ボタン一つでテキストだけを抽出し保存してくれます。保存されたものには、スマートフォンやタブレットなどのデバイスでアクセス可能なだけでなく、Kindleにも送ることができます。

こちらはiPadアプリ版のInstapaperですね。
これらはこれまでリテラシーの高い層が好んで使っていたような機能でしょう。しかし、この秋に登場するiOS 5に同等の機能が載っかった際にどのような変化をするでしょうか?これまでそのようにWebサイトを閲覧できることに気付いてなかった層に伝わったとしたら…。
今回のiOS 5やLionには、このリーダーの機能以外に「後で読む」って機能も加わるそうで、Readabilityの開発者やInstapaperの開発者がそれぞれの思いをブログにアップしています。それぞれ別にそれに対して困るといった反応ではなく、むしろ「そういう機能に気付いた人たちはより高機能なものを求めるんじゃない?」「もっともっと突き進んじゃうよ」とかそんな反応みたいですね。
If Reading List gets widely adopted and millions of people start saving pages for later reading, a portion of those people will be interested in upgrading to a dedicated, deluxe app and service to serve their needs better. And they’ll quickly find Instapaper in the App Store.
これは楽観的な見方でしょうか? いや、彼らには先見の明があります(笑)。
1pxにこだわっても、それ意味ないかもよ?
このような閲覧スタイルの変化は、使うタイプのWebサイトにはあまり影響はなく、あくまでも読み物を主体としたWebサイトに限られるでしょう。しかし、サイトの制作者や運営サイドはこのような環境の変化(すべての人が変わるわけではないけど)をちゃんと受け止めていろいろ考える必要が出てきそうです。
最近Twitterでたまに目にしてた「Webデザイナーがこだわる1px」みたいな視覚表現のTipsを見て「んー」と…。ボクも一応デザインするのでその1pxのあるかないかで変わることはわかります。でも、こういうサイトの見方をされてしまったら、そのこだわりは意味を成しません(笑)。そもそも「Webデザイン」って見た目だけ作ることじゃないですから。
確かに、Webサイトを読みやすく、内容をわかりやすく伝えるためには、視覚表現が大事な要素のひとつになります。でも、過剰にこだわりすぎるのはどうでしょう? サイトの種類や内容、そもそものサイトの目的をちゃんと踏まえたうえで、必要とされる範囲内でこだわった方がいいですかね。
いくらこだわって作った見てくれであっても、自分が思っているほど他人には見えてない、伝わってない(評価されない)という現実も知っておきましょう(意味がわからなかったら脳科学・心理学的な本を読むことをお薦めします 笑)。

ソーシャルメディアを使ったどうしたこうした、スマートフォン向けの最適化、日本のIT系の中では面白いぐらいバズってる感がしますが、その先にあるのは結局コンテンツですからね。サイトを見てくれる閲覧者の目的は、何よりもそこに掲載されている内容であり情報であることが多いのではないでしょうか。
今回紹介したリーダーやReadabilityみたいな考え方とちょっと意味合いは異なりますが、世界的には「Responsive Web Design」や「Adaptive Web Design」といったことにも注目が集まっています。
変にちっちゃなとこばっかにこだわってないで、これからは多様化していくデバイス、そして閲覧方法、ありとあらゆることを想定しながらサイトを作っていく必要がありますね。伝えたい内容、閲覧者が必要とする情報、それらをうまく伝えることに注力した方がいろんな意味で結果的には良いのかな、と。
サイトを開いても何も見えないとかじゃ「人に教えたい」「共有したい」って気持ちすら湧きませんしね…。
大変な時代です(笑)。
最後におまけ、リーダーボタンの発生条件のヒント
ボクも商売なんでね、みなまで書くことはしません(笑)。
えっと、Safariのリーダーの機能はすべてのページで表示されるわけではありません。このボタンが発生する条件は、ある特定の条件を満たす時のみです(とりあえず今のOSのSafariでは)。
文書型がHTML5でなければならない、みたいなHTMLのバージョンの違いやページ中で使用している要素が何か特定のものでなければならない、とかではなく、「とある状態を満たした時だけ」ですね。ちなみにこのページは出るはず。これがヒント(笑)。
ま、当たってるかどうかはわかりませんが、何かの参考までに。
Tags: accessibiliy, ipad, readability, reader, safari, tips, webdesign
[...] サンプルePubを今なら無料でダウンロード(笑) [...]