エックスサーバーにHTMLをアップする正解ルート
エックスサーバーで取得した独自ドメインに、手元で作成したHTMLファイルを直接アップロードして表示させる手順について。
それは、「サーバーの『ファイル管理』画面を開き、自分のドメイン名のフォルダ内にある『public_html』フォルダの中に、『index.html』という名前のファイルをアップロードする」だけです。
難しい専用ツールは一切不要で、ブラウザ上のクリック操作のみで完結します。とてもシンプルな操作ですが、Webサイト制作が初めてだった私は、この答えと「謎の横文字用語」がわからず、そのまま進め、あとで解説してもらいました。
とりあえずHPをすこしずつ作成するしかない
現在、事業のスタートで準備を進め、最終的にはWordPressを使って本格的なホームページを作る予定です。最終的には外部に依頼したいと思っています。独自ドメインの取得とサーバーのSSL化(セキュリティ設定)までは順調に終わっていましたが、WordPressのデザインや文章をしっかり整えるには、まだまだ時間がかかりそうでした。
そこで、簡単なHTMLデータだけでもアップロードして、いち早くサイト表示のテストをしようと考えました。事前に無料のサービスを使ってHTMLの表示確認は済ませており、そこでは直感的な操作で簡単に公開できたため、エックスサーバーではどうするのか不明でした。
初心者疑問その1:そもそもどうしたらいいのか
コードを直接貼るのではなく、ファイルそのものをサーバーに置けばいい
初心者疑問その2:エックスサーバーの管理画面で完全に迷子になる
次に、エックスサーバーの管理画面から直接ファイルをアップロードしようと試みます。
「ファイル管理」というボタンを押すと、パソコンのフォルダ画面のようなものが開きます。自分のドメイン名のフォルダまではすぐに見つけることができました。しかし、そのドメインフォルダを開くと、見慣れない英語名のフォルダがズラリと並んでおり、手元のHTMLファイルをどこに保存すればいいのか全く見当がつきません。
適当な場所に置いてサーバーが壊れてしまったらどうしようと怖くなり、ここで完全に手が止まってしまいました。
正解のアップロード手順と、2つの重要用語の意味
Geminiに確認し、インターネット上に公開するデータを置くための「ここに入れなければいけないフォルダ(public_html)」と、「この名前にしなければいけないファイル(index.html)」のルールが存在することを知りました。
私と同じように画面の前でフリーズしてしまわないよう、この2つの用語の意味を交えながら、具体的な手順を3つのステップで振り返ります。
ステップ1:「ファイル管理」を開く
まずはエックスサーバーの管理画面にログインします。
画面右側にある「ファイル管理」というボタンをクリックします。すると、新しい画面で「ファイルマネージャ」というフォルダ一覧が開きます。
ステップ2:自分のドメインフォルダの中の「public_html」を開く
一覧の中から、今回ホームページを表示させたいドメイン名のフォルダを探してクリックします。
フォルダが開いたら、次が最も重要なポイントです。その中にある「public_html」という名前のフォルダをクリックして開きます。
【用語のメモ:public_htmlとは?】
サーバーを一つの大きな建物だとすると、この「public_html」は外から見える「ショーウィンドウ」や「展示室」のような役割を持っています。「public(公共の)」「html(Webページ)」という名前の通り、このフォルダの中に入れたファイルだけが、インターネットを通じて世界中から見られるようになる仕組みです。逆に言えば、この箱の外にいくら立派なデータを作って置いても、誰の目にも触れることはありません。(※Geminiの回答)
ステップ3:「index.html」という名前でファイルをアップロードする
「public_html」フォルダを開いた状態のまま、画面の上の方にある「アップロード」ボタンをクリックします。
あとはパソコン内に保存してある「index.html」ファイルを選択し、アップロードを実行するだけです。私は、いまのところアップロード直前まで別の名前で、そのファイルをコピーして、index.htmlと名前を変えて、アップロードしています。
【用語のメモ:なぜ「index.html」という名前なのか?】
手元で作ったHTMLファイルの名前は、必ず「index.html」にする必要があるようです。
「index」には「見出し」や「目次」という意味があります。インターネットの世界では、「あなたのURL(ドメイン)にアクセスしてきた人がいたら、まずは『index.html』という名前のファイルを一番最初の表紙として見せなさい」という世界共通のルールがあります。
もしファイル名を「top.html」や「aisatsu.html」にしてしまうと、URLを入力しただけでは画面が表示されず、見に来てくれた人は迷子になってしまいます。「index.html」は、ホームページの玄関のドアそのものなのです。(※Geminiの回答)
※初心者が手が止まったポイント
もし「public_html」の中に、最初から「default_page.png」や「index.html」といったファイルが入っていたら少し驚くかもしれません。これは、サーバー側が「まだサイトがない状態の時に表示させる仮の玄関」として用意しているものです。自分の作った「index.html」をアップロードする際に「上書きしますか?」と聞かれることがありますが、今回は、そのまま上書きしてしまって全く問題ありません。
アップロードが終わったら、ブラウザで自分のドメインにアクセスしました。手元のHTMLファイルが、自分のURLで表示されていました。
まとめ:失敗のおかげでサーバーの仕組みが少しだけ分かった
今回の作業の重要ポイントをまとめます。
- エックスサーバーの「ファイル管理」画面を開く
- 自分のドメイン名フォルダの中にある「public_html」フォルダを開く(インターネットへの公開窓口)
- その中に、手元のファイルを「index.html」という名前でアップロードする(ホームページの表紙!)
見慣れないフォルダ群に戸惑い、途中で投げ出しそうにもなりましたが、その過程で「public_html」と「index.html」という、基本ルールを学ぶことができました。
無事に、第一歩を踏み出せました。とりあえずHTMLファイル1枚だけでもサイトを表示させておきたいと考えている方が、この文章を読んでつまずかずに進められることを願っています。ここからは少しずつ、本格的なホームページ構築を進めていきたいと思います!こんなことをしているよりも、本業をしっかりやらなければ、という焦りはあります。
2026/04/04土 12:52

コメント