検索エンジンとユーザーのための“情報アーキテクチャ”を学んでみよう from SES San Francisco 2011

[レベル:中級]

SES San Francisco 2011レポートの第一弾です。

ピックアップするセッションは、『Information Architecture for Modern Websites by Shari Thurow』です。

「現代のウェブサイトにおける情報アーキテクチャ(以下、IA)」というタイトルで、この分野では名の通っているシャリさんのソロプレゼンテーションになります。

ユーザーや検索エンジンにやさしい、情報に基づいたサイト設計の重要点が学べるセッションです。

では行きます。

●IAは、ウェブサイトを使いやすくする。

●IAは、ウェブサイトのコンテンツを見つけやすくする。

●IAが重要な理由
・顧客が迷子になる ― 求めるコンテンツを見つけられない顧客は迷う。
・ブランド価値を傷つける ― 求めるコンテンツを見つけられないユーザーは戻ってこない(例:“united.com faq”で検索して1位に出てくるユナイテッド・エアーのページはFAQのページではないというギャップが発生)。
・デザイン/開発のコストを抑える ― ファインダビリティや拡張性を考慮せずに、後になってからの再デザインはコストがかる。
・重複コンテンツの防止 ― 回避策のコストを下げる。
・メンテナンス ― 新しいコンテンツを置く場所、古いコンテンツをアーカイブする場所が分かる。
・ウェブサイトのファインダビリティ ― IAは検索者と検索エンジンの“アバウト性”を繋いでくれる。

●「設計 ⇒ デザイン ⇒ 開発」の順で進める

●IAは、クローラビリティ/インデクセーション/ランキングにも影響する。

●IAは、検索結果での見た目にも影響する。

●IAで考慮すべき点
1. ユーザーが検索する言葉をコンテンツに含める
2. 検索者と検索エンジンの両方にがコンテンツにアクセスしやすくする。サイトのアーキテクチャは「情報アーキテクチャ」と「技術的アーキテクチャ」で構成される。
3. リンクポピュラリティ(※鈴木注:PageRankと考えてください)とクリックによるアクセスを増やすために第三者のサイトからリンクを集める。
4. 検索者の目的と行動の受け皿になる。以下の3つの検索パターンを踏まえる。
・Navigational(ナビゲーショナル:案内型)
・Informational(インフォメーショナル:情報収集型)
・Transactional(トランザクショナル:取り引き型)
※鈴木注;3つの検索タイプについてはこちらの記事を参照。

●IAの基本
・カテゴリ分け
・分類化
・ラベル付け
・優先付け

●上の4つの基本に基づいたナビゲーションとは
・グローバルナビゲーション
・ローカルナビゲーション
・補助ナビゲーション(コンテンツ内からの別ページへのリンク)
・見出しやタイトルからのリンク

●ブログのカテゴリの最適化
テーマごと/年月ごとにまとめるといいが、テーマのカテゴリが先に見えるようにページの上に配置する。なぜなら年月を基準にしてユーザーがコンテンツを閲覧することは少ないから(鈴木注:Matt Cuttsのブログがそうなっているとを例に出してました)。
テーマはユーザーにとって意味のあるように分ける。

●コンテンツは次のように分類できる
・目的/プロセス
・トピック/題目
・対象となる閲覧者
・タイプ
・アルファべティカル(鈴木注:日本語なら50音順)
・時系列
・空間的/地理的
・属性/ファセット(鈴木注:“facets”がうまく訳せません)

●どのようにIAを決定するか
1. ユーザーからのフィードバック ⇒ ユーザビリティ
・フィールドインタビュー
・観察
・ペルソナや状況設定を利用
・ユーザビリティ テスト
2. 解析 ⇒ データを収集する補助的な手段
・ウェブサイト
・サイト内検索
・キーワード

●ラベル付けは、そのページやセクション何について書かれているのかを表していなければならない。たとえば、見出しや小見出し、関連記事が該当する。
記事中からの別ページへのリンクもラベル付に相当する。

●ブログのタイトルや見出しには、可能なら必ず重要なキーワードを含めるようにする。

●ブログの見出し(記事タイトル)はツイッターなどのソーシャルメディアにも現れる。

●ブログでは、補助的なナビゲーションとして過去や未来の記事へもテキストでリンクする。

●「親 ⇒ 子(例:カテゴリ ⇒ 個別ページ)」への一般的な縦方向リンクに加えて、「子 ⇒ 子」への同レベルの水平リンクも使う。
※鈴木注:僕たちとっては、たとえばブログの記事を書いていて、そのなかに関連する項目があれば該当する記事へ内部リンクを張るのが当たり前です(この一文が例になっていますね)。でも、同じSESに参加されていた渡辺さんとこの件で話したら、一般サイトではこれをやっていないことが多いんだそうです。
ある製品の新バージョンが出たら旧バージョンのページにその新バージョンのページへのリンクを追加するとか、ECサイトなら関連アイテムへのリンクを設置するとか、そういうのも水平リンクに相当します。SEOを考えるとこのタイプのリンクは当然やるべき施策ですが、IAにおいても重要ということになります。

●すべてのナビゲーションは次のようにする。
・ユニーク
・見分けがつくように
・パッと見で分かるように
・理解できるように

●マウスカーソルを当てないとリンクと気付かないようなデザインは使わない。これが好きなのはプログラマと子供だけ。
※鈴木注:Minesweepingと呼んでましたが、ようはユーザーにどこにあるのか探させるようなデザインはNGということですね。

●ナビゲーションの数は多すぎても少なすぎてもいけない。

●検索エンジンフレンドリーなUGC
・トレーニングしたモデレータ/投稿者をスタッフに加える。
・投稿者/モデレータのページを丁寧に作って適宜修正する。
・上手な投稿例を掲載する。
・サポートマテリアルを提供する。
・活躍してくれる(かつ絶えず投稿してくれる)投稿者に褒賞を与える。
・スパムや不適切な投稿がないか監視する。

●スピーカーではなく、渡辺さんの役に立つツイート3つ紹介。

IA for SEOの基本は、人間が情報を探す単位・探しやすい単位で分類してあげて、それを整理してあげること。人にとって探しやすいサイトは、基本的には検索エンジンにとっても探しやすい。

だから、まずユーザーがどんな「単位」で情報を探しているのか、consumer behaviorを理解して、IAの全体デザインを考えてからページ、カテゴリ単位をどう配置・関連づけるかをやっていくと。

もともと私はユーザビリティを勉強してきたからどんな風なIAが適切なのか、たくさんのケーススタディ見てきて学んだけど、SEOのIA下手な人は世間でいう「よいサイト」をたくさん見て感覚的に学ぶことも必要だと個人的には思います

プレゼンで使用したスライドには図や実例のキャプチャもあったのですが、このレポートは文字だけになってしまいました。
それでも、情報アーキテクチャの重要ポイントをたくさん学ぶことができたはずです。

大規模サイトになればなるほど、後からの構成変更は手間もコストもかかります。
サイト作成の最初に来るのが情報アーキテクチャの設計になります。

ですが、「情報アーキテクチャ」は何も大規模サイトだけに当てはまる概念ではありません。
僕のようなブログ運営者にとっても実践すべき点がたくさんありました。

今後のサイト作成の参考にしましょう。