今からHTMLとCSSを学ぶのは無駄か——AI時代に”基礎”が効いてくる場面

「AIでサイトが作れるようになったのに、HTMLとCSSを今から学ぶ意味はありますか?」

「ノーコードがあるのに、わざわざコードを書く必要ってありますか?」

こういう質問をもらうたびに、私は少し考えてから答えます。「やり方によります」と。

無駄になる学び方と、生きる学び方があるんです。先にそこを分けます。

目次

無駄になる学び方は、確かにあります

分厚い入門書を最初から最後まで読む。タグを一覧表にして暗記する。プロパティの仕様を全部覚えようとする。

こういう学び方は、無駄になります。

1から順番に教えてくれる教材は世の中にたくさんあります。時間もお金もかかります。でも、大事なことから順番に教えてくれる教材は、ほとんどありません。

必要がないことを時間をかけて学んでも仕方がないんです。HTMLのタグは110個ほどありますが、実際によく使うのはごく一部。全部覚える必要はない。必要な時にさっと調べられれば、それで足ります。

基礎が効く場面は、5つあります

では、何のために学ぶのか。具体的に書きます。

1. AIが書いたコードを直せる

AIは優秀です。日本語で指示を出せば、HTMLもCSSも書いてくれます。ただし、意図とズレた出力が必ず出ます。そのとき「ここを直せばいい」と分かるかどうか。直せなければ、もう一度AIに指示を出し直すしかない。基礎を知っていれば、自分で直せます。

2. テンプレートを崩さず変える

WordPressのテーマやノーコードのテンプレートを使っていて、「ここだけ色を変えたい」「この余白をもう少し詰めたい」と思ったとき。CSSの基礎を知っていれば、自分で調整できます。知らなければ、業者に頼むか、諦めるか。

3. 不具合の原因を切り分けられる

「なんか表示が崩れている」——こういうとき、HTMLの構造の問題なのか、CSSの指定の問題なのか、それとも別の原因なのか。基礎を知っていれば、原因の場所を絞れます。闇雲に触って壊す、ということが起きにくくなります。

4. 業者やデザイナーと話ができる

サイトの修正を頼むとき、「なんかこの辺を直してほしい」と言うのと、「ここのpaddingを20pxに変えてほしい」と言うのでは、伝わり方が全く違います。的確に伝えられる人は、無駄なやり取りが減ります。結果として、時間もお金も節約できます。

5. 新しい技術に移れる

HTMLとCSSは、Webの土台です。これが分かっていると、WordPressに行っても、Astroに行っても、別のツールに行っても、基本の考え方が通用します。ツールは変わっても、HTMLとCSSは変わっていません。どのツールを選ぶべきかについては、ツール選定の記事で整理しています。

どこまでやれば十分か——線の引き方

プロを目指さないなら、全部を深く学ぶ必要はありません。

ここまでできれば、十分です。

  • HTMLの基本的なタグ(見出し・段落・リンク・画像・リスト)の意味が分かる
  • CSSで色・余白・文字サイズを変えられる
  • ブラウザの検証ツール(F12)で、どのCSSが当たっているか確認できる
  • AIが書いたコードを見て、「だいたいこういう構造だな」と読める

ここまでで、日常的に困ることはほとんどなくなります。

逆に、ここから先——レスポンシブデザインの細かい設定、アニメーション、高度なレイアウト——は、必要になったときに学べばいい。先に全部やろうとすると、手が止まります。

「無駄だ」と言う人の多くは、暗記型の学び方をしています

「HTMLなんて今さら要らない」と言う人の話をよく聞いてみると、過去に分厚い本を買って挫折していることが多いです。

学び方の問題であって、HTMLやCSSの問題じゃないんです。

作りながら、必要な分だけ覚えていく。これが効率的な学び方です。

実際、CSSは書き始めるとうまくいかない場面が必ず出ます。プロでも躓きます。私も30年やっていますが、CSSにハマって1時間解決できなかったことがあります。CSSって、そういうものなんです。

だから「覚えてから作ろう」とすると、永遠に作れません。先に作る。躓いたら、その場で覚える。この順番の方がずっと身につきます。

ここからは、タイミングの話です。

技術の変化は、ここ数年で落ち着いています

私はこの30年間、テーブルレイアウト、FLASH、Dreamweaver、Fireworks——次々と現れては消える技術を全部通ってきました。いつも学ぶことが多くて大変だったけど、楽しかった。

でも、ここ数年は技術の進化が落ち着いています。新しく学ぶことが以前ほど多くない。

これは逆に言えば、今一気にまとめて身につけてしまうには良いタイミングだということです。

しかもAIをフル活用すれば、今から始めても、5年・10年やってきた人より数段進んだ状態になれる可能性がある。基礎を知ったうえでAIを使う人と、基礎を知らずにAIを使う人では、出力の質が違います。AI時代に基礎を学ぶ意味については、AI時代にホームページ作成を習う意味でも書いています。

学ぶかどうかは、目的で決まります

ここまで「基礎が効く場面」を書いてきましたが、全員にHTMLとCSSを勧めるつもりはありません。

ノーコードで足りている人は、ノーコードでいいです。ノーコードの限界が気になったときが、基礎を学ぶタイミングかもしれません。AIだけで目的が達成できている人は、それでいい。

ただ、「細かく直したい」「なぜこう表示されるのか知りたい」「AIの出力を判断したい」——こういう気持ちが出てきたなら、基礎を少しだけ知っておくと、その先がずっと楽になります。

しっかりと勉強がしたいのか、しっかりと作れるようになりたいのか。

ここが分かれ道です。作れるようになりたいなら、基礎は「必要な分だけ」で足ります。

あなたの目的なら、どこまで必要か

基礎がどこまで必要かは、何を作りたいかで変わります。

HTML/CSSの基礎から学ぶなら、HTML/CSSで簡単なホームページを作成できるようになる講座(全24回・6ヶ月)があります。AIを使いながら効率的に学びたいなら、AI+WordPress/Astroの講座(全16回・4ヶ月)もあります。

体験レッスンで、あなたの目的に必要な範囲を一緒に確認しましょう。

「自分の目的に合う学び方が分からない」という方は、何から学べばいい?——目的別の学習ルートも参考にしてください。

「HTMLは全くやったことがない」という方も、「少しやったけど挫折した」という方も、どちらでも大丈夫です。あなたの目的に合った線を、体験レッスンで引きます。

まずは体験レッスンにご参加ください

ホームページを作れるようになりたい。でも、何から始めればいいか分からない。そんな、あなたのための教室です。

基礎からしっかり学んで、自分で作れるようになりたいですか?

AIを使って、上手に作れるようになりたいですか?

まずは、体験レッスンで「どうなりたいか」を聞かせてください。

画面の向こうの先生と、机でレッスンを受ける生徒

体験レッスンに申し込む

この記事を書いた人

コナン先生(小南邦雄)
コナン先生(小南邦雄)

Web制作歴・Web運用歴30年(1996年〜)
Webプロデューサー、Webディレクター、Webコンサルタント、Webマーケター、Webデザイナー、講師、AIディレクターなど、さまざまな立場でWeb制作・Web運用に携わる。

Webデザインコンテストでグランプリ受賞、大手企業・有名企業・地方自治体のサイトや広告制作多数、アフィリエイトサイトで1600万円以上の報酬獲得、120万円超のホームページプロデュースが予約2ヶ月待ち、ストアカでは115名を指導し平均評価4.98・ゴールドバッジ獲得などの実績あり。

自社サイト10サイト以上、クライアントサイトを含めると20サイト以上を運用中。

体験レッスン