AIでコーポレートサイトを自作して分かったこととは？実践記のまとめ

前回は、AIで作った画像や素材の商用利用について、お話ししました。

前回の記事はこちらです。

AIで作った画像や素材は商用利用できる？サイト制作で確認した著作権の注意点

AIでコーポレートサイトを自作して分かったこととは？

今回、AIと一緒にコーポレートサイトを作ってみて、はっきり分かったことがあります。

AIを使えば、スモールビジネスでも、かなり本格的なサイトを自作できます。
ただし、AIに丸投げすれば良い、という話ではありません。
大切なのは、AIと対話しながら、自分で判断することです。

今回の制作で行ったこと

既存サイトのページ構成を、整理する
新しいコーポレートサイトの方向性を、決める
WordPressではなく、静的HTMLサイトとして制作する
モダンで美しいデザインを、AIと一緒に作る
スマホ表示や日本語改行を、細かく調整する
Webフォントを、自社配信する
OGP画像やfaviconを、整える
お問い合わせフォームや申込フォームを、調整する
SEO設定やサイトマップを、確認する
商用利用や著作権まわりを、確認する

こうして見ると、やったことは、かなり多いです。

ただ、ひとつずつAIに相談しながら進めることで、形にできました。

AIは、外注業者ではなく共同制作者だった

今回の制作で、いちばん大きく感じたのは、AIは共同制作者だということです。

AIに全部を任せる、という感覚ではありません。

こちらが考え、AIに相談し、出てきた案を確認し、また直す。

この、くり返しでした。

AIに任せたこと

ページ構成の整理
文章のたたき台作成
デザイン方向性の提案
HTMLやCSSの実装
不具合原因の整理
修正案の提案
確認項目の洗い出し

人間が判断したこと

このは屋らしい表現か？
読者に、伝わりやすいか？
スマホで、自然に読めるか？
デザインに、違和感がないか？
安心して、公開できるか？
商売の考え方に、合っているか？

この役割分担が、かなり大切でした。

AIは、作業を助けてくれます。

でも、最終的に何を選ぶかは、自分で決める必要があります。

WordPressからHTMLサイトへ移行して良かったこと

今回のコーポレートサイトは、WordPressではなく、静的HTMLサイトとして作りました。

ただし、WordPressを否定しているわけではありません。

このは屋の、このブログは、今もWordPressで運営しています。

今回は、コーポレートサイトの目的に合わせて、HTMLサイトを選びました。

HTMLサイトにして良かったこと

デザインを、細かく作り込みやすかった
余白や文字サイズを、直接調整しやすかった
表示を、軽くしやすかった
ページごとの見せ方を、自由に設計できた
AIと一緒に、ファイル単位で修正しやすかった
コーポレートサイトとして、役割を明確にできた

ブログや記事更新には、WordPressが向いています。

一方で、会社の考え方や世界観を見せる固定サイトには、HTMLサイトも向いていると感じました。

デザインは、AIだけでは完成しない

AIを使えば、デザイン案は出せます。
HTMLやCSSも、かなり作れます。

でも、デザインの完成度を上げるには、人間の違和感が必要です。

今回、デザインで調整したこと

余白の広さ
文字サイズ
見出しの印象
深い緑と朱色のバランス
スマホでの読みやすさ
フッターの見え方
フォームの統一感
スクロール時のなめらかさ

AIが出したものを、そのまま使うだけでは、少し物足りないことがあります。

良くするには、何度も見て、違和感を伝えて、修正する必要があります。

今回のサイトも、一度で完成したわけではありません。

細かい調整を重ねて、少しずつ整えていきました。

スマホ表示は、最後まで確認した方が良い

今回の制作では、スマホ表示に、かなり時間を使いました。

PCでは良く見えても、スマホでは違和感が出ることがあります。

特に、日本語の改行は、かなり気になりました。

スマホで確認したこと

見出しが、自然に改行されているか？
言葉の途中で、切れていないか？
メニューが、開きやすいか？
スクロール時に、カクつかないか？
フォームが、入力しやすいか？
フッターが、読みやすいか？
余白が、詰まりすぎていないか？

スマホ表示は、PC表示の縮小版ではありません。

スマホには、スマホの読みやすさがあります。

特に、スモールビジネスのサイトでは、スマホで自然に読めることが大切です。

SEO設定は、静的HTMLサイトでもできる

静的HTMLサイトでも、基本的なSEO設定はできます。

WordPressプラグインがなくても、必要な設定をHTMLに入れれば対応できます。

今回、設定したこと

titleタグ
meta description
canonicalタグ
OGPタグ
Twitterカード
構造化データ
robots.txt
sitemap.xml
内部リンク
拡張子なしURL

SEOは、裏技みたいなものではありません。

読者と検索エンジンに、ページの内容を分かりやすく伝えるための整理です。

今回も、派手なことより、基本を整えることを重視しました。

素材や画像は、安心して使えるか確認する

AIでサイトを作ると、画像や素材の選択肢が広がります。

ただし、使える素材が増えるほど、確認も大切になります。

