Vol.4 実録!レスポンシブWebデザイン シンプル&ハイクオリティーのサイトで学ぶ
上のサイトを見てほしい。シンプルだが、なかなか洗練された秀逸なサイトのトップ画面である。【ここから】実際に見ることができる。
このサイトはレスポンシブWebデザインであるのが分かるだろうか。レスポンシブWebデザインとは、アクセスした人のデバイス(実際は画面サイズ)によって、自動的にレイアウトが切り替わるデザインであり近年、注目を集めているWebデザインの手法の一つだ。
実はこのサイト、TRIAINAが用意した「レスポンシブWebデザイン講座」のためのオリジナルサイトであり、シンプルで初歩的なコードで構成されている。レスポンシブWebデザインに敷居の高さを感じている皆様に、少しずつだが今後、その手法をTRIAINA流に伝授していければと思い、独自に作成したサイトだ。
スマホで見てみると……
シンプルだが非常に見やすく、スタイリッシュな印象を受けるのではないだろうか。しかしこのサイト、レスポンシブWebの総仕上げである「フリードグリッド」への変換がまだの、いわば未完成の状態。いきなりハードルの高いサイトを提示されては、戦意喪失してしまうもの。だから最初はこのシンプルなサイトを作成していき、最後に「フリードグリッド」への変換を行い完成する。サイト完成後は、様々なカスタマイズを順々に施していき、次に下層ページのデザインに取り掛かりたい。そして、WordPressを導入して、自分だけのオリジナルブログサイトを作成していく。そこにアフィリエイトを組み入れ、SEOを駆使して、検索上位に踊る出るまでを、皆様と共に歩んでいけたらと切望する。
レスポンシブWebデザインの〝真の極意〟はTRIAINAにあり!次回に期待せよ!