AIでWebサイトを自作できるなら、制作会社に頼まなくてもいい? 手軽さに潜むリスクとは【新人Web担奮闘記】

これは、とある飲料会社に勤める新人Web担当者の成長物語です。Web制作の知識ゼロだった「小竹さん」が、ある日突然ブランドサイトのWeb担当者に就任。周りの先輩や制作会社の人に話を聞きながら、少しずつWeb制作やCMSを理解していきます。

前回は、突然新人Web担当者に就任した小竹が、同じ部署の部長からWebサイトの基礎を教えてもらいました。順調と思いきや、今回はどんなことが待ち受けているのでしょうか?

この連載記事の構成・取材を担当するWeb Designing編集部の新人編集者「大竹」もまた、Web制作を学び始めたばかり。小竹と同じ目線で、みなさんと一緒にWeb制作の知識を深めていきます。

登場人物

小竹
株式会社ダブデイ・ベバレッジの広報部所属。入社2年目。新製品ペットボトル紅茶「エム・ティー」のブランドサイトの立ち上げ担当に抜擢され、Webの知識の少なさに四苦八苦しながらも奮闘中。行動力はあるが、少し天然なところも。

部長
株式会社ダブデイ・ベバレッジの広報部長。長年企業のマーケティング・ブランディングに携わるベテランで、Web制作の現場にも詳しい。いつもにこやかだが、たまに意味不明なジョークを言い放つ。

鈴本
小規模からエンタープライズ案件まで手広く対応するWeb制作会社のディレクター。相手の行動力をまず認めてから穏やかに軌道修正する、肯定的なツッコミ役。

目次

AIに頼んだら、もうWebサイトができちゃった!?

小竹
部長、見てください! 先週、CMSについて聞いたとこですけど、「エム・ティー」のブランドサイト、もうできちゃいました!
部長
えっ? 先週お願いしたのは、サイトの目的や掲載する内容を考えることだったよね?
小竹
はい。でも、考えているうちに、試しに生成AIへ「高級感のあるペットボトル紅茶のブランドサイトをつくって」とお願いしてみたんです。そうしたら、あっという間にここまでできてしまって。私って、もしかしてWeb制作の才能があるのかも……!
小竹さんが持ってきたサイトのトップページ。実際に生成AIを用いて作成した
部長
うーん……。トップの画像、商品のイメージとかけ離れすぎていないかな? 金の装飾がついたティーカップ、積み重なった謎の洋書、謎の老紳士……執事?。
小竹
高級感の表現、こう来たかー!って感じですね。
部長
いや、「こう来たかー」とかじゃなくてね……。あと、「国産茶葉100%使用」と書いてあるけれど、実際には違うよね?
小竹
わ!見落としてました。見た目はそれっぽかったから、ちゃんとできていると思ったのに!
部長
一般公開する前に見せてもらえてよかったよ。AIでWebサイトの形をつくることはできても、企業のサイトとしてそのまま使えるかは、別の問題みたいだね。
小竹
でも、間違っているところを直せば使えるんじゃないでしょうか? せっかく執事さんもやる気ですし……。
部長
執事さんのやる気は画像からはわからないけれど、小竹さんの行動力はよくわかったよ。ちょうどいい。今回のブランドサイトを相談しようと思っていた制作会社に、鈴本さんというディレクターがいるんだ。プロに聞いてみよう。
小竹
制作会社の方ですか。ぜひお願いします!
鈴本
はじめまして、鈴本です。よろしくお願いします。先ほど、AIでつくった画面も拝見しました。短時間でここまで形になったのは、たしかにすごいですね。
小竹
ありがとうございます。でも、間違いだらけでした……。AIでWebサイトがつくれるという話は、ウソなんでしょうか?
鈴本
ウソではありません。今のAIなら、指示に合わせて文章や画像、プログラムをつくり、Webページの形にすることはできます。ただし、「Webページの形になったこと」と「企業が安心して運用できるWebサイトができたこと」は、分けて考えたほうがいいんです。

AIだけでつくった企業サイトに潜むリスク

小竹
今回みたいな間違い以外にも、AIでつくったサイトには問題が起こるんですか?
鈴本
注意したい点はいくつもあります。まず、AIが出した文章や画像が正しいとは限りません。誤った商品情報、権利関係を確認できない画像、ブランドの方針に合わない表現が混じる可能性があります。公開前に、人が責任を持って確認する体制が欠かせません。
小竹
もし「エム・ティー」に入っていない原料を、入っていると公開していたら……。ううーっ、考えるだけで怖いです。
鈴本
次に、画面ではきれいに見えても、Webサイトの内部に問題がある場合があります。検索サービスなどがページの内容を理解しやすい構造になっているか、さまざまな端末で正しく表示されるか、後から機能を追加しやすいか、といった点は、見た目だけでは判断できません。
小竹
表からは見えないところにも、確認すべきことがたくさんあるんですね。Webサイトにも裏の顔がある……。
鈴本
少し怪しく聞こえますが、考え方は合っています。画面に見える部分だけでなく、裏側の設計やプログラムも重要です。
小竹
見えないからといって、ないことにはできないんですね。
鈴本
そうなんです。お問い合わせフォームなどで個人情報を扱うなら、セキュリティも重要です。外部サービスとの連携や、社内のセキュリティ基準への対応が必要になることもあります。万が一問題が起きたとき、内容によっては会社の信用や事業そのものに影響しかねません。
小竹
AIに頼めば簡単、と思っていましたが、適切かどうかを判断する知識は必要なんですね。
鈴本
はい。AIへの指示の出し方だけでなく、出力されたものを評価し、修正する知識も必要になってきます。

