スポンサーリンク
スポンサーリンク
Contents
デザインの観察
TOPページ以外で共通のデザイン
ヘッダー、ナビゲーション、背景、フッターはトップページ以外のページで共通のデザインになっています。サイト全体で同じレイアウトにすることで、統一感があって使い方も覚えやすくなります。
フッターには海の写真が使用されており、おおたにさんのWebページらしさが出ています。親しみを感じやすい画像がひとつあるだけでほっとします。
カーニング調整されたナビゲーション
ナビゲーションはメニューによってカーニングで微調整されていました。
「外来医師担当表」「採用情報」のように漢字のメニューは字間を広めに、「スタッフブログ」といったカタカナのメニューは字間を狭めに設定されていました。要素に合わせてカーニングすることで、窮屈さやユルさといった違和感を感じることのないバランスの良いメニューになっています。
白と青を基調とした配色
トップページは白と紺の2色が主でしたが、子ページには背景色として淡い青色が使われています。はっきりした色の白と紺にトーンの淡い青色が加わることで、パリッとした配色からやわらかさ、さわやかさを感じる配色になりました。
安定感と真面目さを感じるコンテンツのレイアウト
コンテンツは同じデザインを基本としたボックスが並んでいて、デザインの4大原則「整列、近接、反復、強調」が上手く利用されています。グリッドに沿って並んでいて、統一されたデザインで安定感があります。複数の要素がきちんと整列しているため真面目さも感じられるレイアウトになっています。
コンテンツに見られたひと工夫
コンテンツのボックスですが、上辺に紺色の細いラインが入っています。これがあるのとないのとでは驚くほどイメージが違います。ラインが無いデザインではどこかのっぺりとして締まりのない印象ですが、一本の細いラインを入れるだけでメリハリがついて引き締まりました。あえて四方を囲まない「引き算」を感じるデザインに感動しました。
最後に
今回は、島の病院おおたにさんの「診療科ページ」をトレースしてみました。
島の印象を残しつつ、安定感とまじめさを感じるデザインが素敵でした。
個人的に衝撃を受けたコンテンツの一工夫に「神は細部に宿る」という言葉を思い浮かべました。2回のトレースからたくさん学ばせて頂きました。ありがとうございました。
島の印象を残しつつ、安定感とまじめさを感じるデザインが素敵でした。
個人的に衝撃を受けたコンテンツの一工夫に「神は細部に宿る」という言葉を思い浮かべました。2回のトレースからたくさん学ばせて頂きました。ありがとうございました。
▼トップページのトレース記事
スポンサーリンク
スポンサーリンク
独学の流れとデザインの独学方法についての薄い本を作りました。
2021年2月27日より、改訂版の紙の本を発売しています。
2021年2月27日より、改訂版の紙の本を発売しています。
