MEDIUM定例会議 2025年7月2日

AIが進化し続ける現代、Webサイト制作の現場ではどのような変化が起きているのでしょうか。今回は「新技術の可能性」と「AI時代のサイト最適化（AIO）」をテーマに、制作者たちが本音で語り合います。
このブログ記事は私達MEDIUMが週一回開催する定例会議の内容を再構成して掲載するものです。最新のAIニュースやWeb制作、デザインに関する情報をお届けします。

※各AIサービスの性能比較や優劣に関する評価は発言者の主観が含まれます。また、サービス価格や機能については変動する可能性があるため、最新の正確な情報についてはベンダーの公式ホームページをご確認ください。

参加者紹介

吉田：Webディレクター、デザイナー
川村：Webデザイナー
西川：Webデザイナー
戸髙：Webデザイナー
本田：進行役

●Web制作における新技術の可能性と課題
　◯リアルな表現は可能か？3Dサイトの事例研究
　◯制作コストと技術的ハードルをどう乗り越えるか
　◯制作現場で活用できるAIツールの比較検討
●AI時代のWebサイト最適化（AIO）とは
　◯検索エンジンとAIに評価される構造化データの重要性
　◯AIが理解しやすいコンテンツ作成のポイント
　◯今後のWebサイト制作に求められる新しい視点
●座談会を終えて

Web制作における新技術の可能性と課題

<本田>
では最初のテーマ、「Web制作における新技術の可能性と課題」について議論を始めましょう。最近、Webサイトで3D表現を見かける機会が増えましたが、皆さんが注目している事例はありますか？

－リアルな表現は可能か？3Dサイトの事例研究－

<戸髙>
はい、先日見たサイトが衝撃的でした。スクロールすると地面が砕け散るエフェクトがすごくリアルで。あれはどういう技術でできているんでしょうか？
<西川>
あれはWebGLを使った3D表現ですね。地面の破片には物理演算が使われていて、非常に高度な技術です。バーチャル美術館も、館内を自由に歩き回れるリアルな体験が話題になりましたが、あれも同じくWebGLベースのフレームワーク、Babylon.jsが使われているようです。
<川村>
ユーザーがサイト内を「体験」できるのは魅力的ですよね。ただ情報を見るだけでなく、記憶に強く残る。でも、これだけのクオリティを追求すると、専門的なスキルや知識がかなり必要になりそうですね。
<吉田>
その通りだね。あのサイトのようなインタラクティブな表現は、単に3Dモデルを配置するだけでなく、ユーザーのアクションにどう反応させるかというインタラクションデザインが鍵になる。ブランディングサイトやキャンペーンサイトなど、強いインパクトを与えたい場合には非常に有効な手段だと思います。

－制作コストと技術的ハードルをどう乗り越えるか－

<本田>
なるほど。高い表現力を持つ一方で、技術的なハードルも高そうですね。制作コストや期間についてはどう考えますか？
<吉田>
Webサイトなどで本格的な3Dを導入するのは、現状ではかなり厳しいと言わざるを得ないですね。特に建物の精密なモデリングは、ポリゴン数が膨大になり、サイトの表示速度に致命的な影響を与えかねません。テクスチャの質もリアリティを左右する重要な要素ですが、これもデータ量を増やす原因になります。
<西川>
3D制作にはMayaやBlenderといった専門的なソフトウェアが必要で、それらを扱えるスキルを持つ人材も限られています。技術的なハードルは高いですね。ただ、Babylon.jsのように、比較的軽量でWebに特化したフレームワークも出てきているので、表現を絞れば現実的な選択肢にはなり得ます。
<戸髙>
すべてをリアルに再現するのではなく、例えばロゴや特定のオブジェクトだけを3Dにするといった、部分的な導入なら可能性はありそうですね。
<川村>
そうですね。ユーザー体験を損なわない範囲で、どこにコストをかけてリッチな表現を取り入れるか、その見極めが重要になってきそうです。

－制作現場で活用できるAIツールの比較検討－

<本田>
では、クライアントから3D表現の相談があった場合、私たちはどう対応できるでしょうか？また、制作現場で活用できるツールについても教えてください。
<吉田>
先日、クライアントから3Dに関する問い合わせがありましたが、その際は「簡単なモデルを動かす程度なら対応可能です」と回答しました。具体的には、スクロールに連動してロゴが回転したり、オブジェクトが移動したりといった演出ですね。設計図面から忠実に再現するような複雑なものでなければ、十分に実現可能です。
<西川>
最近はAIを活用したツールも増えています。例えば、Googleが発表した「Stitch」は、プロンプトからWebサイトのレイアウトを自動生成してくれます。これをFigmaにエクスポートしてデザインを調整し、さらにコーディングまで繋げられるようになれば、制作プロセスは大きく変わるでしょうね。
<戸髙>
コーディング支援ツールでいうと、「Claude Code for VS Code」も気になります。ただ、Windowsでは直接使えないという話でしたよね？
<吉田>
ええ、現状ではMacかLinux環境が必要になります。ただ、GitHub Copilotも進化を続けていますし、コーディング支援AIは今後ますます重要になるでしょう。どのツールが自社のワークフローに最適か、常に比較検討していく必要がありますね。

