AIで作ったサイトをNetlifyで無料公開する方法・使い方

「ChatGPTやClaudeでホームページは作れたけど、どうやってインターネットに公開すればいいの？」と悩んでいる方も多いのではないでしょうか。

とりあえずまずは気軽に、試してみたいという人におすすめなのがNetlify（ネットリファイ）というサービスです。無料で作ったWebサイト(htmlファイル)をそのまま公開することができます。

本記事では、AIで作ったWebサイトをNetlifyで無料公開する方法と、料金の仕組みや独自ドメインの設定方法など、Netlifyの使い方をわかりやすく解説します。

Netlifyとは？無料でWebサイトを公開できるホスティングサービス

Netlifyの特徴とできること・できないこと

Netlify（ネットリファイ）は、アメリカ発のホスティングサービスです。HTML・CSS・JavaScriptで作られた、いわゆる静的サイトの公開に特化しており、ファイルをドラッグ&ドロップするだけでインターネットに公開できます。

Netlifyの主な特徴

無料プランでも商用利用OK。お店や会社のホームページにも使えます
公開がとにかく簡単。サーバー契約もFTPソフトも不要で、フォルダを画面に放り込むだけ
CDNで世界中に配信。見に来た人に一番近いサーバーから表示されるため表示が速い

独自ドメインやHTTPS（SSL）にも無料で対応しているため、「AIで作ったホームページの置き場所」として、現在もっとも手軽な選択肢のひとつです。

一方で、Netlifyは静的サイト専用のサービスなので、次のようなことはできません。

PHPなどのサーバーサイドプログラムの実行
WordPressの設置
MySQLなど、レンタルサーバーのようなデータベース利用
独自ドメインのメールアドレスの送受信

Netlifyの料金プラン｜無料プランの注意制限事項

Netlifyの料金は現在、「クレジット制」という仕組みになっています。無料プランでは毎月300クレジットが付与され、使った機能に応じてクレジットが消費されていきます。

項目	消費クレジット
本番デプロイ（公開・更新）	1回あたり15クレジット
帯域（データ転送）	1GBあたり20クレジット
リクエスト	1万件あたり2クレジット
フォーム送信	無料・無制限
プレビュー・失敗したデプロイ	0クレジット

参考Credit-based pricing plans

300クレジットは、サイト1つあたりではなく1アカウント（チーム）全体で共有する枠です。目安として、月に数回の更新＋個人サイトや小規模店舗のホームページ程度のアクセスであれば、無料枠で十分収まるケースが多いです。

注意点として、月内にクレジットを使い切ると、アカウント内のすべてのサイトが一時停止され、訪問者には「Site not available」というページが表示されます。

無料プランではクレジットの追加購入ができないため、復旧するには翌月のリセットを待つか、有料プランにアップグレードするかのどちらかになります。

使用量が50%・75%・90%・100%に達するとメールとアプリ内通知で知らせてくれるので、通知が届いたら管理画面のUsage & billingで残量を確認しましょう。なお、この画面に表示されるのは使った量ではなく「残りのクレジット数」です。

+ (補)「無料枠は帯域100GBまで」という古い情報について

ネット上の記事では「Netlifyの無料枠は帯域100GB・ビルド300分まで」という解説も多く見られますが、これは2025年9月4日より前の旧料金プランの情報です。それ以降に作成した新規アカウントはすべてクレジット制になっています。旧プランのアカウントは現在も自動移行されず旧料金のまま使えるため、昔からのユーザーは管理画面の表示が異なる場合があります。
参考Billing FAQ for Legacy pricing plans

NetlifyでAIで作ったWebサイトを無料公開する手順

ここからは、実際にNetlifyでWebサイトを公開する手順を解説します。事前に、Claude CodeなどのAIで作成したWebサイトのファイル一式（index.htmlがあるフォルダ）を用意しておきましょう。

ステップ1：Netlifyのアカウントを登録する

Netlify公式サイトにアクセスし、「Sign up」をクリックします。Googleアカウントまたは任意のメールアドレスでアカウント登録が可能です。

登録後、名前や利用目的などを聞かれるアンケート画面が表示されます。個人利用なら「Personal」、経験は「Beginner」など、当てはまるものを選んで進めてください。

ステップ2：ファイルをドラッグ&ドロップして公開する

管理画面の「Projects」を開くと、ファイルをドラッグ&ドロップでアップロードするエリアが表示されます。

ここにAIで作ったWebサイトのフォルダ（index.htmlが入っているフォルダ）をそのまま放り込むだけで、アップロードが完了した瞬間にインターネット上へ公開されます。

公開直後は「ランダムな英単語.netlify.app」のようなURLが自動で発行されます。別のパソコンやスマホからもアクセスできる、正真正銘の公開状態です。

ステップ3：サイトのURL（サイト名）を変更する

自動発行されたランダムなURLはわかりにくいので、変更しておきましょう。プ

ロジェクトの設定（Quick setupまたはProject configuration）から、「〇〇.netlify.app」の〇〇部分を好きな名前に変更できます。すでに他の人に使われている名前は設定できません。

サイトを更新する方法

公開後にサイトを修正したい場合は、AI側でファイルを修正したあと、プロジェクト画面の「Production deploys」に新しいフォルダを再度ドラッグ&ドロップするだけです。アップロードした内容にサイトが差し替わります。

更新（本番デプロイ）は1回につき15クレジットを消費します。300クレジットの無料枠なら、単純計算で月20回まで更新できる計算です。なお、デプロイのプレビューや失敗したデプロイはクレジットを消費しません。

Netlifyに独自ドメインを設定する方法

ネームサーバーを変更する方式が簡単

「〇〇.netlify.app」ではなく、自分だけの独自ドメインで公開したい場合は、別途ドメインを取得して設定します。

ムームードメインなどで取得したドメインをNetlifyにつなぐ流れは次のとおりです。

以下、ドメインをムームードメインなどのドメイン取得サービスで新規取得済みである前提で、Netlifyへの接続方法をご紹介します。

NetlifyのプロジェクトでQuick Setupをクリックします。

先ほどProject Nameは変更したのでSkip this stepをクリック

Add a domain you ownをクリック

取得したドメインを入力して Verifyをクリック

Add domain をクリック

独自ドメインが設定できました。まだ途中の段階で次にネームサーバー設定をしていきます。

Domain Managementをクリック

対象のドメインに対してPending DNS verificationをクリック

「Set up Netlify DNS」に進み、表示されたNetlifyのネームサーバーを控えます。※すでに取得ドメイン（本例ではwebst8.tech)でメールアドレスを取得・メール運用をしている場合はネームサーバー設定すると、既存のメールシステムが動作しなくなるため注意ください。その場合は、　同ページ上部にあるALIASレコードまたはAレコード/CNAMEレコードで設定する必要があります。