この記事を読んでほしい方
- コーディングした制作物を、web上に公開する方法がわからない人。
HTMLやCSSなどでコーディングした制作物をweb上で公開するには、「サーバー」が必要になります。
流れとしては、ローカル（自分のPC）でコーディングしたHTMLやCSSを、サーバーの中に入れて、該当のURLでアクセスすると、サーバーにあるwebサイトにアクセスできます。
※今回は、公開したい制作物がHTML、CSSで作成されている場合について説明します。Wordpressなどで作られたサイトについては若干方法が変わってきます。
必要なツールとその概要
サーバーについて
サーバーは、Webサイトを公開するために必要になってきます。
サーバーにも色々種類があるのですが、初学者の方におすすめしたいサーバーの種類としては、「レンタルサーバー」になります。
有名どころとしては
このあたりになってきますね。
どちらのサーバーも料金プランが設定されておりまして、プランごとに使用できる機能などが変わってきます。
初学者の方であれば、
- エックスサーバー → スタンダードプラン
- さくら → ライトプラン
でよいのではないかと。ただしさくらのレンタルサーバでWordpressを使いたい場合は、スタンダードプラン以上でないと使用できないので注意が必要です。
エックスサーバーが提供しているXFREEは、無料でサーバーを提供しているので、手軽に始めたい方や使い方を勉強したい方ならXFREEを使ってみるのもおすすめです。
こちらのサーバーを使ってwebサイトを公開するときは、広告がついたり、SSL化ができないなど使用する上での不都合はありますが。
▼XFREE
https://www.xfree.ne.jp/
FTPソフトについて
FTPソフトとは、「自分のPCとサーバー間でデータのやりとりを行うためのツール」です。
やりとりとは、ざっくり言うとアップロードやダウンロードを行うものだと考えてください。
僕は、その中の一つでFilezillaを使ってます。無料で使えます。
▼こちらからインストールできます。
https://ja.osdn.net/projects/filezilla/
エックスサーバーやさくらインターネットを契約すると、そのサーバーの管理画面からデータのやりとりはできるのですが、より使いやすくするためにFTPソフトを使うのがおすすめです。
FTPソフトを使ってサーバーにファイルアップロード
HTMLやCSSなどをサーバーにアップします。
手順としては、
- FTPソフトを開く
- サーバー接続情報をFTPソフトに入力して自分のPCとサーバーを繋ぐ
- 自分のPCからサーバーにファイルをアップロード
こんな感じです。
サーバー接続情報は、契約したサーバーの管理パネル（コントロールパネル）から確認できます。
具体的には
- FTPサーバ名
- FTPアカウント
- サーバパスワード
この情報ですね。
ファイルをアップする場所は、契約したサーバーやサーバーの機能によって変わってくるので、ググってみてください！
サイトにアクセスして確認
サイトにアクセスするには、そのサイトのURLが必要になりますよね。
そのURLは、
- ファイルをアップする場所に直接HTMLを入れた場合、「http://初期ドメイン名/HTML名」
- ファイルをアップする場所にフォルダを入れて、その中にHTMLが入っている場合は「http://初期ドメイン/フォルダ名/HTML名」
になります。
このURLを打ち込んで、自分が作った制作物が閲覧できれば成功です！
まとめ
Webサイトを公開する方法をざっくり説明しました。サーバーの使用はエンジニアとしては避けて通れないものだと思いますので、ぜひ興味を持っていただけたらと思います！！