AI時代のWebサイト最適化（AIO）とは

<本田>
ありがとうございます。それでは次の大きなテーマ、「AI時代のWebサイト最適化」、通称「AIO」についてです。SEOの延長線上にある概念だと思いますが、具体的に何をすべきなのでしょうか？

－検索エンジンとAIに評価される構造化データの重要性－

<吉田>
AIOの根幹は、AIがWebサイトの情報を正確に理解できるようにすることです。そのために最も重要なのが「構造化データ」の実装ですね。これは、サイト内の情報が「何であるか」を、共通の語彙である「スキーマ・オルグ（schema.org）」を使って明示的に示すためのものです。
<西川>
実装方法としては、JSON-LDという形式で記述し、ページの``内に埋め込むのがGoogleの推奨するベストプラクティスです。例えば、これは企業名、これは住所、これは製品価格といった具合に、各情報に意味のラベルを付けてあげるイメージですね。
<川村>
なるほど。人間が見ればわかる情報も、AIにとってはただのテキストですものね。その意味を教えてあげることで、検索結果でのリッチな表示（リッチリザルト）に繋がったり、AIによる要約の精度が上がったりするわけですね。
<戸髙>
E-E-A-T（経験、専門性、権威性、信頼性）の観点からも重要そうですね。誰が書いた情報なのか、その組織はどういうものなのかを構造化データで示すことで、サイトの信頼性をAIに伝えられるということでしょうか。
<吉田>
その通りです。これまでのSEO以上に、コンテンツの「文脈」や「背景」をAIに理解させることが、これからのAIOでは不可欠になります。

－AIが理解しやすいコンテンツ作成のポイント－

<本田>
構造化データ以外に、コンテンツそのものでAIに分かりやすく伝えるためのポイントはありますか？
<川村>
「アンサーファースト」の考え方が挙げられますね。ユーザーが抱くであろう疑問に対して、まず結論や直接的な答えを提示する構成です。AIはユーザーの質問に対する最適な回答を探しているので、この形式は非常に評価されやすいです。
<戸髙>
Q&Aページを設けるのが一番分かりやすいですが、そうでなくても、例えばブログ記事の見出し（h2やh3タグ）を「〇〇とは？」のような疑問形にして、その直後の段落で答えを簡潔に記述するだけでも効果があると聞きます。
<吉田>
あと、`display: none;`でコンテンツを非表示にすることは注意が必要です。あれはユーザーに見えない情報を検索エンジンにだけ見せようとする行為と見なされ、ガイドライン違反になる可能性がある。アコーディオンUIのようにユーザーのアクションで表示されるものは問題ありませんが、SEO目的でキーワードを隠すような使い方は避けるべきです。

－今後のWebサイト制作に求められる新しい視点－

<本田>
ありがとうございます。では最後に、AIOの観点から、今後のWebサイト制作で求められる新しい視点について意見を聞かせてください。
<吉田>
サイトの種類ごとに、最適化すべきポイントが変わってくると思います。例えば、コーポレートサイトなら「Organization（組織）」や「Person（人物）」のスキーマ（構造の定義）を使って、企業の信頼性や専門性をしっかり伝えることが重要です。一方で、物件サイトなら「Product（製品）」や「Place（場所）」のスキーマを詳細に記述することが求められます。
<川村>
これまでは人間、つまりユーザーにとっての分かりやすさが第一でしたが、これからは「AIにとっての分かりやすさ」も同等に重要になるということですね。デザイン段階から、この情報はどのスキーマに該当するかを意識する必要がありそうです。
<西川>
そうですね。将来的には、Robots.txtのAI版のような「llms.txt」が標準になるかもしれません。これは、どのAIにどのデータを学習させて良いかをサイト側で制御する仕組みです。まだ策定段階ですが、こうした動きも注視していく必要があります。
<戸髙>
コンテンツを作る側も、ただ記事を書くだけでなく、その内容がAIによってどう解釈され、どういう形でユーザーに届けられるかをイメージしながら作っていく視点が大事になりそうですね。

座談会を終えて

<本田>
皆さん、ありがとうございました。3D表現からAIOまで、多岐にわたる議論ができましたね。Web制作の現場は常に新しい技術の波にさらされていますが、その本質を理解し、何がユーザーやクライアントにとって最適なのかを見極める視点が、私たち制作者には一層求められていると感じました。今後もこうした情報交換を続けて、日々の業務に活かしていきましょう。