何かあればTwitterにご相談いただければサポートいたします！
≫Twitterアカウント
この記事を読めば、インターネットにWebサイトを公開する方法がわかります。
50枚の画像を使って、初心者の方にもわかりやすく解説していきますのでご安心ください。
まず、インターネットにWebサイトを公開するまでの手順を理解しましょう。
Webサイトを公開するまでには、以下の作業が必要になります。
国内シェアNo1の「エックスサーバー」を使えば、
今なら、最大10,000円割引特典がつきますので是非活用ください。
※私も8年くらいXserver使っています！
目次
Webサイトを公開するまでの基本知識
まず「Webサイトをインターネットに公開する」ということですが、わかりやすいように「家を建てること」に置き換えてみました。
- サーバー：Webサイトを置くための土地
- ドメイン：土地に建てた家の住所（Webサイトのアドレス）
- ファイルのアップロード：家に家具を設置する（Webサイトの構成）
サーバーとは
サーバーはWebサイトを置くための場所です。
Webサイトをネット上に公開するためには、サーバーが必要になります。しかし、サーバーを用意しただけでは、Webサイトの公開はできません。
サーバーを用意した後は、ドメインを取得し、サーバーにHTMLファイルや画像ファイルなどをアップロードする必要があります。
ドメインとは
当ブログでいうところの、「koreblog.net」がドメインになります。
サーバーは1つレンタルすれば、何個でもWebサイトを公開することができます。
※正確には容量によりますが、初めのうちは気にしなくても問題ありません。
ドメインは、1つのWebサイト（家）につき、1つ用意する必要があります。ですので、公開したいWebサイトの数だけドメインを用意しなくてはなりません。
ちょっと難しく感じるかもしれませんが、Webサイトを公開する手順は、実はシンプルで簡単です。画像付きで詳しく説明していくのでご安心ください！
それでは、1つずつ手順を詳しく解説していきます。
エックスサーバーでWebサイトを公開する
まずは、「①サーバー：Webサイトを置くための土地」を用意します。
レンタルサーバーは、手順にそって申し込みをするだけで、簡単に利用可能になります。目安として、作業時間は10〜20分くらいで完了します。
Webサイトを公開するためのエックスサーバー申し込み方法
レンタルサーバーは何社かありますが、
一番のオススメは「エックスサーバー」です。
さらに、今なら
お申し込みで最大10,000円割引特典がつきますので是非活用ください。
エックスサーバーをおすすめする理由
- ブロガーなど利用者が圧倒的に多い
- サーバー環境が安定している
- WordPress簡単インストール、SSL化など、簡単設定できる仕組みがある
- 初心者でも非常に操作しやすい
- 料金が安くてハイスペック
高スペック、高品質、サポート完備のエックスサーバーを選んでおけば、間違いはありません。ちなみに、私もエックスサーバーを愛用しています。
エックスサーバーの申し込み手順
それでは、Xserverに登録して「Webサイトの公開に必要なサーバー」の用意をしましょう。画像付きで詳しく解説していきます。
まず、エックスサーバーのページへアクセスしましょう。
アクセスしたら、お申し込みボタンにカーソルを合わせ、「サーバーお申し込みフォーム」をクリックします。
「10日間無料お試し 新規お申込み」をクリック。
- サーバーIDはWebサイト上には表示されないので、好きなものを入力してOKです。
- プランは「X10プラン」を選んでおきましょう。
続いて、お客様情報を入力します。
入力内容を確認したら、画面下にある「SNS・電話確認へ進む」をクリックします。
- 携帯の電話番号を入力。
- 「テキストメッセージで取得（SMS）」を選択。
SMS認証が完了すると、登録したメールアドレスに「【Xserver】■重要■サーバーアカウント設定完了のお知らせ[試用期間]」という内容のメールがエックスサーバーから届きます。
その中に記載されている、ユーザーアカウント情報が必要になりますので、こちらをメモしておきましょう。
ここまでで、エックスサーバーの仮契約が完了です！
エックスサーバーにログインする
エックスサーバーの仮契約が完了したので、次はエックスサーバーのインフォパネルにログインしてみましょう。
先ほどのメール「【Xserver】■重要■サーバーアカウント設定完了のお知らせ[試用期間]」に記載されているユーザーアカウント情報の「会員ID」と「インフォパネルパスワード」を入力して、ログインボタンをクリックします。
ログインができれば、エックスサーバーの新規登録は完了していますが、ここで忘れないように「料金の支払い設定」をしておきましょう。
左側のメニューにある、「料金のお支払い/請求書発行」をクリックしましょう。
レ点にチェックを入れます。希望する更新期間を選択して、「お支払い方法を選択する」をクリックしましょう。
支払い方法は、銀行振込やコンビニ支払いがありますが、クレジットカードが非常に便利ですので、クレジットカード決済にしておきましょう。
（支払い忘れでサーバーが繋がらなくなる最悪の事態を防げます）
クレジットカードの情報を登録して支払い設定が完了です。
エックスサーバーの自動更新設定
エックスサーバーには、自動更新の設定もあります。「12ヶ月後の更新処理を忘れてしまいそう…」という方は、こちらの登録もおすすめです。
インフォパネルの左側にある、「カード自動更新設定」をクリックします。
- 自動更新設定したい場合は「設定」ボタンをクリック。
- 解除するときは「解除」ボタンをクリック。
サーバーアカウントは1ヶ月ごとの自動更新が可能です。
料金はX10サーバーで、月々1,100円(税込）です。
なお、クレジットカード情報の登録がまだの場合は、こちらのボタンから登録しておきましょう。
ここまでで、サーバーの申し込みが完了です！
次はドメインの取得について解説していきます。
Webサイトを公開するために、ドメインを取得する
次に、ドメインを取得してみましょう。
先ほど契約した土地（サーバー）に、家（Webサイト）を建てる手順です。
ドメインを使えるようにするまでの手順です
大変だなと感じるかもしれませんが、手続き自体は非常にシンプルで簡単です。
画像を使って詳しく説明していくのでご安心ください。
エックスドメインを使う
それでは、まずドメインを取得していきましょう。
ドメインの取得は、ドメイン購入ができるサービスを利用して購入します。購入できるサービスはたくさんありますが、エックスサーバーを使うのならエックスドメインが便利です。
まずは、エックスサーバーのインフォパネルにアクセスしましょう。
ログインできたら、サービスのお申し込みをクリックします。
ログインできたら、サービスのお申し込みをクリックします。
新規申し込みをクリックします。
同意するをクリック。
取得したいサイトのドメイン名を入力します。
koreblogだと、現在利用できるのが.net、.info、.orgなどなど。
逆に利用できないのが.comと、.xyzと、.site、.onlineが×になっていますね。
取得したいドメイン名で、利用されていないものを選んで購入します。
エックスサーバーを利用する場合は、必ず「『エックスサーバー 』を設定する（標準）」にチェックを入れておきましょう。後ほどの設定が必要なく、簡単にドメインを利用できるようになります。
内容を確認できたら、クレジットカード決済画面へ進むをクリックします。
- ドメインは、基本的に何を選んでもさほど差はない
- ドメインの種類によって値段が大きく変わる
- 企業向け「.inc」「.co.jp」
ドメインに悩んだ場合は、.comや.netなど、有名なものを取得するようにしておきましょう。
クレジットカードの情報を入力して、カードでのお支払い（確定）をクリックします。
最後に入力内容を確認して、お支払いを確定します。
支払いが完了すればドメインの購入が完了です。
トップページへもどり、ドメインの欄に購入したドメインが表示されているか確認しましょう。
ドメインは、取得したドメインとサーバーを紐付け設定しないと使えません。そちらも詳しく解説していきます。
エックスサーバーにドメインを設定してWebサイトを公開
エックスサーバーと、購入したドメインの紐付け設定をします。
この設定をしないと、インターネットでWebサイトを表示することができません。
購入した土地に、家を建てるところです。
- エックスサーバーのサーバーパネルにログイン
- ドメイン設定
難しいことはなく、ボタンを押すだけの簡単作業です。
それでは順番に解説していきますね。
まずは、エックスサーバー のインフォパネルにログインします。
ドメイン設定と確認
インフォパネルに接続したら、先ほど購入したドメインが追加されているかを確認しましょう。
こちらに表示されていれば、ドメインの購入が完了していることになります。
では、ドメイン設定を進めましょう。サーバーにある「サーバー管理」をクリックします。
サーバーパネルにログインしたら、右上にある「ドメイン設定」をクリック。
次に「ドメイン設定追加」をクリック。
- ドメイン名に、先ほど取得したドメイン名を入力。
- 無料独自SSLを利用する（推奨）にチェック
- 高速化・アクセス数拡張機能「Xアクセラレータ」を有効にする（推奨）にチェック
上記の項目を全て確認し、確認画面へ進むをクリック。
追加するをクリック。
これでドメインの追加は完了です。
ドメイン設定一覧を確認して、追加されていればOKです。
ドメインの設定にはある程度時間がかかりますので、しばらく時間を置いてから確認しましょう。
ドメイン名にアクセスしてみる
設定が完了したら、Webブラウザに設定したドメイン（URLアドレス）を入力して、Webページにアクセスしてみましょう。
上記のページが表示された場合は、反映中のためもう少し時間を置いて確認しましょう。
上記のページが表示されたら、ドメインの設定が完了したことになります。
これで習得したドメインが、正しくWebページ上に表示されました。
無料独自SSLの設定に失敗しました。と表示された場合
別の設定画面から改めて無料独自SSL化する必要があります。
SSL化について、詳しくは下記の記事にて解説しています。
公開したWebサイトを独自SSL化でセキュリティ強化
SEO的にもセキュリティ的にも、独自SSL化は必ずしておきましょう。
上記の部分ですね。
- アドレスのところに鍵マークがついている
- 「https」となっている
上記の表示がされていれば、そのサイトは独自SSL化されていることになります。
やることは非常に簡単です。
独自SSL化の手順と、ドメインの転送設定（http://~~ → https://~~）について、下記の記事に詳しくまとめています。
HTMLファイルなどをアップロードしてWebサイトを公開
さて、いよいよ最後になりました！
Webサイトを公開するまでもう少しです。
Webサイトを公開するためには、エックスサーバーにHTMLファイルや画像データなどをアップロードしなくてはなりません。
FileZillaをダウンロード
ファイルをアップロードするためには、専用のソフトが必要になります。
今回は、私も利用している「FileZilla」を使ってアップロードする手順を説明します。無料で使えますのでご安心ください。
まず、下記のリンクより「FileZilla」をダウンロード＆インストールしましょう。
- Windowsを利用の方：https://filezilla.jp.uptodown.com/windows
- Macを利用の方：https://filezilla.jp.uptodown.com/mac
ダウンロードが終わったら、インストーラーの手順に従ってインストールをしましょう。
FileZillaで必要なファイルをアップロード
インストールが完了したら、さっそくファイルをアップロードしてみましょう。
まずは、FileZillaを起動します。
起動したら左上のアイコンをクリック。
サイトマネージャーが開くので、「新しいサイト」をクリック。
サーバーの名前を決めて（なんでもOKです）、右側のホストなどの情報をいれていきます。
接続に必要な情報は、エックスサーバー契約時のメールにて確認できます。
- サーバー番号
- サーバーID
- サーバーパスワード
なお、こちらはXserverのサーバーパネルからも確認ができます
確認方法は下記の通りです。
- インフォパネルにログイン
- サーバー管理を選択
- FTPの「サブFTPアカウント設定」をクリック
- すべてのドメインの選択するをクリック
- FTPソフト設定をクリック
必要な情報が確認できたら、情報をFileZillaに入力して接続をクリック。
無事に接続が完了すると、下記の画面になります
いろんなフォルダが表示されていますが、先ほどのドメイン設定が完了していれば、この中に、先ほど設定したドメイン名と同じフォルダが存在するはずです。
そのフォルダをダブルクリックして階層を進んでみましょう。
するとこのような画面になります。
この中に「public_html」があります。「public_html」フォルダの中に、ファイルをアップロードすれば、インターネットでそのファイルの中身が公開されます。
HTMLファイルや画像データをアップロードすれば、Webサイトの公開が完了です！
既に入っている「index.html」は、エックスサーバーが用意したファイルなので、上書きしましょう。
ファイルのアップロードが完了したら、Webブラウザでコーディングした内容と同じものが表示されているか確認しましょう。
表示されていたら、正しくWebサイトが公開されたことになります。
これであなたのWebサイトがインターネットに公開されましたね！おめでとうございます！
Webサイトを公開するまでの手順まとめ
無事にあなたのWebサイトをインターネットで公開することができました。
もう一度、Webサイトを公開するまでの流れをおさらいしておきましょう。
上記の手順を、一通りご紹介しました。
Webサイト公開の基本手順は、これにて完了です。
サイト制作では、Webサイトを公開するまでの作業は必ず必要な知識になります。
「Webサイトをインターネットに公開する」という手順を必ず実践しておきましょう。