AIでつくったページに潜むリスク

  • 「それっぽい」間違った情報が入り込んでいる
  • 画像の細部に不自然な部分があり、見た人の信頼性を損なう
  • 企業や商品のコンセプトとデザインのトーンが合っていない
  • 企業のセキュリティポリシーにあっていない
  • 検索サービスなどへの最適化が図られていない

AIによるコーディングの品質は飛躍的に伸びているので、こうした問題は時間と共に解決していくかもしれません。しかし、AIが生成した内容は、完成品ではなく確認が必要な案として扱うことが肝心です。

Webサイトは公開してからも続いていく

小竹
公開前にきちんとチェックできるなら、AIでも大丈夫ですか?
鈴本
公開前のチェックは大切ですが、さらに1つ考えたいのが、「つくったあと」のことです。商品のニュースを追加したり、キャンペーンを始めたり、情報が古くなったら直したり。ブランドサイトは、公開後も更新が続きますよね。
小竹
はい。継続的に情報を発信していこうと思っています。
鈴本
AIだけでその都度ページをつくり直す方法だと、影響しないと思っていた場所が変わってしまうことがあります。不具合が発生していても、気づかないまま放置してしまうかもしれません。それに、担当者しか更新方法がわからなければ、その人が異動や退職をしたときに更新が止まる可能性もあります。
小竹
たしかに。私がずっと担当するとも限りません……。
鈴本
複数の部署で更新するなら、誰がどのページを編集するのか、誰が確認し、公開するのかというルールも必要です。CMSの導入や運用方法を考えるときは、現在の担当者だけでなく、将来の体制まで見据えておくことが大切です。
小竹
公開はゴールではなく、運用のスタートなんですね。
鈴本
そのとおりです。きちんと更新を続けられる道を選べば、公開した日の勢いを将来にもつなげられます。

AIでつくったWebサイトとCMSは両立できる?

AIを使ってWebサイトの表示部分をつくり、既存のCMSと連携させることは、技術的に不可能ではありません。制作会社やエンジニアが使用するCMSのルールを踏まえてAIに指示を行い、生成されたものを修正しながら組み込む方法も考えられます。

ただし、AIが生成したWebサイトに、後から単純にCMSを付け足せるわけではありません。どの情報をCMSで管理するのか、どのような形式で受け渡すのかなどを設計する必要があります。また、生成されたプログラムを読み、問題が起きたときに原因を調べて直す知識も求められます。

そのため、Web制作の知識が少ない新人担当者が、AIだけを頼りに単独で構築・運用するのは、かなりハードルが高いといえます。AIとCMSを併用したい場合は、最初の設計段階から制作会社やエンジニアに相談し、担当範囲と責任の所在を明確にすることが大切です。

見た目ができても「成果の出るサイト」とは限らない

小竹
自分1人でAIを使ってつくるのは、いったん諦めます。でも、自社でWebサイトをつくる方法はほかにもありますよね。調べてみたら、ノーコードツールならWeb制作の知識が多くなくても使えるそうです。自分たちでやれば、その分、制作費を抑えられるはず……なんて、鈴本さんには直接言いにくいですけれど。
鈴本
心の声まで全部公開されていますよ? でもよくわかります。コストを抑えたいというのは、当然の希望です。
小竹
よかった。では、なるべくゼロ円で。
鈴本
うーん、ズバリ言ってしまうその勇気、プライスレスです。……ともかく、まずは何を実現したいかを確認しましょう。会社や商品の存在をWeb上に載せるだけなら、自社制作でも目的を果たせる場合があります。でも今回、ブランドサイトをつくるのは何のためでしょう?
小竹
「エム・ティー」のことを、たくさんの人に知ってもらうため……でしょうか。
鈴本
そうですね。ブランドの認知を広げたいのか、商品の魅力を伝えたいのか、取扱店や購入ページへ案内したいのか。目的によって、必要なコンテンツも、画面の構成も、成果を確かめる指標も変わります。
小竹
サイトを表示できたら完成、ではないんですね。
鈴本
ええ。Webサイトは、会社が抱える課題を解決するための手段です。見た目が整っていても、誰に何を伝え、次にどんな行動をしてほしいのかが曖昧だと、なかなか成果につながりません。
小竹
でも、私のような新人には、目的や指標を最初からかっちり決めるのは難しそうです。
鈴本
Webサイトの目的は、最初から固まっていなくても大丈夫ですよ。制作会社の仕事は、言われたとおりにページをつくることだけではありません。お客さまと話しながら目的や課題を整理して、「本当にその方法でいいのか」「ほかの方法はないか」と一緒に考えることも、大切な役割です。
小竹
相談する時点で、全部の答えを用意しておかなくてもいいんですね!
鈴本
そのとおりです。制作会社によって対応範囲は異なりますが、目的の整理から設計・制作、CMSの選定、公開後の分析や改善、保守まで支援する会社もあります。専門分野が異なる人たちと相談しながら、長く運用できる形をつくれるのが、制作会社に依頼する大きなメリットです。

