この記事を読むあなたは恐らく
ホームページが自分で作れるようになりたいんだけど
どう勉強すればいいんだろう？ 仕事にもできるかな？
そんなふうに思っているのではないでしょうか。結論から言えば、ホームページを制作することは全くの初心者でも可能です。学ぶスキルは多いものの、この記事を読めば、
- ホームページを作る方法
- ホームページ制作に必要なスキル
- ホームページ制作の勉強法
以上の3つがしっかりわかることでしょう。私自身の経験をもとに、初心者にもわかりやすいようにまとめましたので、ぜひ最後までお読みください。
- ホームページ制作にはHTML/CSSやPHPなどの言語を扱うスキルが必要
- 初心者は無料ブログやWordPressを活用したホームページ制作がおすすめ
- WebデザインやSEOなどのスキルはホームページを活用した収入獲得に役立つ
なお、どのプログラミング言語を学べばいいのか、どう学習を進めればいいのかなどがあいまいな人は「プログラミング学習プラン診断」をお試しください。
かかる時間は1分ほど。4つの質問に答えるだけで、あなたにあう言語や学習プランを診断してもらえます。
これからプログラミングを学ぼうとしている人は、ぜひ一度お試しください。
本記事の解説内容に関する補足事項
本記事はプログラミングやWebデザインなど、100種類以上の教材を制作・提供する「侍テラコヤ」、4万5,000名以上の累計指導実績を持つプログラミングスクール「侍エンジニア」、を運営する株式会社SAMURAIが制作しています。
また、当メディア「侍エンジニアブログ」を運営する株式会社SAMURAIは「DX認定取得事業者」に選定されており、プログラミングを中心としたITに関する正確な情報提供に努めております。
記事制作の詳しい流れは「SAMURAI ENGINEER Blogのコンテンツ制作フロー」をご確認ください。
当ブログがオススメする
無料プログラミング学習サイト3選
| 1位：侍テラコヤ | 2位：Progate | 3位：ドットインストール | |
|---|---|---|---|
| サイト名 |  |  |  |
| 学べる内容 | HTML/CSS、JavaScript、jQuery、Bootstrap、PHP、Laravel、Ruby、Ruby on Rails、Python、Java、WordPress、Cloud9、Git、AWS 、ChatGPT、Webデザインなど | HTML/CSS、JavaScript、PHP、Ruby、Python、Java、Go、Git、SQL など | HTML/CSS、JavaScript、Ruby、Python、Java、C言語 など |
| 質問 相談サポート | |||
| 練習問題の数 | |||
| 特徴 | 現役エンジニアとのマンツーマンレッスン 回答率100%のQ&A掲示板が使い放題 実践的なスキルを身につけられる課題機能 | 環境構築をしなくても学べる イラスト付きのスライド式教材 スマホアプリでも学べて手軽 | レッスン動画でインプット可能 3分の簡単な動画で手軽に学べる 有料プランなら質問ができる |
| 詳細 | 公式サイト | 公式サイト | 公式サイト |
勉強する前に確認してほしい2つのこと
ホームページの制作の勉強を始める前に確認してほしいことが2つあります。
目的をしっかり確認する
まずは、自分の目的をはっきりさせることが大事です。単純に趣味レベルでホームページを作ることができればいいのか、ホームページ制作でお金を稼いでいきたいのか。
前者であれば本格的なホームページでなくても、FacebookやTwitterなどのSNSで十分なことも多いです。後者であればクライアントの様々なニーズを形にするために、専門の知識技術が必要になることでしょう。
目的によって、学習するジャンルも方法も異なりますので、まずは「なぜ自分がホームページ制作の勉強をしたいのか？」をはっきりさせましょう。
本当に勉強する必要があるのかを確認する
もう一つ、「本当にホームページ制作の勉強する必要があるのか？」も確認しておきたいところ。
自分でホームページを制作したいと思っている場合、後述する無料のホームページ作成サービスを利用すれば深く勉強する必要はありません。外注しても5000円程度で作れる場合もあります。品質の割に価格はそれほど高価ではありません。
またホームページ制作を仕事としたい場合なら、自分は営業を担当し制作は専門の方にお願いして中間手数料をいただくやり方もあります。ホームページ制作がしたいわけではなく単純にお金を稼ぐことが目的なのであれば、こういった選択肢があることも覚えておくといいでしょう。
勉強すべき4つのスキル
ここからはホームページの制作で勉強すべきスキルについてご紹介していきます。
HTML/CSS
ホームページ制作の基本となるのがHTML/CSSです。
HTMLはHyper Text Markup Language（ハイパーテキスト・マークアップ・ランゲージ）の略で、ホームページにテキストや画像などを配置するための言語です。
CSSはCascading Style Sheets（カスケーディング・スタイル・シート）の略で、HTMLと組み合わせて、テキストや背景の色を変えたり等、装飾をするために使う言語です。この2つはセットで用いられますので、勉強は必須です。
※HTML/CSSの詳しい説明は以下の記事をお読みください。
PHP
PHPはWebサイトの制作に特化しているプログラミング言語です。後述するブログ作成ソフトWordPressもPHPでできており、ホームページを制作する上では定番です。構文がシンプルでプログラミング未経験の方でもとっつきやすく覚えやすい言語と言われています。
※PHPの詳しい説明は下記の記事をお読みください。
Javascript/JQuery
Javascript/JQueryは、ホームページに「動き」を出すために用いられます。
前述のHTMLとCSSを使って記述するので、今や多くのホームページで使われている人気の言語で、こちらも今や必須のスキルと言えるでしょう。HTML/CSSと合わせて学習することをおすすめしたい言語です
※Javascript/JQueryの詳しい説明は下記の記事をお読みください。
WordPress
WordPressは世界最大のシェアを誇るブログ作成ソフトです。無料で使えて拡張性も高いので、なんと世界のWebサイトの3分の1以上はWordPressでできているほどです。
実際、以下の有名企業のホームページはWordPressで作られています。
- クックパッド株式会社 ⇨ https://info.cookpad.com/
- 株式会社LIFULL ⇨ https://lifull.com/
- 株式会社オリエンタルランド ⇨ http://www.olc.co.jp/ja/index.html
利用する企業は続々と増えており、今やホームページ作成において欠かせない存在です。
※WordPressの詳しい説明は下記の記事をお読みください。
一緒に勉強すると役立つスキル
ホームページの制作には直接影響はしませんか、以下のスキルも覚えておくと役に立ちます。
Photoshop/Illustrator
ホームページで使用する画像素材（ロゴや商品の写真など）を作成・編集するのに、PhotoshopとIllustratorの2大デザインソフトは使えるようにしておくと有利です。Photoshopは画像の編集など、ホームページで使用する画像素材の作成全般に、Illustratorはロゴやイラストの作成に用いるソフトです。
※Photoshop/Illustratorの勉強におすすめの本はそれぞれ以下の記事をどうぞ。
SEO
せっかく良いホームページを作っても、集客できなければ意味がありません。
そのため、Web集客の鉄板である「SEO（検索結果の上位表示）」の最低限の知識はつけておくといいでしょう。検索で上位が確保できれば安定的なアクセスが得られますよ。
SNS
SEOと並行して、FacebookやTwitterなどのSNSの運用もしておくといいでしょう。
SNSでの知名度を高めておくことは、SEO以上の集客源にもなる可能性があります。また、Googleの検索アルゴリズムの変化に伴って順位が低下してしまうリスクにも備えられます。
アクセス解析
Google Analyticsなどのアクセス解析ツールを使い、ホームページのアクセス数や滞在時間、離脱率などの数字を把握しておくことも大切です。
ホームページは作って終わりではなく、運用して改善していくものです。そのため、ホームページのどこに課題がありどう解決したらいいのかがわかるアクセス解析のスキルもまた重要といえます。
おすすめ独学勉強法3ステップ
では上記のようなホームページの制作スキルを身につけるには、どのように学習を進めていけばいいのでしょうか？私の経験上、最良の方法はとにかく手を動かすことです。そんな経験を踏まえた独学の学習法を書いていきます。
ステップ1：無料ブログでHTMLやCSSの概念に触れる
まずはホームページの基本となるHTMLやCSSを覚えるのが第一です。
おすすめの方法は、アメブロやライブドアブログなどの無料ブログサービスでブログを作成し、それを独自にカスタマイズすることです。すでにある程度デザインが固まったものをいじるのが、手軽でわかりやすいからです。
文字のフォントや大きさ、ブログの背景などを変えてみたり自分好みにカスタマイズしてみましょう。最近は無料ブログでも、それなりに広い範囲でカスタマイズが可能です。
カスタマイズ情報は「アメブロ css カスタマイズ」などでGoogleで検索すれば、多くの情報が出てきますので、まずはこれらを参考にHTMLとCSSの概念を覚えましょう。
ステップ2：WordPressでホームページを作ってみる
無料ブログでのカスタマイズに慣れたら、次はWordPressを使って簡単なブログを作成しましょう。より本格的なカスタマイズが可能です。
WordPressには、前述したPHPとJavaScript/jQueryが使われていますので、これらの概念を把握するのにぴったりのツールです。Wordpress自体は無料ですし、レンタルサーバーも無料のサーバーがいくつかありますので、費用をかけずに本格的にホームページで使われる言語の勉強ができます。
ここでも「ステップ1」のときと同じく検索し、自分の欲しい情報を見つけて慣れていくといいでしょう。
ステップ3：学習サイトや書籍を使って学ぶ
ここまでやれば、ステップ1〜2で紹介した「ホームページの制作に必要なスキル」は一通り触れたことになります。。
正直ここまで慣れれば、自分のホームページをある程度自由に作ることも可能です。ごく簡単なホームページの制作の仕事を受けることもできます。
しかし、
- より本格的なホームページの制作がしたい
- 企業を相手にしてホームページ制作の仕事が取りたい
というのであれば、 実力をより確かなものにするために、各スキル別に無料学習サイトや書籍を使って勉強を進めていくことをおすすめします。
おすすめのサイト・書籍
最後に、ホームページ制作の勉強におすすめのサイト・書籍をそれぞれご紹介します。
侍テラコヤ
Webサイト制作に必要な知識を体系的に学び、ホームページ制作や副業のための案件獲得スキルを身につけることが可能です。
登録無料で100種類以上の教材が学べる侍テラコヤは、
- 回答率100％のQ&A掲示板
- 必要に応じて受けられるオンラインレッスン
といったサポート体制を整えているため、学習中に出てきた不明点を解決しながらスキルの習得が可能です。また「学習ログ」で勉強の進み具合やこれまでの学習時間を確認しながら、自分のペースで学習を進められます。
なお、侍テラコヤは入会金不要・いつでも退会OKに加え、「無料会員登録」でお試し利用ができるので「他のサービスを選べばよかった」と後悔する心配もありません。
コスパよく効率的にスキルを習得したい方は、ぜひ侍テラコヤをお試しください。
| 運営会社 | 株式会社SAMURAI |
| 実績 | ・業界最安値0円から ・累計登録者1万8,000名以上 ・講師満足度95% |
| 受講形式 | オンライン ・テキスト/動画視聴 ・マンツーマンレッスン |
| 習得できるスキル | HTML、CSS、PHP(Laravel)、Ruby(Ruby on Rails)、Python、Java、JavaScript (jQuery) 、AWS、Linux、ITパスポート、Webデザイン、WordPressなど |
| 担当講師 | 現役エンジニア/Webデザイナー |
| 対応時間 | 全日24時間 ※営業時間(10時~22時)外の質問は翌営業日に回答 |
| サポート内容 | ・無料でのお試し利用可能 ・100種類以上の教材閲覧 ・回答率100%のQ&A掲示板 ・現役エンジニアとのマンツーマンレッスン(回数制) ・就職/転職サポート(20~31歳の利用者に限る) |
| アクセス | 完全オンライン |
| 備考 | ※全プランの共通事項 ・入学金：無料 ・利用継続：最短1ヶ月から利用可能 ・全額返金保証制度あり ・1レッスン時間60分 |
・各項目は公式サイトに記載された情報をもとに掲載しています。
・料金には2024年2月時点の税込み価格を掲載しています。
その他のプログラミング学習サイト
これらはどれも無料でプログラミングを学習できるサイトです。ゲーム感覚でスライド式で学習することができたり、動画を見ながら空き時間でサクッと勉強できたり、それぞれ特色があります。
まずは5つのサイトを全部を見てみて、自分に合ったものを選んで学習を進めましょう。
これらのサイトの詳細やより高度なレベルの勉強をしたいという方は、以下の記事もご覧ください。
おすすめの書籍
続いて書籍ですが、それぞれスキル別に以下の本がおすすめです。
なお、それぞれスキル別のおすすめの本は以下の記事にまとめていますので、気になる方はどうぞ。
まとめ
ホームページの制作スキルを身につけるのは簡単なことではありません。でも自分に合った勉強法を見つければ楽しみつつ学ぶことができるはずです。
この記事をご参考に、ぜひあなたに合った勉強法が見つかりますように！
