AIを使ってどこまでできる？自分でサイトを作る方法
２０２６年も終わりに近づいてきましたが、今年１年間でAIの能力はものすごく向上しましたよね。
ウェブサイトの制作においてももはやコーディングソフトは必要なくなって、制作現場の環境もずいぶん変わりました。
さらに、ウェブサイトに限らずバナー広告、チラシ、ポスターなど、自由にイメージを形にできるようにもなりました。
本当にすごいことですよね。
しかし画像を作ることは簡単にできるけれど、ウェブサイトってどうやって作ればいいんだろうと、いまいちピンとこない方も多いのではないでしょうか。
今回は、AIを使って実際にウェブサイトを作る方法の一例を紹介します！
STEP1｜まずはAIに「何を作ればいいか」考えてもらう
いろんな作り方がありますが、今回はなるべくAIに全てを丸投げする方向で、サクサクと進めてみたいと思います。
まず、どんなページを作るかを決めないといけないですが、それすらAIに丸投げしてみましょう！
まず最初にAIに、自分の会社について説明します。
たとえば、
「福岡市で小さなリフォーム会社を経営しています。従業員は5名です。一般家庭からの問い合わせを増やすために会社のホームページを作りたいです」
さらに、
- どんな仕事をしているのか
- どんなお客様に来てほしいのか
- 会社の強み
- 対応エリア
- 問い合わせ方法
- 掲載したいサービス
などを伝えていきます。
思いつくことを全部伝えてください。
情報が整理できていなくても、きちんとした文章になっていなくても大丈夫です。
なんなら、「ホームページを作るために必要なことを、私に質問してください」とAIに頼んでもOK。
その後AIからの質問にひとつずつ答えていけば、必要な情報を自然に整理してもらえます。
個人的に、時間をかけるとしたらこの作業だと思います。
できるだけ詳しく会社のこと、どういう人に見て欲しいか、何を売りたいかなど、AIに伝えてください。
STEP2｜必要なページをAIに決めてもらう
会社について説明できたら、次はサイト全体の構成をAIに考えてもらいます。
たとえば、
「この会社のホームページに必要なページを考えて」
と頼みます。
すると、
- トップページ
- サービス紹介
- 私たちについて
- 施工事例・実績
- よくある質問
- 会社概要
- お問い合わせ
など、業種や目的に合わせた構成を提案してくれます。
さらに、
「もっとページ数を少なくしたい」
「採用ページも欲しいな」
「SEOで地域のお客様にも見つけてもらいたい」
などの条件を追加すれば、最適な構成に変更してもらうこともできます。
AIが出した案をそのまま採用しなくてもいいので、希望はなんでも、どんどん伝えてください。
「このページはいらない」
「これはトップページにまとめたい」
「料金ページもいるんじゃない？」
など、会話しながら調整していきましょう。
STEP3｜ページの中身と文章も全部AIに作ってもらう
サイト構成が決まったら、次は各ページの内容もAIに考えてもらいます。
たとえばトップページなら、
「このサイトのトップページに必要な内容を、上から順番に考えてください」
と頼めば、
メインビジュアル
↓
会社の特徴
↓
サービス紹介
↓
選ばれる理由
↓
施工事例
↓
お客様の声
↓
お問い合わせ
といったページ構成まで考えてくれます。
そのまま続けて、
「では、それぞれに掲載する文章も作ってください」
と頼めば、文章まで提案してくれます。
もし文章が硬すぎれば、「もう少し親しみやすく」、
長すぎれば、「半分くらいに短く」と伝えるだけ。
文章を書くのが苦手な人ほど、AIはかなり頼れる相棒になります。
STEP4｜デザインもAIに丸投げしてみる
掲載する内容が決まったら、いよいよデザインをAIに作ってもらいます。
まずAIに、
「この会社に合うホームページのデザインを画像で見せてください」
と頼んでみます。すると画像でサイトのデザインを生成して見せてくれます。
さらに、
「信頼感を重視したい」「30〜50代の女性に好まれる雰囲気」「高級感より親しみやすさ」「白をベースに、落ち着いたグリーンを使いたい」
など、希望を伝えていきます。
好きなホームページがあれば、スクリーンショットをアップして、
「こういう雰囲気にしたい」
と伝えればOKです。
あなたの希望を反映しながら、配色、文字の大きさ、写真の使い方、ボタンの形、余白なども含めて、AIにデザインの方向性を考えてもらえます。
STEP6｜HTML・CSS・画像データをAIに作ってもらう
デザインができたら、いよいよ実際にホームページを作ります。
ここでもAIを使います。
今までの話を元に作りたいページの内容とデザインを伝えて、
「このデザインでHTMLとCSSと必要な画像データを作って」
と頼めば、実際にブラウザで表示できるコード一式を作ってもらえます。
HTMLが分からなくても、
「この部分の文字をもう少し大きくしたい」
「写真を3枚横に並べたい」
「スマートフォンでは縦並びにしたい」
「ボタンを丸くしたい」
など、普通の言葉で修正をお願いできます。
エラーが出た場合も、
「こんな表示になりました」
とスクリーンショットを見せたり、そのページのコードやファイルをAIに渡したりすれば原因を調べてもらえます。
やりたいことをAIに伝えれば、AIの方から「〇〇のデータをアップしてください」と言ってくるので、その指示に従えばOKです。
STEP7｜サーバーとドメインを用意して公開する
ここまではAIがかなり手伝ってくれますが、最後に必要になるのがホームページをインターネット上に公開する作業です。
一般的なホームページでは、
- ドメイン
- サーバー
を用意します。
ドメインは、
「example.com」
のようなホームページの住所。
サーバーは、ホームページのデータを置いておく場所です。
レンタルサーバーを契約し、作ったHTMLや画像などのデータをアップロードすれば、ホームページを公開できます。
この設定についてもAIに、
「このサーバーを契約しました。HTMLで作ったサイトを公開する方法を初心者向けに教えてください」
と聞けば、かなり詳しく手順を教えてもらえます。
本当に初心者でも全部できる？
ここまでくると、「これから先は、制作会社はいらない！」と言われるのも頷けますね。
実際、シンプルなサイトなら、自分で作れる人はかなり増えると思います。
ですが、ウェブサイトを作って、安全にインターネット上に公開して運用するためには、データ制作以外の作業も発生します。
たとえば、
- サーバーやドメインの設定
- SSLの設定
- WordPressなどCMSの構築
- セキュリティ対策
- お問い合わせフォーム
- SEO
- アクセス解析
- 表示速度
- バックアップ
- 更新・保守
- エラー発生時の対応
など、など・・・
これを一つ一つAIに聞きながら作業するということもできるのですが、専門用語やインターネットのバックヤードの知識が必要になり、少しハードルが高いと感じるかもしれません。
それでも「まず自分で作ってみる」はアリ
個人的には、AIを使って一度自分でホームページを作ってみるのは、今後自社でサイトを運営していくことを考える上でとても有意義な一歩だと思います。
これまでなら専門知識がないと難しかったことを、AIに質問しながら実際に形にできる時代になりました。
最初から100点のホームページを目指す必要はなく、自分で構築しているからこそ、そのデータを元にAIにブラッシュアップを頼むこともできます。
まず、
「自分の会社のHPは、どんなのがいいと思う？」
とAIに相談するところから始めてみてください。
そうやってAIと対話を重ねていくことで、最適なサイトのプランをAIが作りやすくなります。
気づけば、思っていた以上のところまで自分で作れるかもしれません。
もちろん、今までと同じように制作会社への丸投げもアリなのですが、まず自分でできるところまでやって、「できないところだけを依頼する」というのも、これからのホームページ制作のひとつの形になっていくのかもしれません！
