プログラミング学習の基礎が終了したら、ぜひオリジナルのサイトを作ってみましょう。
ただ、サイトを作って世界中に公開するにはプログラミング技術以外の知識も必要ですので具体的に解説します。
目次
プログラミング学習の実践はオリジナルサイト作りが一番
プログラミング学習でHTMLやCSS、JavaScript、PHPについて知識を得たら、それらを実際に使ってオリジナルのサイトを作るとより理解が深まります。
学習の段階ではバラバラだった知識ですが、1つの成果物を作ることでどこに何のプログラムを使っていくのかがより具体的に分かるようになるのです。
またオリジナルサイトを作ることは、学習の次のステップである仕事の受注に不可欠です。
クライアントや転職先の会社はあなたがどんなことをできるかを知りたがっています。
いかに「○○のプログラミングができます」「プログラミング講座を受講しました」と言っても、実際にどの程度のスキルを持っているかは分かりません。
そこで、自作のサイトを見せて実力の証明をするのです。
1からサイトを作る過程ではレンタルサーバーやドメインなどの知識、ファイルをアップロードするためのFTP（ファイル転送プロトコル）ソフトの扱い方などを知ることもできます。
より広い知識を身に着けてレベルアップしましょう。
サイトを作るために必要な物
サイトを作るために必要なものを簡単にまとめました。
テキストエディタ
プログラムを補足してくれたり、コードを色分けしてくれたりするのがテキストエディタです。
いろいろな無料テキストエディタが配布されているので、自分に合ったものを選びましょう（メモ帳にベタ打ちしてもプログラミングはできますが、非常に手間です）。
プログラミング学習の最中に既に何らかのテキストエディタをインストールしている人は、使い慣れたエディタをそのまま使ってください。
レンタルサーバー
サイトを世界に公開するためには、誰でもアクセスできる場所＝サーバーにサイトの材料を置いておく必要があります。
サーバーにはいろいろな種類があります。中でも安くて気軽に使えるのが、他の人と共有で使うレンタルサーバーです。
月額数百円程度から利用できるのが一般的で、中には無料で使えるものもあります。
レンタルサーバーの選び方。WEBデザインやプログラミングにおすすめはコチラ！
ドメイン
サーバーがネット上の土地なら、ドメインはネット上の住所と言われています。
サイトを表示するとき、https://○○○のようなURLをアドレスバーに打ち込みますよね。
この○○○がドメインです。
ドメインはレンタルサーバーから無料で提供してもらえることもありますが、サーバーを移転すると使えなくなるというデメリットがあります。
どこでも使える自分専用のドメインのことを「独自ドメイン」といいます。
まだ使われていない文字列であれば、自分好みのものをドメインとして取得可能です。
画像編集ソフト
自分で撮った写真や無料素材サイトで手に入れた画像などは、大きすぎたり、画面が暗かったりとそのままではサイトで使いづらいことがあります。
そんな時に画像加工ができる編集ソフトがあると便利です。
サイズ変更やちょっとした書き込み処理はパソコンに付属の「ペイント」ソフトで行えます。
より本格的な加工がしたいならPhotoshop等の編集ソフトを用意しましょう。
⇒Photoshop®クリエイター能力認定試験問題集について
FTPクライアントソフト
FTPとはファイルを転送するための決まりのことです。
パソコンで作成したサイトの素材（HTML、Javascriptファイルや、画像データなど）は、サーバー上に配置することで公開することができます。
レンタルサーバー側にもファイルアップロードのシステムが用意されていますが、たくさんのファイルを一度に転送するのは大変です。
また、ファイルに修正が生じた場合の差し替え処理も面倒なものです。
そんな時便利なのがサーバーとパソコンをつなげてくれるFTPクライアントソフトです。
ドラッグやドロップ等の操作で、大量のファイルを簡単にサーバー上に配置できます。
無料のFTPクライアントソフトもたくさん配布されていますので、使いやすいものをインストールしてみましょう。
webサイト（ホームページ）を作る手順
では、実際にサイトを作る手順を見てみましょう。
サイト作成の目的を考える
まずサイト作成の目的を考えます。
プログラミングの実力を見てもらいたいなら、自身のポートフォリオサイトや自己紹介サイトとして作成します。
自分の趣味や得意分野を生かしたサイトを作るのも楽しいですよ。
デザイン・コーディングを行う
サイトの目的が決まったら、サイトのデザインをしていきましょう。
デザイン案が浮かばない時は、いろいろなサイトを見て回って色の組み合わせやレイアウトを参考にしましょう。
ハンバーガーメニューやスライドショーなどの仕掛けを施してプログラミングスキルをアピールしていきます。
学習で身に着けた知識が生かせるようなデザインを考えいましょう。
デザインが決まったら、コーディングをして素材ファイルを完成させます。
きちんと思った通りに表示されるかどうか、ブラウザで確認してください。
レンタルサーバーの契約をしよう
サイトの素材が用意できたら、いよいよレンタルサーバーを導入します。
レンタルサーバーはいろいろな会社が提供しています。レンタルサーバーを選ぶときの比較ポイントをいくつかあげておきます。
値段と容量
レンタルサーバーの値段はおおむね容量と比例します。
どれだけの規模のサイトを作りたいのかによりますが、ちょっとしたポートフォリオサイトレベルならそこまで大きな容量は必要ないでしょう。
無料で利用できるレンタルサーバーもありますが、広告の表示が必須などある程度制限があります。
レンタルサーバーのレンタル料はサイトを続ける限りかかり続けるので、無理なく続けられるプランを選んでください。
セキュリティ
セキュリティ対策がしっかりしていないサイトは、検索エンジンに評価してもらえないことがあります。
特にドメインをSSL化（送受信しているデーターを暗号化）できるかどうかは重要です。
Google ChromeではSSL化されていないドメインにアクセスしようとすると警告表示がでてしまいます。
WordPressの有無
レンタルサーバーのプランの中にはWordpressが使えるものと使えないものがあります。
WordPressを使ってサイトを構築したい場合は、Wordpressの有無をちゃんと確認しましょう。
表示速度
表示速度が遅いサイトはユーザーが離れやすく、検索エンジンに嫌われるといわれています。
表示速度が速いプランほど料金は高くなる傾向にあります。
ドメインを取得しよう
レンタルサーバーを契約したら、次にドメインを取得します。
レンタルサーバーから提供されるドメインをそのまま使うか、独自ドメインを取得するかを決めましょう。
独自ドメインを使うと、レンタルサーバーを変えてもサイトアドレスは変わりませんし、SEO対策にも強いといわれています。
また、好きな文字列をドメインに指定できるのでオリジナルサイトらしさも出ます。
独自ドメインは有料ですが、安いものだと年間1000円程度で手に入ります。ドメインとレンタルサーバーをセットで契約すると安くなる場合もあります。
ドメインをレンタルサーバーに設定すれば、ネット上の土地と住所を手に入れたことになります。
ファイルをアップロードしよう
レンタルサーバーに完成したファイルをアップロードしましょう。
FTPクライアントソフトを使うと複数のファイルを一括転送できて便利です。
パソコン側で修正したファイルをレンタルサーバー上のファイルに反映させることもできます。
オリジナルサイト作りは大変ですが、自分だけのサイトが出来上がっていく過程はとてもわくわくします。
ぜひ楽しみながらオリジナルサイトを作ってみてください。
