商品紹介
HTML&CSSで実現する、柔軟でレスポンシブなWebデザイン
本書は「CSSグリッドで実現できることは何なのか」をテーマにした一冊です。
これまでのHTMLとCSSを使ったWeb制作では、思ったようなデザインを実現するために「コンテンツをどういう順に記述するか」「どうマークアップするか」「どのCSSのレイアウトテクニックを利用するか」をパズルのように取捨選択し、形にしていくスキルが必要でした。
それを解決する方法として注目を浴びているのが、CSSグリッドを使ったレイアウトです。
本書ではCSSグリッドによるWebデザインを、作成制作を通して解説していきます。次のようなステップで、デザインを組み立てていきます。
1 作例ごとに、レイアウトソフトを利用して完成見本(デザインカンプ)を用意
2 完成見本からパーツを抽出し、HTMLと文書構造を組み立て
3 CSSグリッドを作成し、パーツを配置
4 レスポンシブの設定を行い、デザインを仕上げる
作例はそれぞれ、PC、タブレット、スマートフォンで問題なく表示されるように仕上げていきます。
用意された作例は以下になります。
・縦横に均等に分割したグリッドによる「雑誌風レイアウト」
・複数のグリッドを組み合わせて作る「フライヤー風レイアウト」
・画像とテキストの重ね合わせによる「画像メインのレイアウト」
・「左右対称/非対称のレイアウト」
・上部や左部にナビゲーションを配置
巻末には「CSSグリッド」リファレンスも付属。
本書を通して、CSSグリッドがWebデザインにもたらす表現力と自由さを体験してください。
本書は「CSSグリッドで実現できることは何なのか」をテーマにした一冊です。
これまでのHTMLとCSSを使ったWeb制作では、思ったようなデザインを実現するために「コンテンツをどういう順に記述するか」「どうマークアップするか」「どのCSSのレイアウトテクニックを利用するか」をパズルのように取捨選択し、形にしていくスキルが必要でした。
それを解決する方法として注目を浴びているのが、CSSグリッドを使ったレイアウトです。
本書ではCSSグリッドによるWebデザインを、作成制作を通して解説していきます。次のようなステップで、デザインを組み立てていきます。
1 作例ごとに、レイアウトソフトを利用して完成見本(デザインカンプ)を用意
2 完成見本からパーツを抽出し、HTMLと文書構造を組み立て
3 CSSグリッドを作成し、パーツを配置
4 レスポンシブの設定を行い、デザインを仕上げる
作例はそれぞれ、PC、タブレット、スマートフォンで問題なく表示されるように仕上げていきます。
用意された作例は以下になります。
・縦横に均等に分割したグリッドによる「雑誌風レイアウト」
・複数のグリッドを組み合わせて作る「フライヤー風レイアウト」
・画像とテキストの重ね合わせによる「画像メインのレイアウト」
・「左右対称/非対称のレイアウト」
・上部や左部にナビゲーションを配置
巻末には「CSSグリッド」リファレンスも付属。
本書を通して、CSSグリッドがWebデザインにもたらす表現力と自由さを体験してください。
マイメニュー
何か良い本ないかな?
おトクに読める本は?
探してる本はあるかな?
- 詳細検索
- 著者別検索
- 出版社別検索
- 書籍トップ
- 書籍一覧
- ビジネス書・政治・経済
- 小説一般
- 推理・ミステリー小説
- 歴史・戦記・時代小説
- ライトノベル
- コンピュータ・IT
- ホラー・怪奇小説
- SF・ファンタジー小説
- アクション・ハードボイルド小説
- 経済・社会小説
- エッセイ
- ノンフィクション
- 恋愛小説
- ハーレクイン小説
- 英語・語学
- 教育・教養
- 辞書
- 旅行・アウトドア・スポーツ
- 料理・生活
- 趣味・雑学・エンタメ
- 詩歌・戯曲
- 絵本・児童書
- マルチメディア
- 写真集
- ボーイズラブ
- アダルト
- 雑誌トップ
- 雑誌一覧
- ビジネス・政治経済
- 総合週刊誌・月刊誌
- モノ・トレンド
- 男性誌
- 女性誌
- 自動車・乗り物
- コンピュータ・サイエンス
- スポーツ・アウトドア
- エンターテイメント・グラビア
- 暮らし・食・教育
- 趣味・芸術・旅行
- コミック雑誌
- NHKテキスト[語学]
- NHKテキスト[一般]
- 有料メルマガ
- 無料コンテンツ/カタログ
書籍を探す
コミックを探す
雑誌を探す
新聞を探す
リンク
ヘルプ