会社ホームページは静的サイトで足りる？判断から公開までの手順

会社概要、事業内容、所在地、問い合わせ先を載せるホームページなら、最初からデータベースや管理画面を持たせる必要はありません。更新頻度が低く、申込や決済を外部サービスへ任せられる会社では、静的サイトが現実的な選択肢になります。

この記事は、Next.js の静的書き出しを使う資料型ガイドです。筆者による同一条件での性能比較ではありません。判断条件、AIへ渡す指示、静的出力の確認、公開前の停止点までを再現できる形にします。

静的サイトで足りる条件

次の情報が中心なら静的構成に収まりやすいです。

• 会社概要、サービス、実績、アクセス、よくある質問
• 外部の予約・問い合わせ・採用ページへのリンク
• 担当者が内容変更時に再生成して公開できるページ

一方、会員ログイン、在庫、社内だけの情報、リアルタイム料金、顧客ごとの表示にはサーバー側の処理が必要です。会社案内と業務システムを同じサイトに入れないことが、今回の設計判断です。

先に会社情報を確定する

AIへいきなり「ホームページを作って」と頼むと、足りない箇所を自然な文章で補われることがあります。角括弧を実際の情報へ置き換えてから、次を送ります。

I lead a company in the [industry] industry. The company is called [company name] and provides [product or service] to [target customer]. A common customer problem is [problem], and our difference from similar companies is [difference]. I want visitors to [book / request a quote / call / buy]. Do not write code yet. First create a one-page list covering the website goal, target customer, core value, information I must supply, and recommended pages. Do not invent case studies, prices, reviews, or credentials.

返答のうち、社名、住所、電話番号、価格、資格、実績は人が原本と照合します。不明な項目は空欄のままです。

参考図からデザイン規則だけを作る

花屋サイトの参考図を、文章や数値の出典ではなく、余白と情報階層の参考に使います。

Use the attached reference image only for visual direction. Do not copy company names, text, numbers, testimonials, or claims from it.

Design a minimal direct landing page. Use: single column layout, maximum white space, essential content only, one CTA, clean typography, no decorative elements, fast loading, direct messaging.

Make the layout readable on mobile and desktop. First turn this direction into a design rule sheet covering color, typography, spacing, buttons, images, and dividers. Wait for my approval before implementation.

実装前に規則表を確認し、電話と問い合わせへの導線が装飾に隠れていないかを見ます。

Next.jsを静的出力に限定する

Build this business website with the Next.js App Router and ensure output: 'export' produces static files. Pages, images, navigation, and small browser-side interactions are allowed. Do not use a database, login, Next.js API Routes, Server Actions, request-time rendering, private environment variables, or features that require server processing. Before implementation, list any requirement that cannot fit a static website and propose an alternative that needs no backend.

next.config では output: 'export' を設定します。生成後はビルドを実行し、通常は out に index.html と画像などの公開ファイルがあることを確認します。ビルドが失敗した場合は、サーバー専用機能を削るか外部サービスへ分離し、警告を無視して公開しません。

MCPを導入したらAIツールを完全に再起動する

公開例には、筆者側で開発している Sakupa MCP を使います。これは静的サイトを公開する一つの実装例です。

{
  "mcpServers": {
    "sakupa": {
      "command": "npx",
      "args": ["-y", "@sakupa/mcp@latest"]
    }
  }
}

設定保存後、AIツールを完全に終了して再起動します。同じチャットを続けるだけではMCPが読み込まれないことがあります。プロジェクトを開き直し、次を送ります。

Confirm that Sakupa MCP is connected and that the init, analyze, and deploy tools are available. Do not initialize, analyze, upload, or publish anything yet. If the tools are unavailable, check whether the Sakupa MCP configuration was loaded after the AI tool restarted.

3つのツールを確認できなければ、ここで止めます。

初期化、検査、公開を分ける

初期化は公開操作ではありません。

Use Sakupa to prepare the project I currently have open for first use. Do not ask me to choose a folder, and do not publish the website. Tell me whether preparation succeeded.

次に、実際の出力だけを検査します。

Use Sakupa to inspect the current project and identify the actual publishable website output. Inspect only; do not upload or make anything public. Tell me which directory would be published, whether it contains files that must stay private, and what still needs my confirmation.

公開対象に .env、秘密鍵、顧客情報、ソース一式が混ざっていないことを確認します。公開は別の指示に分けます。

Use Sakupa to publish the website that passed the inspection. Before the first public action, explain who can access it, how long the free website remains available, and which management credential must stay private. Wait for my explicit confirmation before publishing. After publication, return the public URL and the expiration time with its timezone.

無料公開リンクはURLを知る人が閲覧でき、現行手冊では有効期間は24時間です。.sakupa/site.json は管理情報なので公開リポジトリへ入れません。

公開前に人が確認する項目

• 全ページがビルド後の出力に含まれる
• スマートフォンで文字とボタンが読める
• 社名、住所、電話、価格、資格が原本と一致する
• 外部フォームの送信先とプライバシー表示が正しい
• 404、空リンク、ローカル画像パスがない
• 公開対象に秘密情報がない

静的サイトで足りるか迷ったら、必要なページ数ではなく、閲覧者ごとに内容を変える必要があるか、サイト内で個人情報を保存するかで判断します。どちらも不要なら、まず静的構成で公開範囲を小さく保つ方が運用しやすいです。

参考資料

• Next.js Static Exports（2026-08-03確認）
• Sakupa Website-building Guide（2026-08-03確認）
• Sakupa MCP deployment manual（2026-08-03確認）

本文の構成と推敲には生成AIを使用し、設定、公開順序、制約を人が確認しました。