こんな疑問にお答えします。
- Web制作に必要な知識5つ
- Web制作の独学での学び方
この記事を書いている僕はエンジニア歴15年以上で、ブログ運営・Webマーケティング・SEOが専門領域です。
僕自身、Web系の言語はすべて独学で勉強しました。
実際に学んだ経験から、改善点と最新の状況もふまえて、より多くの方にも実践できる形で独学のノウハウをお伝えします。
これからWeb制作を学んでみたい方、まずは独学ではじめてみたいといった方はぜひ読んでみてください。
この記事を読むことで、クラウドワークスやランサーズなどの案件でフリーランスで1件5万円くらいの仕事を受注できるようになります。
それでは、さっそくいってみましょう！
目次
Web制作に必要な知識5つ
Web制作に必要な知識は、下記の5つです。
🔽
- HTML/CSS
- WordPress
- jQuery
- PHP
- SEO
この5つを学ぶことで、Webサイトの仕組み・制作・実践までの基礎知識を身につけることができます。
①：HTML/CSS【Webサイトのベースを作ろう】
Web制作でまず必要になる知識がHTMLとCSSです。
すべてのWebサイトの基礎知識となります。
HTMLはWebページを制作するための言語で、CSSはHTMLで作ったページの見た目を整えるために使用する言語です。
この2つはセットで使用します。
それでは、具体的な学習方法を見ていきましょう。
学習①-1：ドットインストール（詳解HTML・詳解CSS）
ドットインストールとは、プログラミングを動画で学ぶことができるサイトです。
すべての動画は3分以内となっており、すきま時間を利用して気軽に学ぶことができます。
>>詳解HTML 基本タグ編（全27回） — ドットインストール
>>詳解CSS 基礎文法編（全33回） — ドットインストール
学習①-2：スラスラわかるHTML&CSSのきほん
続いて、基礎を固めるために入門書を1冊仕上げましょう。
『スラスラわかるHTML&CSSのきほん』は、その名の通りスラスラと取り組むことができ、途中でつまずくことなく1冊仕上げることができます。
この1冊を終えれば、HTML/CSSの基礎について自信がついてくるでしょう。
学習①-3：よくわかるHTML5+CSS3の教科書
仕上げとして、『よくわかるHTML5+CSS3の教科書』で知識を固めていきます。
こちらはボリュームのある内容で、HTML/CSSについてガッツリ学べます。
途中でつまずいたり飽きてしまう部分があれば、気にせず飛ばして進めていきましょう。
一度ですべて理解するのは大変なので、とりあえずざっくりと仕上げることが大事です。
学習①-4：デベロッパーツールの使い方
ここまできたら、HTML/CSSの基礎はかなり固まってきている状態なので、デベロッパーツールの使い方を覚えましょう。
デベロッパーツールを理解することで、HTML/CSSの実践的な知識が深まります。
デベロッパーツールの使用方法については、下記の記事がおすすめです。
>>Web開発でよく使う、特に使えるChromeデベロッパー・ツールの機能
学習①-5：フレームワークの使い方
フレームワークとは、簡単に言うとWebサイト制作の便利な「部品」といったイメージです。
フレームワークを使うことで、効率的にコーディングできるので、かなり時短になりますし、Web制作が楽しくなります（笑）
例えば、10行以上のコードが、フレームワークを使用することで、たった1行で実装できるようになります。
フレームワークの中でも最初に使用すべきなのは、Bootstrapです。
Bootstrapは利用者数が一番多く、資料も豊富なので、習得しやすいです。
ドットインストールの動画で、サクッと学んでしまいましょう。
>>Bootstrap 5入門（全21回） — ドットインストール
②：WordPress【実際にWebサイトを作ってみよう】
HTML/CSSでWebサイト制作の基礎知識を学んだあとは、さっそく実践にうつりましょう。
Web制作ではWordPressを使用するのがおすすめです。
WordPressは世界中で最も多く使われているCMSです。
それでは、WordPressで実際にWebサイトをつくってみましょう。
そのための学習方法をご紹介します。
学習②-1：1冊ですべて身につくWordPress入門講座
WordPressは特別難しいことはないので、この1冊を仕上げればOK。
その他、わからないことがあればGoogleで検索して、その都度学んでいけば十分です。
学習②-2：WordPressでブログを作成する
1冊仕上げれば、WordPressの基礎はOKなので、実際にWordPressを使ってブログを作ってみましょう。
ブログの作成方法については、下記の記事で、誰でも簡単にブログが開設できるように、35枚の画像を使ってわかりやすく解説しています。
🔽
-
-
【10分で完了】WordPressブログの始め方【初心者でも簡単開設】
続きを見る
学習②-3：広告を貼り方を覚える
WordPressでサイトができたら、広告を貼ってみましょう。
自分のサイトを運営することで、そのWebサイトを収益化することができます。
広告には、クリック報酬型広告（Googleアドセンス）とアフィリエイト広告（A8.net、もしもアフィリエイトなど）の2種類があります。
具体的な使い方については、下記の記事を参考にしてみてください。
🔽
-
-
ブログ収益化のためのおすすめ広告2つ【基本解説】
続きを見る
③：jQuery【Webサイトに動きをつけよう】
ここからは、サイトをよりカッコよくしていくための技術となってきます。
サイトに動きをつけたり、サイトをもっと見やすくするために必要となるのがJavaScriptというプログラミング言語になります。
ただ、JavaScriptは難しく、習得するのに時間がかかるため、短期間でWeb制作を習得するためにjQueryを学びましょう。
jQueryとはJavaScriptのライブラリのことで、簡単に言うと、JavaScriptのコードを短く簡潔なコードにして使いやすくしたものといったイメージです。
JavaScriptの複雑なコードを、jQueryを使用することにより簡単に実現することができます。
実際の学習方法を解説していきますね。
学習③-1：ドットインストール（jQuery入門）
またまた定番のドットインストールです。
全13回なので40分ほどで一通り学習できます。
学習③-2：jQuery最高の教科書
知識ゼロの初心者でもわかりやすい本です。
説明も丁寧ですし、ステップアップ解説なので、途中で挫折せずに進めていけます。
知識ゼロの状態から実践で使用できるレベルまで引き上げてくれる1冊です。
④：PHP【自由度の高いWebサイトにしよう】
ここからは、さらに自由度の高いWebサイト作りの知識を身につけていきます。
「お問い合わせフォーム」や「コメント機能」など、サイトをより便利にするプログラムを学習しましょう。
学習④-1：初心者からちゃんとしたプロになる PHP基礎入門
2021年に発売された比較的新しめなPHPの入門書です。
Web制作に必要な知識がしっかり習得できます。
実践を踏まえた解説となっているので、かなり実用向きの使える1冊です。
学習④-2：ドットインストール（はじめてのPHP）
ここでもドットインストールを使ってサクッと学習しましょう。
「はじめてのPHP」が終わったら「詳解PHP 基礎文法編」も見ておきましょう。
>>詳解PHP 基礎文法編（全34回） — ドットインストール
⑤：SEO【Webサイトのアクセス数を増やそう】
ここまでくると、自分好みのWebサイトが作れるようになっていると思います。
あとは、多くの人に見てもらうためにSEOの知識を学習しましょう。
SEOの学習方法について解説しますね。
学習⑤-1：現場のプロから学ぶ SEO技術バイブル
SEOの知識と技術が一通り学べる本で、ちょっと分厚めですが、読みやすくわかりやすい。
基礎から実際の運用方法まで網羅されている「まとめ集」といった感じです。
学習⑤-2：SEO対策の動画講義
動画で学習したい方は、マナブさんのYouTube動画、SEO対策の動画講義【SEO歴６年のノウハウを完全公開】がおすすめです。
86分ある長編の動画ですが、かなり詳しくSEOについて解説されている有料級の動画です。
学習⑤-3：コピーライティングを学ぶ
SEOを理解することで、Webサイトの集客（アクセス数）を増やすことができます。
SEOで上位表示され、せっかくアクセス数が増えても、記事の内容が良くなければ、ユーザーの満足のいくサイトとはなりません。
そこで、より有益なコンテンツを作るために、ライティングを学習しましょう。
ライティング技術は、かなり実用的なスキルでして、ブログやサイト運営だけではなく、Webマーケティング職やフリーランスのWebライターなど多様な仕事につながります。
ライティング学習には、バズ部の記事とおすすめの書籍をご紹介します。
>>たった1記事で8万人に読まれる文章を書けるようになるライティング術（バズ部）
>>コンテンツマーケティングとは？｜広告費ゼロで10倍の売上を達成した手法（バズ部）
より本格的にライティング力を磨きたい方や、短期間で上達したい方は、オンライン講座でライティングを学ぶのもアリです。
無料体験があるので、まずは気軽に試してみてください。
>>パーソナルWebライティングスクールの無料体験を見てみる
コピーライティングのおすすめ本については下記の記事にて紹介しています。
まとめ：Web制作のスキルを習得し将来に活かそう！
今回は、独学でWeb制作を学びたい方に向けて、独学での学習方法を解説しました。
この記事は、僕自身が実際に学んだ方法を元に、より多くの方にも実践できる形でお伝えしました。
もちろん、学び方もさまざまな手段がありますし、適した学習方法も人それぞれです。
ご自身にあった独学方法を見つけるためにも、この記事が少しでも参考になれば嬉しいです。
今回は以上です。
-
-
【10分で完了】WordPressブログの始め方【初心者でも簡単開設】
続きを見る
