ゆるりと綴る日常のこと

すぐこのブログ
HTML＆CSS

これ１冊でOK！HTML＆CSS学習ガチ初心者さんへおすすめの教材【書籍編】

📅

こんにちは、プログラミングガチ初心者のすぐこです。

ガチめの初心者だと、プログラミング学習ってどこから始めればいいのか不安ですよね。

とりあえず、初心者におすすめ！と名高い**Progate**のHTML＆CSSレッスンから始めてみた人も多いのではないでしょうか？

私もProgateを1ヶ月お試しでやってみて、

すぐに開けるテキストが欲しい！！

と思いました。

Progateはネットで完結する分、スライド記載分の情報が手元に残らないんですよ^^;Progateのスライド分かりやすいし、補足情報とか載せて書籍化してくれ……

そこで、巷で有名な「」をさっそく購入しました。

最新の第2版の方です。↓

結論としてはかなり推せます！

この本のおかげでProgateで得た知識を反復できたし、3カラム、タイル型レイアウトの簡単なWebページを作るところまでいけました。

書籍を１周したので、今回はガチの初心者目線でレビューを書いていきます！

この記事はこんな人におすすめ

  • Webデザインに興味があるけど、何から始めたらいいか分からない人

  • 分かりやすい入門書を探している人

  • 「１冊ですべて身につくHTML＆CSSとWebデザイン入門講座」の購入を検討している人

「１冊ですべて身につくHTML＆CSSとWebデザイン入門講座」ってどんな本？

この本は、Webデザイン初心者向けの参考書です。

その名の通り、HTML＆CSSの基礎からWebデザインまでを、この1冊で学ぶことができますよ。

著者のManaさんいわく、この本で学べるのは「本当に入門部分だけ」とのことですが、そのガチの入門部分を知りたかったのでありがたい限り！

具体的にどんなことが学べるの？

この本では、

  1. $1

  2. $1

  3. $1

  4. $1

  5. $1

  6. $1

といった、Webサイト制作の基礎知識をまんべんなく学べます。

この本では、専門用語を分かりやすく解説してくれるだけでなく実際にコードを書きながらWebサイトを作っていく実践的な内容になっているので、自然とスキルが身につくように工夫されています。

また、Webデザインのトレンドを押さえたおしゃれな流体シェイプデザインのWebページを、実際に手を動かして作ることができるのも嬉しいポイント！

この本の良かった点【箇条書き】

先述の内容と少し被る箇所もありますが、箇条書きでまとめました。

  • Webサイトとは？という基本の概念から、初学者向けに分かりやすく解説されています

  • 写真が多く、視覚的に理解しやすい！

  • Webフォントの導入方法が分かります

  • 本に記載のurlからサンプルデータ集がダウンロードできます

  • サンプルデータは内容を書き変えて自分用に利用可能(商用もOK)

  • 章末に練習問題があるので、手を動かして実践的に学べます

  • Webサイト制作の章があり、自分で実際にサイトを作れます

  • FlexboxやCSSグリッドの使い方が分かります

  • コードを書く上でつまづきやすい箇所は記載のQRコードからYoutube解説動画へ飛べます

  • YoutubeやInstagramといったリンクが貼れるようになります

  • 5年連続売上1位の実績あり。書店で見かけた人も多いのではないでしょうか^^

あと個人的には、テキストの余白が(良い意味で)多いので、たくさんメモを書き込めて便利でした！

気になった点・改善して欲しい点【箇条書き】

気になった点を少しだけ……！

  • 「Webデザイン」だけの章はなく、本文中の随所に書かれているのでがっつり学習した感は出ない ▶冒頭から読み進めていくと身につくような構成になっています

  • ブロックレベル要素、インラインレベル要素についての言及がない ▶コードの中にいきなりinline-blockやmargin: auto;が出てくるので何コレ？とちょっと戸惑います^^;

  • JavaScriptについての言及が少ない ▶代わりに、CSSでアニメーションを付ける方法(トランジション)が解説されています

  • paddingやmarginの数値をなぜその設定にしたのか？の説明が欲しかったです ▶微調整で充てた数値なのか、業界の慣習的な数値なのか、など

  • すんごく細かいのですが、HTML＆CSS両方のコメントアウトのショートカットキーについて記載があったらうれしかったです ▶１文字ずつ手打ちしていたので笑

実際の学習効果と進め方はどんな感じ？

私の場合は、約2時間の学習×2週間で一通り終えることができました！

独学で前提知識がなくても、HTMLタグやCSSプロパティの意味が節ごとに説明されているため、スムーズに進められる構成になっていました。

特にWebページ制作の章ではコードの追加部分や入力結果について図解つきで分かりやすく説明されていて、つまずくことなく理解できましたよ。

まとめ｜初心者にぴったりな1冊。5年連続売上1位は伊達じゃない！

「」は、Webデザイン初心者の方でも楽しみながらWebサイト制作に必要な知識を身につけることができる、おすすめの1冊です。

基礎からしっかり学べる構成で、1つ1つ丁寧に解説されているため独学でも挫折せずに続けられる内容となっています！なのでちょい分厚いです笑

プログラミング初心者の方は、まずこの1冊から始めてみてはいかがでしょうか*^^*

より実践的なスキルを身につけるためには、この本の後に別の教材で学習を続けましょう。

WebデザインのTIPS集を詳しく知りたい人は、同著者のManaさんが書かれたこちら↓が良書です！

← 記事一覧に戻る