「AIでランディングページ（LP）を作りたい」
そう思って調べ始めたものの、次のような壁にぶつかった経験はないでしょうか。
- 英語UIのツールが多く、操作に不安がある
- 日本語で指示しても、英語混じりのLPが生成される
- それっぽいページはできたが、ソースコードが確認できない
- 公開しようとすると、有料プランが前提になっている
本記事は、
「ノーコードでは物足りないが、フルスクラッチも避けたい」
そんな 個人開発者・エンジニア・Web担当者 向けに書いています。
複数の AIサイト生成ツール / Web制作ツール を実際に試した結果、
- 日本語で作れる
- コードを確認・修正できる
- 無料で公開できる
という条件を満たす、
現実的に一番迷わない AI×LP作成フロー が見えてきました。
この記事では、その結論に至るまでの試行錯誤と、
2025年時点での最短ルート をステップバイステップで整理します。
最初に試したAIサイト生成ツール｜Durableはどうだったか？
最初に検討したのは、
AIサイト生成ツールとしてよく名前が挙がる Durable です。
実際に使って分かったこと
🔹 良かった点
- チャット形式で質問に答えるだけでLPが生成される
- 数分でURL付きのWebサイトが完成
- とにかくスピードが速い
「とりあえず形を作る」という点では、非常に優秀なツールです。
🔹 つまずいた点
一方で、実運用を想定すると次の点が気になりました。
- 管理画面や細かい設定がほぼ英語
- 日本語LPにするには、後からの修正が多い
- HTML / CSS のソースコードが確認できない
- 自分で手を入れて育てていく用途には不向き
👉 結論｜Durableが向いているケース
- 広告用に一時的なLPを作りたい
- コードは一切触らない前提
- とにかく早く見た目を用意したい
一方で、
学習・再利用・資産化を前提としたLP制作
には、あまり向いていません。
日本語対応ツールを比較して見えた限界
次に、日本語UIを持つ代表的なWeb制作ツールを比較しました。
比較の観点
- 日本語対応の安定性
- LP用途への適性
- ソースコードの扱いやすさ
- 無料公開の可否
各ツールの特徴
🔹 Wix
- 日本語UI、AI質問形式あり
- 無料プランは
wixsite.comのサブドメイン - 独自ドメイン利用は有料
- ソースコードは基本的に取得不可
👉 AI補助で日本語LPを作りたい人向け
👉 ただし、コード資産としては残らない
🔹 Jimdo（ジンドゥー）
- 完全日本語UI、初心者向け
- AIによる文章生成あり
👉 LPというより、会社サイト・店舗サイト向け
🔹 STUDIO
- 日本語UI
- デザイン自由度が高く、LP向き
👉 AIでコード生成 → 再利用 という用途には不向き
比較して分かった限界
複数ツールを触ってみて、はっきりしたのが次の点です。
「日本語対応」と「ソースコード取得」は、ほぼ両立しない
ノーコード寄りのツールほど、日本語UIは優秀ですが、
コードはブラックボックスになりがちです。
本当にやりたかったことを整理する
ここで、目的をあらためて整理しました。
ゴールの再定義
🔹 本当にやりたかったこと
- 日本語プロンプトでLPを生成したい
- HTML / CSS などの ソースコードを確認・コピーしたい
- 無料ドメインで公開したい
- あとから自分で修正・再利用したい
つまり、
AIは制作補助。主役はコード。
このスタンスに立つと、
「ノーコード完結型ツール」は自然と候補から外れます。
AI×LP制作でたどり着いた現実解
最適解①｜v0.dev + Vercel（コード重視）
この条件に最もフィットしたのが、
v0.dev + Vercel の組み合わせでした。
🔹 なぜこの構成が合っているのか
- 日本語プロンプトでLP構成を生成できる
- React + Tailwind のコードがその場で確認できる
- 生成されたコードはすべてコピー可能
- Vercelと連携してワンクリック公開
- 無料サブドメイン（
xxx.vercel.app）あり
⚠️ 注意点
生成コードは React / Tailwind 前提 になります。
🔹 作成〜公開までの流れ
- Step 1｜v0.dev にアクセスし、GitHubでログイン
- Step 2｜日本語でプロンプトを入力
- Step 3｜生成されたコードを確認
- Step 4｜Vercelにデプロイ
👉 ここまで完全無料・迷うポイントなし
最適解②｜Google AI Studio（HTML派）
Reactを使わず、
HTML / CSS を直接扱いたい場合 の現実解が Google AI Studio です。
🔹 特徴
- Geminiで純HTML / CSS / JSを生成
- 日本語プロンプトがそのまま通る
- HTML構造を崩さずに出力しやすい
- コードを丸ごとコピー可能
Google製で、日本語対応が安定している点も安心材料です。
🔹 公開先の例
- Netlify
- GitHub Pages
👉 HTML派・学習用途・軽量LP にはこちらが最短ルートです。
目的別おすすめ整理
| 目的 | 最適な選択 |
|---|---|
| 最速でそれっぽいLP | Durable |
| 完全日本語UIで安心 | Jimdo / STUDIO |
| 日本語LP＋AI補助 | Wix |
| コードを資産にしたい | v0.dev + Vercel |
| HTMLを直接扱いたい | Google AI Studio |
迷った場合は、
「あとでコードを触りたいか？」
で選ぶと失敗しません。
結論｜AIでLPを作るなら「コードを残せる構成」を選ぶ
AIでランディングページを作る場合、
最初から 「あとで自分が修正する前提」 で構成を選ぶことが重要です。
AIは完成品を作る魔法のツールではなく、
実装のたたき台を高速に用意するツール です。
👉 判断軸のまとめ
- Reactベースなら v0.dev + Vercel
- HTMLベースなら Google AI Studio + 静的ホスティング
「コードを残せる構成を選ぶ」
この判断軸は、今後ツールが変わっても変わりません。
AI×LP制作を
「一発ネタ」で終わらせず、
再利用できる資産として残したい 場合は、
ぜひこの構成から始めてみてください。
コメント