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