2019年3月にソシムより出版されたエビスコムの「フレキシブルボックスで作るHTML5&CSS3レッスンブック」（以下、フレキシブルボックスレッスンブック）を読んだので、紹介したいと思います。
これまでのフロートを使ったレイアウトから脱したい方や、これからHTML&CSSを勉強しようという方にもおすすめのレッスンブックになっています。
ふたつになったレッスンブック
2018年12月に「CSSグリッドで作るHTML5&CSS3レッスンブック」（以下、CSSグリッドレッスンブック）が発売されたばかりでしたが、なんと今度はフレキシブルボックス（Flexbox）に対応したレッスンブックが新たに登場。
関連記事：一歩先を進んだ入門書「CSSグリッドで作る HTML5&CSS3 レッスンブック」
まさかこう来るとは予想外でした。CSSグリッドのレッスンブックとかトガってんなぁ～と思っていたのですが、グリッドレイアウトとフレキシブルボックスの2パターンのレッスンブックだったんですね。
少し気になった点としては、これからHTMLやCSSを勉強しようという人も対象にしているレッスンブックなのに、フレキシブルボックスとかCSSグリッドとか専門用語をタイトルに用いて大丈夫なの？とは思いましたが……
選ぶ側からしたらわかりにくそう……
この本の特徴について
ここからはフレキシブルボックスレッスンブックの特徴について、紹介していこうと思います。
書籍の構成がすばらしい
エビスコム本を読むと毎回思うことなのですが、今回のこの書籍でもWebサイトを完成させていくまでの過程の構成がすばらしいと感じました。
ステップバイステップでWebサイトを実際につくりながら、HTMLやCSSの仕組みについても学んでいくことができます。
この書籍では、制作ステップとHTML&CSSの仕様について解説しているページが分かれた構成になっているので、すでにHTMLなどの基本は分かっているよという方は、制作ステップだけ読み進めていくことも可能です。
巷の一般的なHTML&CSS本だと、書いてあるHTMLやCSSの解説を読むのが億劫になるのですが、なぜかエビスコムの本だとコードを打ち込みながら制作していくうちにもっと学びたい、もっと知りたいという意欲が湧いてくるんですよねぇ。不思議なモノです。
新しくなったレッスンブックではモバイルファーストでの作成法になってますし、もう言うことなしというか、完成形に近いのではないでしょうか。
Firefoxの開発ツールがめっちゃ使える
今回のこのフレキシブルボックスレッスンブックでいちばん優れていると感じたのが、Firefoxの開発ツールで確認しながらWebサイトを制作していくところです。
他でもChromeのデベロッパーツールなどを紹介・説明している書籍もあったりしますが、ここまで開発ツールを活用している書籍はなかなかないと思います。
これによりマージンやパディングなどもより視覚的にわかりやすくなりますし、フレキシブルボックスについての構造も理解しやすくなりました。
CSSグリッドレッスンブックのときもFirefoxをページの表示確認に使用していましたが、フレキシブルボックスだとよりFirefoxの開発ツールの便利さを体感することができます。
私は普段、Chromeのデベロッパーツールを使っているのですが、Firefoxの開発ツールも使ってみるとめちゃくちゃ有能で使いやすいですね。
さいごに
この記事のタイトルにも書いた「フレキシブルボックスレッスンブックこそ真のHTML&CSS入門書だ」というのは、
- CSSグリッドレッスンブックよりも、普遍的で初心者に適した入門書である
- 他のHTML&CSS本と比較しても優れた入門書で、自信をもっておすすめできる
ということを伝えたかったのであります。
フレキシブルボックスレッスンブック、CSSグリッドレッスンブックはどちらも中身の構成などは似ていますが、ふたつのレッスンブックを読むことでレイアウトの違いなど学ぶことができるので、両方ともに読んでみるのが良いかと思います。
エビスコム本は楽しく読みながら学ぶことができるので、やっぱり最高ですわ。
