第3回webのひみつ(ホームページ考察01)

皆さんこんにちは。
インターンシップ生の明瀨と申します。

今回は前回、予告していた当社のデザインを取り上げて、見ていきたいと思います。
(当社ホームページ)
https://mba-international.jp/
(参考HPレイアウト)
該当するファイルがありません。

(参考URL)
https://liginc.co.jp/designer/archives/6154

こちらの画像と比較をすると主に基本的なリキッドレイアウトのような構成がメインになっていると私は感じました。
しかし、実際に閲覧してみるとわかりますが、まだレスポンシブルwebデザインにはなっておらずPCサイズの決まった形のみでの閲覧となっているため、こちらを携帯対応させるために表記の記述をリキッドレイアウトのように%での画面表記をしていくことで携帯での見やすい画面表記にしていくことが出来ると思います。
また、メインコンテンツの方にはスライドのアニメーションを入れることによって多くのコンテンツを見やすくしている工夫の部分が良いと思っていました。
このようにレスポンシブルwebデザインになっていなくてもリキッドレイアウトのような表記をしていくことやアニメーションを入れる際のコンテンツの見やすく多くを見せていくことが大事だと感じるレイアウトだと思いました。
こちらのレイアウトだと今後携帯対応にもしやすい形になっているため今後のHPの変化が楽しみに感じています。

次に、可変グリッドの参考となるようなHPを取り上げましたので下記に載せます。
(参考HPのURL)
https://www.booking.com/index.html?aid=865885&label=affnetneverbluers-index-1_pub-20004_site-cagyr5b6a478937e69401646951_pname-307400_clkid-HO__18850__102012a02322f65ef618a9fdb9a706&utm_medium=affnet&utm_source=affnetneverbluers&utm_campaign=row&utm_term=index-1

上記のサイトのレイアウトは可変グリッドレイアウトのような形となっているため後からデータを追加していく際にどんどんと下に追加していける形だと感じました。
また、ここのサイトは宿泊予約サイトなのでこのような、色々と場所などを素早く多くチェックできるサイトを構築する際には可変グリッドレイアウトにしていくことがわかりやすく閲覧者に良いレイアウトだと感じます。
こちらは、買い物サイトなどでも有効ですね。

今回はこの2つを持ちましてHPの参考を終わりにしたいと思います。
次回の予告は、今回は第1回webのHPをしましたので、第二回は良いHPが見つかるまでは保留にし、次回は中身について良く曖昧になりそうな部分をまとめていきたいなと思います。
閲覧ありがとうございました。良ければまた見てください(‘ω’)>

興味を持たれた方はお気軽にお問い合わせください。

インターンシップへの申し込み・お問い合わせ先

インターンシップへの申し込み・お問い合わせ先
メールでのお問い合わせは、下記フォームに入力して送信してください。
ご氏名 (例)山田 太郎
メールアドレス 半角英数字:ご入力間違いのないようにご注意ください
メールアドレス(確認用) 半角英数字:ご入力間違いのないようにご注意ください
電話番号 (例)0354339211 ※ハイフン抜きで入力してください
題名
お問合わせ内容

アーカイブ

カテゴリー