会社の紹介などのイメージしたサンプルです。ニュースなどを伝えるページや会社概要等ある程度のページ数を想定してレイアウトしております。
スマートフォンとパソコンで統一したデザインで統一感があります。またメニューの構成は、近年公共団体などがこのようなメニューを採用することが多く、幅広い世代に受け入れられやすいメニューとなっております。
サンプルでは、中規模な会社を想定しメニューも階層化せずわかりやすく構成しましたが、メニューを増やすことも臨機応変に対応でき、大規模な会社にも対応しております。
メニューは全てCSSで構成し、画像は使用しておりません。会社や部署のイメージに合わせて色を変えることも可能です。
メニューを常時下に表示しており、ページ移動が判りやすく作られております。ページを見た人が迷わない構成となっております。
基本的には1枚のページで、特に説明したい部分を別ページという構成になっているため、非常にシンプルなページとなっております。
そのため、小さな会社などに適したデザインとも言えます。勿論、メニューは階層化して拡張することも可能ですので、コンテンツが増えてきたらそのままページを増やしていくことも可能です。
こちらは、メニュー以外は全く内容が同じの2サイトとなります。メニューと上側に表示するサイトと、左側に表示するサイトとなります。内容は同じでも見た目や印象が大きく変わることがわかります。
メニューは階層化することができ、小規模から大規模なサイトまで対応可能となっています。
パソコン、スマートフォン等で最適な表示が行われるレスポンシブデザインとなっております。スマートフォン等で閲覧する際はメニューが折りたたまれコンテンツの表示部分を広く取ります。
デザイン会社のサンプルとして、シンプルな会社のデザインを作成しました。会社としては最低限の情報ですが、基本的な更新はメニューに組み込んだ外部blogを参照し、ユーザーの方に更新しやすくすることをイメージしております。
請け負った仕事の結果をWebに乗せるのはなかなか難しいのですが、そのようなデータが集まってきた場合はworksページを増強するイメージで考えております。
パソコン、スマートフォン等で最適な表示が行われるレスポンシブデザインとなっております。パソコンで見るページとデザインは異なるのですが、同じ会社のデザインであるということを感じ取れるレイアウトを意識して制作しました。