西村あさひ法律事務所
こんにちは。早速第一弾です。
サイトについて
日本の「四大法律事務所」の1つであり、日本最大の法律事務所のコーポレートサイト。UI設計、グラフィックデザイン、サイト構造、リッチコンテンツ... どれをとってもハイクオリティで、色々な事を学び取る事が出来そうです。
UI、トーン＆マナー、サイト設計について
- 日本語＆英語を表記させている
- 渉外事務所なので、海外からの利用者も多い事を想定し、グローバルメニューや見出しに英語表記が施されている。また、Englishページも用意してある
- グローバルナビゲーションのカレント表示
- トップページでは、カレント表示が不必要だが、下層ページでは 必要になる。その区別のため、下層ページではカレントすると濃い緑色が表示されるデザインが施されている。
- トピックスはタブで切り替え
- 各コンテンツの更新性が高いため、トップページでは非同期通信のタブ切り替えで更新内容を確認出来る様になっている
- 下層ページでは、各コンテンツ名が大見出しになる
- 各ページごとに大見出しを用意するのは、文書構造的にも間違いではないが、ロゴを大見出しにするなどやり方は色々とある
- 見出し要素に有効なナビゲート機能をつける
- ローカルナビゲーションの見出しにはカテゴリトップへのリンクがあるなくてもいいが、あるとより親切だと思う
- 更新性の高い見出しやリストはテキストにしている
- テキスト情報にする事で、画像を作成する必要がなくなり、更新性・運用性共に手間が減少する英語表記に関してはTahomaを使用している
- 表示する情報量を一定に保っている
- 「業務分野」などでは、各情報の項目を3つまでに限定し、それ以降はjavascriptによるギミックで表示させている多大な情報を少なく見せる手段としては有効だと思う
- お問い合わせへの導線
- 各カテゴリでニーズが高いと思われるお問い合わせ内容を提示している
- FLASHムービーの使用
- 「事務所について」では、事務所内の雰囲気をより明確に伝えるためFLASHムービーでスライドショーを展開している視覚的情報で伝えたい事を有効に生かしている
- 意味のある見出し、ボタンのデザイン
- 各カテゴリの大見出しには写真が利用されていたり、ボタンなどのグラフィックには、リンク先の内容を視覚的に内容を想起させるデザインが施されている
また、正しい文書構造をデザインに反映させている 例えば見出しレベルによって、適した概要が明記してあったり、タイトルを太字にして、その説明との視覚的な差異を出したり、入れ子になっているリストはインデントされていたりなど - 各ページからの導線設計
- あらかじめペルソナなどの仮想ユーザーを作り、各カテゴリ内でユーザーがどのような行動を取り、どこに辿り着いたらゴールかを想定しているため、各々のページに必要な導線がリンクとして用意されている
- 検索結果での対処
- ヒットするページがない場合は、対処方法が明記される
- 404での対処
- 存在しないページがある場合は、404ページが用意されている
以上になります。
