レスポンシブなグリッドシステム

こんにちは! 生地通販の生地屋店長です。

iPhoneのようなスマートフォン、iPadのようなパッド、パソコンの3つのタイプの画面に、1つのサイトで対応しようと言うのが 「レスポンシブWebデザイン」(Responsiv Web design)です。

(近い将来登場するであろう スマートフォン パッド パソコン以外の、画面サイズにも 対応できます)

その中でも フレキシブル(レスポンシブ)なグリッド・システムを採用した下記サイトは、ウィンドウの幅を変えると それにつれて欄(グリッド)の並び方 大きさが可変します。(つまり いろいろなサイズの画面でも 閲覧できると言う事です)
テンプル大学のサイト

いろいろ調べたり 本を2~3冊読んだりしたのですが、どうも下記の本の方法が 良さそうです。(筆者は いくつものレスポンシブなサイトを 実際に構築された方のようです)
レスポンシブWebデザイン 製作と実践的ワークフローとテクニック

前2/3ほどは レスポンシブWebデザインの概念や考え方、製作のやりかたなどです。(これらも非常に参考になります) 「第6章レスポンシブWebデザインサイトを構築する」から 実際の製作になります。

これでサイトを構築していこうかと思ってます。(テンプレート(雛型)を使うので フレキシブル・グリッド・システムが 比較的簡単に作れそうでした) このような先進的な本にありがちな 理論だけ先行して 実際に構築してみると、レスポンスが非常に遅かったり かゆいところに手が届かない等の 不具合はなさそうですが、これから検証してみます。

感想や ご意見 質問等ございましたら、下の「Leave a reply」or「Reply」(空色のリンク)をクリックするか、黒字の「コメントを残す」の下の四角の空欄に書き込めます。お気軽にお書き込みくださいませ、お待ちしております。

レスポンシブなグリッドシステム」への1件のフィードバック

  1. ピンバック: パソコン、スマートフォン、パッドを1つのホームページで! | 生地屋のおやじの独り言

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください