これからゆっくり考L

旅行好き。美味しいもの好き。日本酒好き。

【書評】レスポンシブWebデザイン マルチデバイス時代のコンセプトとテクニック

_7292288
いただきました。
アスキー・メディアワークス様ありがとうございます。

ちょうど今レスポンシブ案件のコーディングをしているので、取り急ぎざっと読んでみました。

目次

_7292290
第1章[導入編]マルチデバイス時代とレスポンシブWebデザインの誕生
[1-1]レスポンシブWebデザインとは
[Follow up1]レスポンシブWebデザインを支える「モバイルファースト」のコンセプト
第2章[基礎編]サンプルで学ぶレスポンシブWebデザインの基本
[2-1]レスポンシブWebデザインのワークフローと画面設計
[2-2]HTMLの用意とリセットCSSの作成
[2-3]フルードイメージの導入とタイポグラフィの基本設定
[2-4]ヘッダー/フッターとコンテンツ領域のスタイリング
[2-5]メディアクエリーの設定とグリッドデザインの導入
[2-6]フルードグリッドへの変換
[2-7]レスポンシブタイプセッティング
[Follow up2]Viewportを理解しよう
[Follow up3]メディアクエリーを使いこなす
[Follow up4]フルードグリッドの必要性
[Follow up5]次の新しい単位「rem」
[Follow up6]スマートフォンで文字を見やすくするテクニック
第3章[実践編]商用サイトで通じるプロのテクニック
[3-1]リセットCSSの最適化
[3-2]Less Frameworkを利用したグリッドレイアウト
[3-3]レスポンシブイメージの実装
[3-4]高解像度ディスプレイへの対応
[3-5]ナビゲーションパターンとレイアウト設計
[3-6]テーブルとビデオのレスポンシブ化
[Follow up7]srcset属性によるレスポンシブイメージの標準化
[Follow up8]デザイニングインブラウザーを助けるツール
第4章[応用編]高度なレスポンシブWebデザインの実践
[4-1]文字数をベースにしたブレイクポイントの設定
[4-2]パフォーマンス改善の基本
[4-3]Data URIとアイコンフォントによるHTTPリクエストの削減
[4-4]画像の最適化によるパフォーマンスの改善
[4-5]ソーシャルメディアボタンの最適化
[4-6]これからのレスポンシブWebデザイン
[Follow up9]パフォーマンス計測ツールの利用
[Follow up10]スマートテレビとレスポンシブWebデザイン
[レスポンシブWebデザインより引用]

感想

基本的なことは理解しているつもりでいましたが、まだまだ知らないことがたくさんあって勉強になりました。

レスポンシブタイプセッティングやレスポンシブテーブルはまだ実装したことがなかったので今度試しに使ってみたいなーとか、emで文字サイズ指定するときの計算方法詳しく書かれているので後でじっくり読みなおしておきたいなーとか、レスポンシブイメージの実装方法参考になるわーとかとか。

この考え方はちょっと…実際の案件では厳しいかな…という箇所もありましたが、こういう考え方、手法もあるんだなーと参考になりました。

本全体としては基本的なことから応用まできっちり書かれているので、まだレスポンシブ対応のコーディングしたことない!レスポンシブよく分からない!というコーダーさんにぴったりだと思います。

レスポンシブWebデザインが注目されるようになった背景からはじまり、ワークフロー、コードの記述方法、メディアクエリーの設定方法、Normalize.cssの利用方法、などなど。
これ1冊読めば、基本的なレスポンシブWebデザインのサイトは作れるようになるんじゃないでしょうか。

制作に関わるすべての人にオススメしたい

レスポンシブ案件をすすめていく上で、構成の段階からある程度レスポンシブとは?がわかっている人に関わってほしいし、デザイナーさんもある程度は分かっていないとレスポンシブでは到底ムリーなデザインができあがってきて結局1つのhtmlに同じ記述複数書かなくちゃいけなくなって、もはやソース1つにする意味ってなんだっけ…?
という感じでカオスになるので、コーディングをする人だけでなく、レスポンシブ案件に関わる全ての人、ディレクターさんやデザイナーさんにも全力で読んで欲しいです!!

私もじっくり読みなおして、ちゃんと勉強します。

レスポンシブWebデザイン マルチデバイス時代のコンセプトとテクニック (WEB PROFESSIONAL)

レスポンシブWebデザイン マルチデバイス時代のコンセプトとテクニック (WEB PROFESSIONAL)