特に会社サイトでは、安心して使えることが重要です。

確認したこと

AI生成画像は、商用利用できるか？
特定の作品や人物に、似すぎていないか？
フォントのライセンスは、問題ないか？
自社サーバーから、配信して良いか？
OGP画像やアイコンに、問題はないか？
不安な素材を、無理に使っていないか？

不安な素材は、無理に使わなくて大丈夫です。

安心して使えるものを選ぶことも、サイト制作の大切な一部です。

AIで作るほど、人間の判断が大切になる

今回の制作で、強く感じたことがあります。

AIを使うほど、人間の判断が大切になります。

AIは、たくさんの案を出してくれます。

でも、どれを選ぶかは、自分で決める必要があります。

判断が必要だったこと

どんなサイトにしたいか？
どのページを作るか？
どの表現が、自然か？
どのデザインが、このは屋らしいか？
どこまで細かく調整するか？
何を公開し、何を保留するか？

AIは、便利です。

でも、判断を完全に代わってくれるわけではありません。

自分の商売をどう見せたいのか？
誰に、何を伝えたいのか？

ここは、人間が考える必要があります。

AI時代のDIYは、自分で全部やることではない

このシリーズで、何度も出てきた考え方があります。

AI時代のDIYは、自分で全部を抱え込むことではありません。

AIと対話しながら、自分の商売を、自分で育てることです。

AI時代のDIYで大切なこと

分からないことを、AIに相談する
たたき台を、作ってもらう
違和感を、自分で見つける
修正案を、比較する
実物で、確認する
最終的に、自分で判断する

これは、外注に依存しないための新しい形だと感じています。

ひとりで頑張りすぎる必要はありません。

でも、自分で判断することは手放さない。

そのバランスが、AI時代のDIYでは大切です。

このシリーズで書いてきたこと

今回のシリーズでは、本編と番外編に分けて、制作過程をまとめました。

本編

番外編

こうして並べると、かなり長い実践記になりました。

でも、それだけ、AIでサイト制作をする中には、たくさんの学びがありました。

スモールビジネスにとって、AIサイト制作は現実的な選択肢になる

今回の制作を通じて、AIサイト制作は、スモールビジネスにとって現実的な選択肢になると感じました。

もちろん、すべての人に、同じ方法が合うわけではありません。

外注した方が良い場面もあります。
WordPressの方が良い場面もあります。
シンプルなテンプレートで十分な場面もあります。

ただ、AIと一緒に作ることで、選択肢は確実に広がりました。

AIサイト制作が向いている人

自分の商売を、自分で育てたい人
外注に、丸投げしたくない人
サイトの考え方を、自分で理解したい人
細かく改善しながら、育てたい人
AIと対話しながら、作ってみたい人

反対に、すべてを完全に任せたい場合は、制作会社に依頼する方が合っているかもしれません。

大切なのは、自分に合った方法を選ぶことです。

まずは、小さく試してみる

いきなり、コーポレートサイト全体を作り直す必要はありません。

まずは、小さく試すだけでも十分です。

最初に試しやすいこと

トップページの見出しを、AIと一緒に考える
会社概要の文章を、整える
FAQを、整理する
スマホ表示の違和感を、洗い出す
OGP画像の案を、作る
既存サイトの改善点を、AIに相談する

小さく試すと、AIとの付き合い方が分かってきます。

一度で完璧にしようとしなくて大丈夫です。

サイトは、育てるものだからです。

まとめ

今回は、AIでコーポレートサイトを自作して分かったことを、シリーズ全体のまとめとして整理しました。

要点をまとめます。

AIを使えば、スモールビジネスでも本格的なサイト自作を目指せる
ただし、AIに丸投げするだけでは、良いサイトにはならない
AIは、外注業者ではなく共同制作者として使う
WordPressとHTMLサイトは、目的に合わせて使い分ける
デザインは、細部の違和感を直すことで良くなる
スマホ表示や日本語改行は、実機で確認することが大切
SEO設定や商用利用の確認も、公開サイトでは欠かせない
AI時代のDIYは、自分の商売を自分で育てるための新しい方法

このシリーズでお伝えしたかったことは、ひとつです。

AI時代の自作は、ひとりで全部を抱え込むことではありません。
AIと対話しながら、自分の商売を、自分で育てていくことです。

今回のコーポレートサイトは、その実践として作りました。

実際のサイトはこちらです。

このは屋のコーポレートサイトを見る

このは屋

このは屋｜自分の商売を、自分で育てる。 AIとテンプレートを味方に、外注業者へ依存せず、商売の仕組みを自分の手でつくるための学び舎。

あなたが、これからサイトを作る場合も、まずは小さく試してみてください。

今のサイトの見出しを、見直す。
スマホ表示を、確認する。
AIに、改善案を聞いてみる。

その小さな一歩からで、大丈夫です。

大切なのは、完璧なサイトを一度で作ることではありません。

自分の商売を、自分で育てられる状態にすることです。

少しでも、今回の実践記が参考になれば、うれしいです。