書籍レビュー -1冊ですべて身につくHTML ＆ CSSとWebデザイン入門講座-

webクリエイターズボックスのmanaさんの本。web系の知識は独学で不安があったこと、また今度参加するweb系セミナーにmanaさんが登壇される!とのことだったので、出たばっかりのタイミングで購入しました。

(2019/3/15に発売されました。)

購入の決め手

• html & cssの基礎知識の再確認
• Flexboxなどあまり理解していない最新知識を仕入れる
• 作者のアイコンかわいい

仕事でwebに関わり初めたときはAdobeユーザーで他の選択肢を知らなかったこともあり「Dreamweaver」を使用していました。その際に関連書籍をいくつか読破したのですが、自分の知識はそこがベースになっています。

ただ仕事が増えていくにつれ、今では当たり前にやっていること(例えばOGPの設定)も本に乗っていなかったため知らなかったり…みたいな場面が有りました。

なので一番の目的は「今の自分、大丈夫?」という「基礎知識の確認」という部分が一番大きかったかもしれません。

どういうサイトを作るの?

この本を通して最終的に「WBC CAFE」という架空のお店のwebサイトを作ることになります。上記画像のような素敵な可愛いサイトです。使用する画像も色使いなどデザインも最近っぽくて、お洒落で可愛いいので少しづつ出来あがっていくたびにテンション上がります。

合間合間で進めましたが、丸2日あれば初心者でも作り上げることができると思います。

良かった点

いままで読んできた書籍と比較し、良かった点を挙げておきます。

• 作例がハイクオリティでモチベが保ちやすい
• 参考サイトが豊富
• flexbox / css gridなど最近の表現方法にも対応
• 各種SNSやOGPなど対応必須な項目もカバー
• コードの技術一辺倒ではない、デザインや考え方の話も豊富

せっかくなのでそれぞれ解説しておきます。

作例がハイクオリティでモチベが保ちやすい

これはいままで勉強してきた書籍のチョイスが悪かったのかもしれませんが、BtoBのコーポレートサイトを作っても練習台として作る分にはイマイチ達成感がありませんでした。

この書籍だと誰が見てもオシャレなカフェなので作っていてテンションが上がっていくこと間違いなし。写真のチョイスも素敵。途中で挫折することなく楽しく最後まで続けることが出来るでしょう。

参考サイトが豊富

色相など色づかいの勉強チャプターがありますが、「赤」を使った素敵なサイト、のように各色で参考サイトが掲載されており(海外サイト含む)、結構ページを割いて紹介されています。(しかもどれもハイレベル)

また、作者がよく使う素材サイトなどの紹介もあります。

(全部速攻ブックマークしました。)

flexbox / css gridなど最近の表現方法にも対応

自分が勉強始めた頃はどの本もはじめは「float」を使い、次に「bootstrap」という流れが多かったように思えます。この本ではそこに一切触れず、グリッドシステムにflexboxとcss gridの解説に多くのページを割いており、ここはまさに2019年最新のやり方、という感じで新鮮でした。(css gridはまだ使ったことがなかった)

また、「リセットcss」に関しては恥ずかしながら本書で初めて知りました。

各種SNSやOGPなど対応必須な項目もカバー

これもまさに最新、という感じですが

• Googleマップとマイマップを使ったカスタマイズ法
• Facebookプラグインでのタイムライン貼り込み
• Twitterプラグインでのタイムライン貼り込み
• Googleフォーム使ったメールフォーム作成
• OGPの設定

などなど、入門書には乗ってたり乗ってなかったりする、でも必須な項目もカバーしています。

技術一辺倒ではない、デザインや考え方の話も豊富

入門書はhtml/cssのコード技術一色になりがちですが、その前提となるUXの考え方やユーザービリティにも触れています。

また、色の話だけでも約20ページくらい割いています。コードだけではなく、その周りを固める知識や考え方も重要だよ、という作者の考え方が伝わってきます。

難点

褒めてばっかではアレなんでいくつか難点を。

参考サイトの内容が変わっちゃってる…

例えば「色」の例の参考サイト。「ピンク」の例で上がってた「Frank body」のサイトがそこまでピンクじゃなくなっていたり、などいくつか参考サイトの内容が変わっていたりしています。

サイトは変わり続けるんでなんでしょうがないか…という気もしますが。

あと海外サイトも多く、日本からは検索しても出てきにくいのでURL打つしかなかったのも問題点。(英語苦手なんでスペル間違いまくった…)

ただ、参考サイトとして掲載されているサイトは間違いなく素晴らしいサイトばかりなので多少違っても参考にして間違いありません。

あと細かい点

ネコ好きすぎ問題

序盤、写経してると何度も登場する猫、猫、猫。作者猫好きなのはよーく分かりました。

こういう人におすすめ

web制作に関わる初心者はもちろん、色々な人にオススメ

• web制作に興味がある初心者
• 技術の棚卸しをしたい脱初心者
• 知識のアップデートをしたい中級者
• 会社の初心者勉強用マニュアルとして

もちろんこの一冊で全てはカバーできませんが、一般的な入門書では触れないであろう部分までデザインの知識まで触れることが出来る貴重な一冊です。ここからwebデザインやコーディングなど色々な道がありますが、そのスタートとして間口を大きく広げてくれる一冊であること間違いなし!です。

たまに振り返って見ても知識系の話で新しい発見や気付きがあり、とても参考になります。

気になる方はAmazonでためし読み出来るので自分に合うかどうか見てみてはいかがでしょうか。

1冊ですべて身につくHTML　＆　CSSとWebデザイン入門講座／Mana 価格：2440円（税込、送料別) (2019/6/9時点)

webデザイナーなら一度はお世話になったことがある、作者のmanaさんのサイト webクリエイターボックスはこちら。

https://www.webcreatorbox.com/