ずっと過去記事をどうやって効率よく見せるか(自分自身が効率よく読むか)ばかり考えている。一つ前の記事では絞り込み UI について書いた。
ブログというものが生まれたとき、誰も 10 年以上にわたってインターネットに文章を書くことを考えていなかったと思う。多くの人は途中で脱落してブログを止めたり飽きてほかのところ( Facebook や Twitter )に移ったりしただろう。ただ、同じ場所でしぶとく書き続けている人たちもいる。自分もその一人だ。
そういう人たちにとって、過去に自分が書いた記事をどうやって閲覧するかというのは大きな問題だ。過去記事を探すのに本文込みの一覧ページをページネーションしていくのはあまりにも効率が悪すぎる。一覧でガッと見たい。
というわけで、インターネット老人にしか用のない機能かもしれないが、過去記事一覧ページの UI/UX は非常に大きなテーマだと思う。問題点と対策を整理してみた。

過去記事が溜まることの問題点は、過去記事が探しづらくなることだ。対策としては各記事に関連記事へのリンクを表示する方法と過去記事の一覧ページを用意して探しやすくすることがあると思う。
過去記事の一覧ページは以下を満たしていて欲しい。
- 記事を一覧できること
- 一覧性が重要なのでページネーション、本文は不要
- 記事の作成日(公開日)順に並んでいて欲しい
- 記事を絞り込めること
- 年やカテゴリーで絞り込めるとよい
- 件数がわかること
- どの時期にどの密度でブログを書いていたかがわかるため
10 年以上続いてるブログを書いてる人たちは多かれ少なかれ同じような問題(過去記事へのアクセシビリティ)を抱えているはずで、他の人たちがどうやっているのかを調べてみた。以下は長く続いているブログの Archive ページ。
Hail2u
ながしまきょうさんのブログ。

ブログのトップ自体が過去記事インデックス(タイトルのみ)になってる。本文を含む記事一覧ページはない。静的に生成してあって速い。絞り込むような UI はない。
氾濫原
関連記事のアルゴリズムやデザインなどを結構パクらせてもらっている cho45 さんのブログ。

本文込みの一覧ページとは別に年がずらっと並んでいる。記事の一覧はない。クリックすると年月ごとの記事一覧(本文込み)が表示される。記事を書いた時期を覚えておく必要がある。
Daring Fireball
Markdown の生みの親、 Apple ブロガー John Gruber のブログ。

本文込みの一覧ページとは別に年月ごとにグルーピングされた記事一覧(タイトルのみ)がある。このブログの Archives ページの UI に近い。検索窓があるが、 DuckDuckGo のサイト内検索に飛ばされる。スマートフォン用の画面がなく非常に見づらい。
hitode909の日記
hitode909 さんのブログ(はてなブログ)。

本文込みの一覧ページとは別に、本文が短く表示される過去記事一覧ページがあるが、一覧性は高くない(ページネーションが必要)。グローバルフッターに年月ごとの記事一覧へのリンクがあるほか、サイドバーにもカレンダー式のアーカイブ導線がある。「月別アーカイブ」は年をクリックすると月別のアーカイブ一覧が展開表示される。デフォルトだと今年(最新年)が展開表示されている。年・月・カテゴリーそれぞれの記事数がわかるのは便利だと思う。
Tatsuhiko Miyagawa's Blog
Blog Hacks の著者 miyagawa さんのブログ( Medium )。 Bulknews 時代からの過去記事がいっぱいあるはずだけど現在は 2011 年分からしか公開されていないみたいだった。

タイトルのみの記事一覧ページはなく、一覧性は高くない。本文込みの一覧ページの上部に、年ごとの絞り込み UI が表示されている。年を選択すると月ごとの絞り込みができる。はてなブログに近い。

Medium が酷いのはこのアーカイブページへの導線で、トップページには最近の記事が数件表示されるだけで、過去記事への導線はページ下部に申し訳程度に置いてあるのみ。しかも Medium というサービスの利用規約ページへのリンクと並んでいるので存在に気がつきにくい。

先日の記事( 蟻地獄と個人ブログ - portal shit! )では Medium はまとも陣営に分類したけど、個人のブログ内で回遊することを極力できないようにしようとしているのが伝わってくる。蟻地獄感ある。
Island Life
『ハッカーと画家』などポール・グレアム本の翻訳もされている shiro さんのブログ。

本文込みの一覧ページとは別に、本文が短く表示される過去記事一覧ページがある。年による絞り込みがあり、少し前のこのブログの Archives ページに近いが、 2002 年から記事があるので年のリンクが 19 個ある。 10 年後、 20 年後のことを考えると UI 上の問題が発生しそうだ。
portal shit!
最後にこのブログ。

本文込みの一覧ページとは別に年月ごとにグルーピングされた記事一覧(タイトル、カテゴリー、日付が表示)がある。年やカテゴリーによる絞り込みができる。
考察
Hail2u 、 Daring Fireball 、 Island Life など記事のタイトル一覧が表示されるタイプが好みだ。 Medium の一覧性のなさは最悪だが、年月の絞り込み UI はおしゃれだと思った。
個人的にはこのブログの Archives ページが一番使いやすい。自分で作っているので当たり前だ。スマートフォンでの閲覧性も問題ない。記事一覧の状態で本文で絞り込めるやつがあれば完璧なので、少ししたらチャレンジしてみたい。