「AIってすごいけど…どう使うの？」と思っていませんか？
「AIってすごいって聞くけど、実際どう使えばいいの？」
そんなふうに感じていませんか？
今回、思い切ってChatGPTで「ペットアイコン紹介ページ」を作ってみたんです。
私が やったことは、文章を入力しただけですが、 たった数分でWebページが完成しました。
正直、「え？これだけでいいの？」とびっくり。
昔ホームページを作っていた私からすると、コードなしでここまでできるのは感動レベルでした。
正直「え、これだけ？」と拍子抜けするくらい簡単にHP作ってくれちゃいました（笑）
この記事では、
- 実際にやった手順
- 初心者でもできる作り方
- 売れるページにするコツ
を、やさしく解説していきます。
実はこの記事、ChatGPTに「Codexを試して」とお願いしたら勝手にホームページを作ってくれた話がきっかけなんですが・・（笑）
※きっかけになったCodex体験記事はこちら👇
ChatGPTでWebページが作れるって本当？
結論：簡単に作れます。
結論から言うと、ChatGPTを使えば誰でもWebページを作れます。
しかも…
- コード知識なしでOK
- 専門用語なしでもOK
- コピペだけで完成
というシンプルさです。
💡 ポイント
AI初心者でも5分でできました！
なぜ初心者でもできるのか？
理由はとてもシンプルです。
👉 ChatGPTがHTMLコードを自動で作ってくれるから
自分でやることは、
- 作りたい内容を伝える
- 出てきたコードを使う
これだけです。
実際のイメージ
たとえば、
「ペットアイコン紹介ページを作って」
とお願いすると、
👉 それっぽいWebページの設計を丸ごと作ってくれます。
これ、かなり便利ですよね。
さすがに、このお願い（プロンプト）だけでは大雑把すぎるから、AIのほうから具体的なイメージを聞き返されると思います。
なので、次はどんなことを事前にイメージすればよいかの説明です。
今回作るもの：ペットアイコン紹介ページ
ゴールをイメージしておきましょう！
今回作るのは、こんなページです👇
- ペットアイコンの魅力を紹介
- サンプル画像を掲載
- 料金や流れを説明
- 依頼につなげる
いわゆる「簡単なLP（ランディングページ）」です。
参考にしたい具体的なLPやWebサイトがあれば、それを伝えるのも良いと思います。
なぜこれを作るのか？
理由はシンプルです。
👉 そのまま副業に使えるから
- ココナラ誘導
- ブログからの導線
- SNSプロフィールリンク
いろんな場面で使えます。
ChatGPTでペットアイコンページ（Webサイト）を作る手順
結論：3ステップで完成します
- プロンプトを入力
- HTMLコードを生成
- ブラウザで表示
順番に見ていきましょう。
① プロンプトを入力する
まずはChatGPTにお願いをします。
例はこちら👇
ペットアイコン紹介ページを作ってください。
やさしい雰囲気で、女性向けデザインにしてください。
以下の内容を入れてください：
・サービス紹介
・サンプル画像
・料金
・申し込み方法ポイントは、
👉 ふんわりでOK
細かく書かなくても、いい感じに作ってくれます。
② HTMLコードを生成する
プロンプトを入力すると、
👉 HTMLコードが表示されます
最初は「なにこれ？」と思うかもしれませんが大丈夫です。
👉 読む必要はありません
使うだけでOKです。
③ ブラウザで表示する方法
表示方法もかんたんです。
方法①（おすすめ）
- メモ帳を開く
- コードを貼り付け
- 「.html」で保存
- ダブルクリック
👉 これでページが開きます
方法②
- ChromeなどにドラッグでもOK
とてもシンプルですよね。
実際に作ってみた結果（スクショあり）
結論：ちゃんとしたページが完成しました
実際にやってみた結果、普通に使えるページができました
- デザインもそれっぽい
- 文章も自然
- すぐ使えるレベル
でした。
💡 作ったページを公開したいならサーバーが必要です。
初心者でも使いやすくて私も使っているConoHa WINGがおすすめ✨
やってみた感想
50代の私が実際にやってみて「これは使える！」と感じました。
昔は、
- HTMLを書く
- レイアウトを調整する
- デザインを整える
と大変でしたが、
今は全部AIがやってくれます。
昔、Webデザインスクールに通った経験がある私からすると、今までなんだったの！？という感じです😅
さらに売れるLPに改善してみた
結論：少し手を加えるだけでグッと良くなる
ChatGPTのままでも使えますが、少し整えるだけで「売れるページ」に変わります。
改善ポイント
- キャッチコピーを追加
- 「こんな方におすすめ」を入れる
- 実績や例を追加
- CTA（申し込みボタン）を強化
たとえば👇
- 「あなたの大切なペットを、ふんわり優しいアイコンに」
- 「こんな方におすすめ」
- 「ビフォアアフター」
- 「ご依頼はこちら」
などを入れるだけでも違いますよね。
なので、実際にChatGPTに「この改善を全部反映した完成版HTMLを作って」とお願い（プロンプト）したら、新たなHTMLを出力してくれました。
画像を自分の作品に差し替えて、ボタンにリンクを入れる作業は私の手で行います。
ChatGPTで作ったページは副業になる？
結論：十分、副業になります
この方法は、そのまま副業に活かせます。
理由
- 制作コストがほぼゼロ
- 作るスピードが速い
- 誰でもできる
活用例
- ココナラの販売ページ
- ブログのサービス紹介
- SNSのリンク先
👉 「持っているだけで強いページ」になります
ここまで読んでくれたあなた！もっとしっかりしたプロンプトを学びたい！知りたい！と思いませんか？
本格的にWebデザインを学びたい方にはぴったりかもしれません！
（私も一瞬チャレンジしようか悩んだくらいです！笑）
AIを使ったWebデザインを本格的に学びたい方はこちらもチェック👇️
私もちょっと迷ったくらいの月額料金で学びたい放題というのが魅力ですよ！
ペットアイコンを依頼したい方へ
ここまで読んで、
「ペットアイコン作ってほしいかも」
と思った方へ😊
現在、ふんわり優しい雰囲気の
パステル風ペットアイコンを作成しています。
- SNSアイコンにぴったり
- やさしい雰囲気
- 女性向けデザイン
などを大切にしています。
👉 気になる方はぜひチェックしてみてくださいね
ChatGPTは初心者でも使える？メリットまとめ
結論：初心者こそ使うべきです
最後にメリットをまとめます。
メリット
- コード不要
- 時間短縮
- 誰でも使える
- 副業に直結する
デメリット
- 最初は少し戸惑う
- 微調整は必要
とはいえ、
👉 メリットの方が圧倒的に大きいです
💡 作ったページを公開したいなら👇️
📚 AIデザインをもっと本格的に学びたいなら
まとめ｜まずは試してみるのが一番
ここまで読んでいただきありがとうございます😊
まずはやってみて下さい。
- 難しく考えなくてOK
- 失敗してもOK
- とりあえず触ってみる
これだけで、世界が変わります。
ぜひあなたも、
ChatGPTでページ作成、試してみてくださいね✨
コメント