これからの「標準」を身につける HTML+CSSデザインレシピ

Webデザインもちょっとかじらねばと思い読みました。見た目大事。デザイナになる訳でなくても何か作り物したときに見た目ショボイとガッカリ感あるし最低限それっぽい体裁を整える能力はいるかなーと。とりあえずこの本を写経しました↓

これからの「標準」を身につける HTML+CSSデザインレシピ (Web Designing Books)

よいところは図解とソースコードの対応関係が数字の番号振ってあって、どことどこが対応しているか分かりやすく、順番を追いながらちょっとずつデザインを変更していくので、写経して学ぶのに最適。本書自体のレイアウトも極力ソースコードがページ跨がないように配慮されていたりとかして見やすいです。紙面の大半が図解とソースで説明本文は最低限なので、レベル的にはHTMLとCSSのまったくの初心者だとたぶん辛いけど、他の入門書読んでなんとなく触れる人が2〜3冊目ぐらいに読むのがよいのではというかんじ。

あと本書の特徴としてスマホ対応を強く意識していてレスポンシブル対応するのにそれぞれのパーツをどう作るか、フレームワーク使った場合はどうするかと分けて解説してあるのもうれしい。フレームワークはBootstrapとFoundationを使ってるけど、構成としていきなりフレームワーク使わずに、まずは最初はCSSだけでフルスクラッチで部品作るところを先に説明してるので、Web上の入門サイトにありがちなフレームワークで作ったけど中身まったく分からないのでテンプレコピペからカスタマイズできない状態にならなくて、基礎から積み上げることでデザインの微調整したいときにインスペクタ見てどの辺いじればよさそうか当たりどころぐらいはわかるようになるので後はググるなりなんなりして生きていける気がする。

1点残念なのは、本書の記載の本文やコードがちょいちょい間違ってたり、実際に本書サポートサイトで公開されてるサンプルコードと本書の記載のコードが微妙に違ったり、ちょいちょい地雷が埋まってるのでそこだけなんだかなーというかんじです。レイアウトずれるのなんでかなーと思ったら本文display:block;になってるのにサンプルコードdisplay:inline-block;になってるところとかあってさすがにあんまりだと思った。まぁそれもデバッグ力を身につけるための演習問題だと思いましょう。全体としてはCSSでそれっぽいサイトの体裁整える教科書としてよい本なんじゃないかと思います。