「HTML&CSS初心者が1か月独学で勉強したらどうなるの?」に回答する

HTML CSS 独学 勉強

同じようなテーマで書かれていたとしても、デザインに気をつけているブログとそうでないブログがあったら、やはり前者の方に信頼を寄せたくなる。

もちろん内容が1番で、見た目がすべてではないのだけれど、デザイン事務所でビジュアルの持つパワーを実感したこともあって、ブログを始めた頃から、せっせとカスタマイズに精を出していた。が、

yoko
yoko

HTMLもCSSも何もわかっちゃいません…!

という私がカスタマイズをするので、

  • 「とにかく時間がかかるし、なかなか思い通りのデザインにならない…」

最初はそれでも楽しかったのだけれど、だんだんとストレスが溜まるようになってきたため、この問題を解消しようとプログラミングの勉強を開始した。

スキマ時間を使って約1か月学習した結果、「ストレスがだいぶ緩和される」という成果を手に入れいることができたので、この記事では、プログラミング未経験の私が、独学でHTMLとCSSを学んだ方法とその結果ついて詳しく解説していきたいなと思う。

同じような悩みを持っている方々に届きますように。

スポンサーリンク

この記事はこんな人にオススメ

  • ブログ(Wordpress)のデザインを思い通りにカスタマイズしたい人
  • ブログ(Wordpress)のカスタマイズスピートをあげたい人
  • HTML / CSSの基礎を独学で勉強してみたい人

HTML/CSS初心者が1か月独学で勉強した結果

・HTMLとCSSの基礎知識が身についた

・カスタマイズのスピードが格段に上がった

簡単なレベルのデザインは、イメージ通りにカスタマイズできるようになった

・読みやすいです!とブログを褒めてもらえることが多くなった

使った教材は、2つ

1. ドットインストール

ドットインストールの画像
画像引用元:ドットインストール より

オンラインでプログラミングを学ぶことができる学習サービス。

Twitterでは「プログラミング学習の登竜門」と言われるほど有名な学習サイトProgateで勉強している人が多い印象だったけれど、両方の無料版を試した結果、

  • 動画を見ながら、実際に手を動かし学べること
  • 1動画、約3分という短さであること

が私にはしっくりきたので、ドットインストールで勉強することにした。

2. これからはじめるHTML&CSSの本

「これからはじめるHTML&CSSの本」の画像

カスタマズするときに、よく参考にしていたブログ「サルワカ」のサルワカさんが紹介していた本

これでもかという程1つ1つ丁寧に説明されているので、途中で挫折することなく作業を完遂することができた。

HTMLとCSSについて、まだ何もわかりませんという方へのオススメの入門書。

HTML/CSS 私の勉強法

おおまかな流れは下記の通り。

まずドットインストールで学習
本とドットインストールで復習

毎日1〜2時間、の後、のルーティンを繰り返し行っていたら、1ヶ月ほどで基礎勉強は一通り終わらせることができた。

ちなみに私がドットインストールで勉強した項目は、

ドットインストールで私が学習したレッスン
画像引用元:ドットインストール レッスン一覧 より
  • はじめてのWeb制作(全11回)
  • Web制作の開発環境を整えよう macOS編(全10回)
  • 詳解HTML基礎文法編(全22回)
  • 詳解CSS基礎文法編(全33回)

の4つ。

私の勉強法、ここがポイント!

ドットインストールを一通り終わらせたら(全部理解できなくてもOK)、

本のlesson.01→同じ内容を動画で復習→本のlesson.02-03→同じ内容を動画で復習

というように、こまめに復習するところが私の勉強法のミソ。

キップム
キップム

ある程度記憶が維持できている状態で復習するので頭に残りやすいよ。

「基礎はどこで習ってもほぼ同じ」とどこかで聞いたことがあるけれど、本当にその通りで、ドットインストールの

ドットインストール レッスン一覧
  • 詳解HTML基礎文法編(全22回)
  • 詳解CSS基礎文法編(全33回)

と、本1冊の内容は、

ほとんど一緒だった。

流れは多少違うので、その辺は臨機応変に対応して勉強してもらえればと思う。

さらに、勉強途中でも恐れずに、実際にワードプレスを触りカスタマイズしていくと、動画や本で学んだことが身につきやすいのでオススメ!

テキスト作成は、VSCode or メモ帳?

本ではテキスト作成のためにメモ帳を使用しているけれど、ドットインストールの「学習環境を整えよう」で習うVisual Studio Code(VSCode)が個人的にはイチオシ。

使ってみるとわかるけれど、とっても楽。

HTML&CSSを1か月独学で勉強してみた感想

独学してよかったこと

経済面での負担がほとんどない(ドットインストールのプレミアムサービス月額1,080円(税込)と本代2,178円のみ)

・カスタマイズのスピードを上げる、思い通りにデザインできるようになる、という当初の目標は達成できた

・カスタマイズのお役立ち、デベロッパーツールが使えるようになった

勉強前は1か所カスタマイズするのに丸1日かかっていたけれど…… 勉強後は2〜3時間、早いときは1時間ほどでできるようになったのは本当に嬉しかった。

「どや!見て」とまではいかないけれど、読みやすいとたくさんの人に褒めてもらうことで「私のブログそんなに悪くないのでは」と思えるようになったのは精神衛生上とても良いなと思っている。

独学して感じたデメリット

・独学でプログラマーレベルのスキルを身につけるのは非常に難易度が高く、難しい

基礎学習を終えた時点で、無謀にも模写に挑戦してみたけれど、疑問点が頻発。質問できる人がいなかったため、どのように解決すればよいのか見当もつかずに挫折…

もし、私の目標が「プログラミングで稼ぐ」だったら、プロのサポートが受けられるスクールに変更することを早々に決断したと思う。

おわりに

ということで、「HTML&CSS初心者が1か月独学で勉強したらどうなるの?」への回答はここまで。

プログラミングの基礎が理解できるようになってからブログ運営がより楽しくなったので、チャレンジしてよかったな、と思っている。

私の経験をベースに書いたので、100%正解の勉強法ではないと思うけれど、参考になる点があれば嬉しい。

文章・写真: yoko( @_yoko51_

Comment