Webサイトの「断捨離」における4つのステップ

三上 陽平

コーポレートサイトのWebマスター、ECサイトの店長、ECパッケージベンダーのディレクターなどを経て、現職へ。IAに基づくWebエンジニアリングを追求する毎日を送っています。海外ドラマ鑑賞、NBA観戦、ゲーム好き。

「ミニマリスト」は、2015年の新語・流行語大賞の候補になりました。「断捨離」をしてモノを持たずに、シンプルな生活をするのが流行のようです。

では、Webサイトではいかがでしょうか。情報が過多になっているサイトが多いように思います。

私の経験から、多数のサイトを運営している企業では、コーポレートサイト、ECサイト、ブランディングサイトで、各サイトの担当者が異なるため情報の整理ができていないケースが散見されます。

このように情報が整理できない状態が続くと情報が重複し、過多になり、ユーザーを混乱させてしまうだけではなく、最悪の場合サイトの離脱に繋がりかねません。

企業の事情にもより実現は難しいかもしれませんが、サイトのリニューアルなどを機会があれば、Webサイトにおける情報の「断捨離」をしてはいかがでしょうか。とはいうものの、簡単に「断捨離」ができない場合があると思います。それは、往々にして情報の整理の方法がわからないため、放置していることが原因であることが多いです。

今回は、私が以前コーポレートサイトと、ECサイトの統合のプロジェクトで実践した整理の手法が、クライアントにも好評でしたので、情報の整理の方法を簡単に4つのステップにまとめてご紹介させていただきます。

Webサイトにおける「断捨離」のススメ

Step.1 最小単位の要素に切り出す

まず情報を最小単位の要素として、細かく切り出します。コンテンツのテキスト、見出し、画像、ボタン、テキストリンク、バナーなどを最小の要素とします。

ポイント
Webサイト画面をキャプチャーして、要素を丸で囲うなどすると整理しやすいです。

Step.2 ラベリング

上記の要素を改めて、正しいラベリングできているか再検討します。ラベリングは、ユーザーにわかりやすいようにすることが大切です。

特に表記ゆれや、細かいニュアンスを統一すると、ユーザーにとってわかりやすいサイトに近づけます。

ポイント
お問い合わせ、お問合せなどの送り仮名や、配送、配達などのシソーラス(類語)の統一をします。配信するメールマガジンで使用する文言もサイトと同じルールに則って表記を統一します。また、ここで重複する情報は、ばっさりと切り落とすことも忘れずに!

Step.3 グルーピング

上記でラベリングした要素を、カテゴリーやサービス単位などでグループにまとめます。

ポイント
どのようなグループを作るかは、ログ解析して仮説を立てた上で作成します。

Step.4 ゾーニング

最後にグルーピングされた情報を重要度に応じて、画面上に配置して行きます。

ポイント
こちらも仮説を立てて配置するのが一番最適か検討することがお勧めします。できれば、案を2つ用意にしてA-Bテストをするといいでしょう。

いかがでしょうか。このように情報を整理すると、必然と不要な情報が浮き彫りになり、つまり「断捨離」に繋がります。

ただ闇雲に情報を整理しよう! と始めるのではなく、たった4つのステップを踏むだけで論理的に情報が整理することが可能になるのではないでしょうか。

と、ここまで書いて、私の机の上が大変になっていることに気づいたので、「断捨離」をしたいと思います。


Welcome to UX MILK

UX MILKはより良いサービスやプロダクトを作りたい人のためのメディアです。

このサイトについて