HTMLファイルを公開して、共有できるリンクにする方法

index.html が手元にあり、CSSや画像もそろっている。必要なのは説明資料ではなく、相手が開けるURL。日本語で「HTMLファイル ホスティング」や「Webサイト 公開」を探す人の多くは、まずこの状態にいます。

この課題は、従来型のサーバー選びとは少し違います。最初に必要なのは、ファイルを正しい形でオンラインに置き、ブラウザで表示できるか確認し、あとから独自ドメインへ進める余地を残すことです。

HTMLサイトとして公開できるもの

DeployPagesで扱うHTMLサイトは、だいたい次の形です。

大事なのはルートです。通常の静的サイトでは、アップロードするフォルダの一番上に index.html があると自然に開けます。ZIPを開いたときに my-site/index.html になっている場合は、フォルダ階層を確認してからアップロードしてください。

最短の手順は、完成したファイルをアップロードすること

小さな静的サイトなら、最初からGitやCIを組むより、アップロードから始める方が早いことがあります。

1. フォルダのルートに index.html を置く。
2. CSS、JS、画像は css、js、images、assets など分かりやすいフォルダに入れる。
3. フォルダまたはZIPをアップロードする。
4. 生成されたHTTPSの公開リンクを開く。
5. 各ページ、画像、CSS、リンクを確認する。
6. 残すサイトだと判断したら、ログインして保存するか独自ドメインを追加する。

この順序が大事です。クライアント確認、授業課題、ランディングページ案、AI生成の試作ページは、最初から長期プロジェクトとは限りません。最初のURLを作る前に大きな設定を求めると、手が止まります。

DeployPagesでは、ホームページのアップロードエリアから静的ファイルを公開できます。HTMLだけに絞った手順は HTML公開ガイド でも確認できます。

ローカルでは動くのに、公開すると崩れる理由

HTMLファイルの公開で一番多い原因は、ホストではなくパスです。

ローカル表示では、ブラウザが自分のPC内のファイルを読めてしまうため、公開後の問題に気づきにくいことがあります。

複数ページがある場合は、ホームページだけでなく各ページを公開URLから開いてください。ナビゲーションで問題が出ることが多いです。

Gitよりブラウザアップロードが向いている場面

Gitは、継続的に開発し、レビューし、繰り返し本番公開するプロジェクトでは有効です。ただし、最初の公開に必ず必要とは限りません。

ブラウザアップロードが向いているのは、次のような場面です。

• デザイナー、クライアント、生成ツール、AIツールから静的フォルダを受け取った。
• リポジトリを作る前にリンクで確認したい。
• 一度きりのイベントページ、オンライン履歴書、授業課題を公開したい。
• ビルド結果をCIに組み込む前に試したい。
• 公開する人がコードを書いた人ではない。

Netlify DropやCloudflare Pages Direct Uploadのように、フォルダやZIPを直接アップロードする公開方法が使われているのは、この需要があるからです。AI生成サイトが増えるほど、まず静的ファイルをURLにする動線は重要になります。

よく使うツール別に、どのフォルダをアップロードするか

迷ったら、index.html とコンパイル済みのアセットが入っているフォルダを探してください。src は多くの場合、公開するフォルダではありません。

信頼できる公開リンクに必要なもの

とりあえずのリンクなら簡単で十分です。ただし、顧客、採用担当者、投資家、クライアントに送るURLには、最低限の信頼要素が必要です。

• http:// ではなくHTTPSで開ける。
• 後から見返せる安定した公開リンクがある。
• 修正版を再アップロードしやすい。
• 独自ドメインへ移行できる。
• 新しいアップロードで問題が出たら以前のバージョンに戻せる。
• 送った相手が開いたかを統計で確認できる。

DeployPagesは、最初のアップロードから 独自ドメイン、グローバル配信、統計、以前のバージョンに戻す操作 へ進める前提で作られています。

アップロード前の2分チェック

公開前に、次だけ確認してください。

1. フォルダを開き、index.html が一番上にあるか確認する。
2. HTML内で参照しているファイル名に余分な空白や記号がないか見る。
3. 可能ならファイル名は小文字にそろえる。Logo.PNG と logo.png は本番環境で別物になることがあります。
4. HTML内で file://、localhost、自分のユーザー名を検索する。
5. ルート構造を確認してからZIP化する。
6. 公開後はPCだけでなくスマートフォンでも開く。

このチェックは、ホスティングサービスを比較するより多くの実務的な問題を防ぎます。

いつCLIやGitへ移行するか

更新がたまにしかない静的サイトなら、直接アップロードで十分です。変更が頻繁になり、ビルド手順をチームで再現する必要が出てきたら、CLIやGitベースの公開へ移行するとよいでしょう。

DeployPagesは、アップロードから始めてもそこで閉じ込めません。最初はブラウザで公開し、繰り返し公開が必要になったら CLI公開 を使い、内容が固まったら独自ドメインを追加できます。

最初に必要なのは、パイプラインではありません。正しく開けるリンクです。

参考

• Netlify Drop documentation
• Cloudflare Pages Direct Upload documentation
• DeployPages HTML公開ガイド