今のコーディング方法を知るのに最適な書籍「現場のプロが本気で教える HTML / CSSデザイン講義」

上記の記事がきっかけで、「現場のプロが本気で教える HTML / CSSデザイン講義」を読んでみました。
大手ヤフーで、どんなコーディングをしているのか気になりますよね。

内容

HTML/CSSのコーディング方法は年々変化して、より便利に、複雑になっています。

例えば、コーディングをする上で主流になりつつあるツールのSASS（CSSプリプロセッサ）であったり、floatにとって変わるflexboxを使ったレイアウトが代表的です。

「現場のプロが本気で教える HTMLCSSデザイン講義」では、
SASSやflexboxを使ってサイトのTOPページを組み上げていく工程が解説されています。

・SASSの現場での使われ方
・flexboxを使ったレイアウト
・CSSの命名規則

など、コーディング現場で必要な技術が主な内容。

ヤフーの現場で使われている最新のコーディングを盗み見る（？）ことが出来るので、2017年現在のHTML/CSSコーディングの動向を知りたい方には手っ取り早い１冊となっています。

本書ではSASSの現場での使われ方はわかるものの、ひとつひとつの解説は少なめ。SASSの出力結果も書いてあれば初心者には嬉しかったですね。

SASSについてはこちらの書籍がおすすめです。

「SASSの教科書」は発売された時期が少し古くて買うのを少しためらったのですが、SASSで何ができるのかを基礎から学べるのでとても良かったです。SASSの知識が浅い人は先にこちらを読むほうがいいかもしれません。

SASSを導入することでメンテナンス性を向上できる部分もあれば、逆にコード解析に時間がかかることも起こり得ます。慣れの問題かもしれないけど、気をつけて付き合っていきたいですね。

SASSやレスポンシブサイトが主流になったことでHTML/CSSの敷居は昔に比べ上がっています。（IE6対応が無くなったのはよいことですが。）

Webサイトひとつをデザインをするにしても、HTML/CSSの知識なしでは難しいのが現実。

HTML/CSSの知識なくデザインをしてしまうと、

「この並びではスマートフォンと整合性がとれない」
「ソースが二倍になって重くなるし、メンテナンス性も悪い」
「デザインを実現するのに工数が増える」

などなど、せっかくのレスポンシブの良さが無駄になってしまいます。

デザイナーの方はflexboxの部分だけでも理解すると、主要なHTML/CSSの構造がわかるはず。

flexboxはレイアウトの自由度が高いです。
Webでどんなレイアウトが実現可能であるのかを知ることで、コーダーに信頼されるWebデザイナーになれるのではないでしょうか。

しかしflexboxはプロパティがかなり多い要素ですので、マスターするのに少し時間がかかると思いますが頑張ってみて下さい。

「現場のプロが本気で教える HTML / CSSデザイン講義」ではflexboxを積極的に使っているので、最近flexboxを使い始めた僕のような人には勉強になると思います。

「現場のプロが本気で教える HTML / CSSデザイン講義」は、最前線のコーディング方法を知りたい人にとって非常に役に立つと思います。

コーダーが少ないWeb制作会社に勤務している人などは、人のコードの解説を見るだけでも参考になるのでおすすめ。
実際に僕の会社は自分しかコーダーがいないので、今まで勉強したことの答え合わせをしているようで面白かったです。