自社制作と制作会社への依頼を比べるポイント

自社制作には、費用を抑えやすく、素早く試せるというメリットがあります。一方、企業サイトとして継続的に運用するには、次の点も含めて判断する必要があります。

  • Webサイトの目的や、成果を測る指標を設計できるか
  • 文章・画像・プログラムの品質を確認できる人がいるか
  • セキュリティや個人情報の扱いに対応できるか
  • 複数人で更新するときのルールや確認体制をつくれるか
  • 担当者が変わっても、更新や保守を続けられるか
  • 公開後の分析や改善に取り組めるか

大切なのは、「Webサイトをつくること自体を目的にしないこと」。Webサイトによって何を達成したいのかまで考えて、最適な方法を選びましょう。目先のコストだけでなく、必要な人材や運用にかかる時間、問題が起きた場合の対応コストも含めて比較することも肝心です。

制作会社にお願いするケースでは、AIを一緒に使えないの?

小竹
全体のサイト構築は制作会社さんにお願いするとして、一部のページだけ私がAIで自作する方法はどうでしょう?
鈴本
不可能ではありませんが、AIでつくったページをCMSでどう管理するかを設計する必要があります。さらに、ページごとにデザインやプログラムのつくりが違うと、ブランドの一貫性が失われたり、後から更新しにくくなったりする可能性があります。
小竹
やっぱり、WebサイトでAIを使うのは諦めたほうがいいんですね。これからAIに詳しくなろうと思っていたのに……。
鈴本
全部を諦める必要はありません。まずは、AIに任せる仕事を選びましょう。
小竹
AIにも適材適所がある、と。
鈴本
はい。たとえば、文章の校正に活用したり、Webサイトに掲載するコンテンツのアイデアを出してもらったりするのはいいと思いますよ。
小竹
わかりました。私、AIでサイトをつくる前に、AIと一緒に企画書をつくればよかったんですね。今度こそ「エム・ティー」の目的から整理してみます!
鈴本
いい使い方ですね。その企画書も、提出する前に小竹さん自身でよく確認してくださいね。
小竹
はっ! また、そのまま信じて提出するところでした……!

Web Designing編集部・大竹の取材メモ

Web Designing新人編集者の大竹です。今回は、博報堂アイ・スタジオのフロントエンドエンジニア/テクニカルディレクターである鈴木利弥さん、野本優和さんにお話をうかがいました。

私もAIに指示を出すと、整った文章や画面がすぐに出てきて驚くことがあります。ただ、完成したように見えても、それが正しいのか、企業の目的に合っているのかを判断するのは人です。制作会社はWebサイトをつくるだけでなく、曖昧な要望の中から課題を見つけ、目的を具体化し、公開後の改善まで一緒に考えてくれる存在だとわかりました。

今回わかったこと

  • AIでWebページの形をつくることはできても、そのまま企業サイトとして使えるとは限らない
  • 成果を出すには、サイトの目的、伝える相手、導線、評価する指標を考える必要がある
  • 企業サイトでは、情報の正確さ、権利、セキュリティ、更新・確認体制なども重要
  • 制作会社には、課題や目的の整理から公開後の運用・改善まで相談できる

次回はCMSの選び方について。たくさんあるCMSの中から、自社に合うものをどう選べばいいのでしょうか? どうぞご期待ください。

※上記の記事内に登場する企業・商品・人物・使用画像・ブランドサイトは架空の設定です。

教えてくれたのは…

記事内のキャラクター(鈴本ディレクター)は、鈴木さん・野本さんへの取材をもとに再構成したものです。

鈴木利弥さん
株式会社博報堂アイ・スタジオ
フロントエンドエンジニア/テクニカルディレクター


2015年に博報堂アイ・スタジオへ新卒で入社し、ブランド・コーポレートサイトなどの制作に幅広く従事。実務経験を強みに、戦略・企画立案からマーケティング実践まで一貫したテクニカルディレクションを担当。現在はこれまでの知見を活かし、新規事業開発を担当している。

野本優和さん
株式会社博報堂アイ・スタジオ
フロントエンドエンジニア/テクニカルディレクター


キャンペーンサイトから大規模コーポレートサイトまで幅広いプロジェクトに参画し、提案・テクニカルディレクション・要件定義・設計・実装を一貫して担当。多数のCMS導入・構築・移行において、CMSアーキテクトおよびフロントエンド領域を担う。

取材・構成:Web Designing編集部 文:小平淳一
企画協力:シックス・アパート株式会社

  • URLをコピーしました!
目次