アクセシビリティ重視のウェブ制作

チャコウェブ

株式会社CyberCats

受付時間:9:00~17:00(月曜日~金曜日)

中小企業のホームページ制作で事業の価値を引き出します。良いホームページの作り方や運営の方法、集客に役立つヒントをお届けします。

【ロジカルなデザインがお客様に確実な情報を伝えます】東京都港区 国際特許事務所ホームページ制作事例のご紹介

【ロジカルなデザインがお客様に確実な情報を伝えます】東京都港区 国際特許事務所ホームページ制作事例のご紹介

東京都港区にあります国際特許事務所ホームページ制作事例をご紹介します。

サイトはこちらからご覧ください。

・オリジナルデザイン制作
・スマートフォン / タブレット対応レスポンシブデザイン
・WordPress搭載
・常時SSL対応

今回の記事では、制作担当者がホームページ制作にあたり気を使った点についてご紹介します。

安定感のある見やすいデザイン

特許事務所のホームページ制作ですので、奇をてらったデザインではなく、きっちりとした雰囲気がお客様に伝わるよう安定感のある見やすいデザインを心がけました。

意外かと思われる方もいるかもしれませんが、デザインは右脳・センスだけで決めるものではなく、左脳・論理によってロジカルに決定させる部分があります。

ホームページで人間が見ている文字や写真・色は全て情報です。

その情報をお客様に伝わるようにするには
A.関係性の強い情報は近くに配置する。
B.見出しと本文の装飾にルールと設ける。
のような論理的な工夫が重要です。

以下にわかりやすいサンプルを用意しました。左側が上述のAB2つのロジックに従っていないもの、右側がロジックに従ったものです。
右側のデザインの方が、情報が瞬間的に判断できると思います。

左側が上述のAB2つのロジックを破ったもの、右側がロジックに従ったものです。

その他にも多くのルールが存在しますが、ここでは重要な2点に絞りました。

このように論理的なデザインを意識することで、お客様に確実に情報が伝わるホームページにすることができます。

そのようなロジカルなデザインに、ロジカルではない遊び心としてページ下部にイレギュラーな斜めのレイアウトを入れています。一輪の花を咲かすように、安定感の中にも少しの変化で彩を加えています。

安定感の中にも少し変化を出しています。

 

 

ポップアップの拡大表示

弁理士プロフィールページでは、一覧紹介ページからポップアップの拡大表示で同じページでプロフィールの詳細が見えるようにしました。

ポップアップを閉じたらすぐに一覧に戻れるようにしてあります。

ポップアップを閉じたらすぐに一覧に戻れるようにしてあります。

・クリックして別ページへ移動
・同じページ内に全員分のプロフィールを書いた長いスクロールページ
にしてしまうと、「クリック移動」や「ページ内スクロール移動」といったアクションが生まれてしまいます。

ブログ記事のように、1つの記事ページをじっくり読ませる場合はページで分けたほうがお客様にとっては優しい作りです。しかし、たくさんの情報を一気にすばやく見たい場合は、なるべくページ移動をしない作りのほうがお客様の手間が省けるでしょう。

 

まとめ

オリジナルデザインコースでの制作事例をご紹介し、制作担当者が、ホームページ制作にあたり気を使った点についてご紹介してきました。

・デザインは感覚センスだけに頼らず、論理的にも構築し、お客様に情報を間違いなく確実に届ける。
・お客様が短時間で探している情報が手に入るよう、お客様の手間が省かれる工夫をする。

当ブログでも繰り返しお伝えしてきましたが、ホームページに訪れるお客様像をイメージしながら、デザインをすることが大切です。

またお客様像をイメージする際には、誰に向けてホームページを発信するのか、具体的にイメージしてみるとより効果があがると思います。

誰に向けてホームページを発信するのか「ペルソナ」について過去の記事でご紹介しましたので、ぜひそちらも参考になさってください。


          この記事を書いた人        
タク制作部長
株式会社Cyber Cats 制作部長。2011年よりWebサイト制作業界に入り、日々デザインとにらめっこしています。 美しい文字組みに関心があり、どうしたら相手に伝わるデザインができるか切磋琢磨する日々です。 奇抜な料理とロック好き。
詳しいプロフィールはこちらから
SNSでフォローする