「レスポンシブWebデザイン」で、レイアウトを自在に操るための最新技法を身につける！
PCだけでなくスマートフォンやタブレットなど多様なデバイスに対応することが、Webデザイン、Web制作の標準になりつつあります。そのためには、PCサイトを作ってから、スマートフォンなどに対応するのではなく、最初からどのデバイスにも対応できるデザインやレイアウトを考えることが重要です。
本書ではそういったスキルがレッスン形式のステップバイステップで身につくように構成しました。
●基礎
レイアウトの根本となるボックスの並べ方をマスターし、Webページにおける段組みを自在にコントロールする手法を身につけます。
●実践
「ブログ・ニュース系サイト」と「ビジネス系サイト」の実例サイトを、1からパーツを組み立てながら作成していきます。
●応用
マルチデバイスに対応し、使い勝手や見栄えを向上させる各種のアレンジ・テクニックや実践で役立つTIPSを学びます。
1-1 Webページにおける段組み
1-2 ボックスを横に並べる
1-3 ボックスを分割する
1-4 ボックスの横幅を指定する
1-5 ボックスの並び順を指定する
1-6 レスポンシブWebデザインを設定する
2-1 パーツの準備
2-2 Webページの準備
3-1 レイアウトの基本構造を作る
3-2 ボックスの中にコンテンツを入れる
3-3 レイアウトの調整を行う
3-4 レスポンシブWebデザインの調整を行う
3-5 パーツの追加と修正
3-6 ナビゲーションバーとフッターを横幅いっぱいに表示する
4-1 トップページの作成
4-2 パーツの追加と修正
5-1 レイアウトの基本構造を作る
5-2 ボックスの中にコンテンツを入れる
5-3 レイアウトの調整を行う
5-4 レスポンシブWebデザインの調整を行う
5-5 パーツの追加と修正
5-6 ナビゲーションメニューをトグル型にする
6-1 コンテンツページの作成
6-2 パーツの追加と修正
段組み＆パーツ索引
キーワード索引
