【レポート】デジタルマーケターズサミット2023 Summer

約1万ページ BtoBサイトのリニューアル。成功の秘訣:他部門を巻き込んだ“戦略策定”と“設計”

2023年春に、半導体メーカーのトレックス・セミコンダクターは、4言語対応のWebサイトリニューアルを実施した。他部門を巻き込みながら成功へ導いたリニューアルの全容を解説する。

BtoBの企業サイトのリニューアルは、規模が大きいほど他部門との交渉や調整が必要になり、意思決定に時間がかかる。2023年春に、半導体メーカーのトレックス・セミコンダクター株式会社(以下トレックス)は、製品サイト・企業サイトなど、4種類の多言語対応のWebサイトリニューアルを実施した。「デジタルマーケターズサミット 2023 Summer」にトレックスの堂埜有子氏と、合同会社あやとりの片岡泰仁氏が登壇し、他部門を巻き込みながら成功へ導いたリニューアルの全容を解説した。

(左)トレックス・セミコンダクター株式会社 製品企画・海外統括本部 製品企画部 広報グループ グループ長 堂埜有子氏、(右)合同会社あやとり 企画制作部 CTO/クリエイティブディレクター 片岡泰仁氏

前回のリニューアルから7年。きっかけとなった2つの外的要因

トレックスは、電源ICという極小の部品の設計製造販売を行う半導体メーカーで、国内に6拠点、海外に9拠点をもつ企業だ。合同会社あやとりは、本社を静岡県浜松市におく会社で、クライアントの事業戦略にもとづいたWebサイト制作や、マーケティング人材の育成をメインに行い、最近は地域課題解決支援にも力を入れている。

あやとりは、2016年のトレックスWebサイトのリニューアルをきっかけに、毎月定例会を開催し、コンテンツ拡充、アクセス解析、広告出稿などトレックスのWebサイト活用の支援を継続して行っている。2021年秋頃に2度目のリニューアルの相談があり、それが今回のプロジェクトにつながった。リニューアルのきっかけは、なんだったのだろうか。前回のリニューアルから7年が経過し、外的要因、内的要因の双方からリニューアルの必要が高まってきたと堂埜氏は語る。

外的要因の一つは社会的責任とその情報発信の重要性の高まりです。前回のリニューアルを行った2016年以降、CSRといった企業活動の取り組みを、Webサイトなどを使って外部へ開示することが強く求められるようになりました。大きなきっかけとなったのは、2022年にプライム市場へ移行したことです。その際に、TCFD(Task Force on Climate-related Financial Disclosures、気候変動に関連した情報開示)の開示の義務化により、Webサイトでサステナビリティの取り組みを公開する必要性が増えていきました。もう一つは、業界の再編や、競合のWebマーケティングの活発化もあり、ユーザーが使いやすい、検索しやすいWebサイトを実現する必要性を感じていた点です(堂埜氏)

内的要因はサポート期限と、運用上の業務効率化。リニューアル影響は約1万ページ

内的要因は、サーバOSやミドルウェアのサポート期限とCMSのバージョンアップが同じタイミングで、それぞれどう対応するかリニューアルの検討時期と重なっていたという。加えて、Webサイトの更新や運用に関する業務効率化も課題であった。

前回のリニューアルでは、Webサイトを営業支援サイトと位置づけていたので、大量の製品データの運用や検索性等を重視し、商用のCMSを採用しました。しかし、構築をSIerに依頼していたため、コンテンツ追加や改修等をしたい場合、簡単には行えず、費用も時間もかかるという課題がありました。また、Webサイトは多言語対応をしているのですが、言語ごとにWebサイトが分かれており、多言語管理の更新性が悪いという課題もありました(堂埜氏)

リニューアルの規模感はどのくらいだったのだろうか。トレックスが運用しているサイトは5サイトあり、下図左のオフィシャルサイト、パートナーサイトの2つがサーバのリプレイスに関係のあるサイトだ。加えて、直販サイト、IRサイトもデザイン変更による影響を受けるため、合計で約1万ページに影響がある、大きなプロジェクトとなった。リニューアルプロジェクトは、2022年3月から本格的に開始し、2023年4月に公開をした。

リニューアルの影響は合計で約1万ページに及んだ

成功のポイントは他部門を巻き込み進めた戦略策定と設計。他部門を巻き込む2つのメリットとは

Webサイトリニューアルは予定通り公開を完了し、成果もでている状態だ。片岡氏は成功のポイントとして、「他部門を積極的に巻き込みながら進めた2つの工程があった」と語る。

以下の図は、あやとりが“成果の出る”Webサイトリニューアルの進め方の説明でよく使う図であり、工程ごとに①~⑦まで番号が振ってある。他部門を巻き込みながら進めた1つ目の工程は②の戦略策定で、部門や立場を越えた対話からWebサイトリニューアル全体の戦略を導き出した。2つ目の工程は、③の設計だ。ここでは技術者や営業という専門家視点も取り入れた設計を行ったという。

他部門を積極的に巻き込みながら進めた2つの工程(②戦略策定と③設計)

片岡氏は他部門を巻き込むメリットとして、以下の2点をあげた。

  • 各部門の意見やニーズを事前に拾い上げることができる
  • 上層部を巻き込むことでプロジェクトの進行がスムーズになる

「違う個性を持っている方々と、真摯に議論を交わしていくことが、質の高い成果につながる」と片岡氏。とはいえ、日頃から関係性がないと、真摯に議論を交わすことは難しいだろう。片岡氏は、堂埜氏と他部門の方との関係性が良好に感じたと語り、堂埜氏に他部門との関係性を構築する工夫について問いかけた。

Webサイトのここを使いやすくしてほしい、技術的な資料をもっと見やすくしてほしいといった各部門からのWebサイトへの要望を、可能な限り実現をして、信頼を築いてきました。それが、部門間の良好な関係づくりにつながったのかもしれません。小さな改善でも、常に声をかけてもらえるよう意識しています。また、広報業務を行っていることもあり、普段から社内の各部⾨と協⼒する業務が多い点もあると思います(堂埜氏)

戦略策定の工程では、ビジネスプロセスマップのワークショップを開催

では、他部門を巻き込んでどのように進めていったのか、工程ごとに取り組みを紹介しよう。まずは「戦略策定」の工程だ。「戦略策定」においては、複数部門の担当者が参加して、ビジネスプロセスマップ作成のワークショップを実施した。

ビジネスプロセスマップは、『顧客の行動』と『自社の活動』の両面から事業活動の流れを1枚の図にまとめたもので、あやとりのオリジナルフレームワークです。自社の活動として、各部門の動きを整理していくことで、お互いの業務への理解が深まり、ボトルネックを発見できたり、業務効率のアイデアが生まれたりする効果があります(片岡氏)

あやとりオリジナルフレームワーク「ビジネスプロセスマップ」のサンプル

ワークショップには、営業部門を兼ねた海外拡販のマネージャー、技術部門、マーケティング部門、ウェブ/広報部門が参加した。当初は、顧客行動を製品開発の始まりからリリースまでを想定してワークショップを行っていた。参加メンバーで議論をするうちに、積極的な顧客(技術者)は、最新情報の取得のために展示会などに参加するので、製品開発の前に潜在的な接点が生まれる可能性があるという意見があり、その場で製品開発前のプロセスを追加したという(下図左の1/3部分)。

実際に作成したビジネスプロセスマップ。議論を深める中で想定していたプロセスよりもさらに前のプロセスが追加になった

ワークショップで新たなターゲットユーザーを発見! サイトを「製品サイト」と「企業サイト」に分離することを決定

顧客として同社の製品を使って開発する製品開発会社を想定していたが、トレックスが他メーカーとの共同開発や産学連携をするシーンも考慮すると、Webサイトを利用するターゲットユーザーとして「コラボレーター」が出現するという新たな気づきも得られ、リニューアルの方針に活かすこととなった。

ビジネスプロセスマップ作成後に整理したサイトのユーザー像。左の「コラボレーター」が新たに追加となった。

また、ビジネスプロセスマップを整理したことで、会社サイトを「企業サイト」と「製品サイト」に分離することを決定した。ビジネスプロセスマップ作成では、どのような成果があったかと片岡氏が堂埜氏へ問いかけた。

ビジネスプロセスマップの作成時に、あらかじめ想定していたユーザーがいたが、『コラボレーター』という想定していなかったユーザーを発見できたことは大きな成果でした。また、リニューアル前のサイトは、自社の営業支援サイトとして、製品を探しやすく入手しやすいように構築していましたが、顧客である設計者のためにより詳細な技術情報の発信も重要であることに気づきました。一方、企業としては、サステナビリティ、CSRなどのメッセージを伝えていく必要があります。同じサイトで、製品情報と企業情報のどちらも表現することは難しいため、『製品サイト』は営業支援と設計者支援のためのサイトとし、ブランディングに重点を置く『企業サイト』と分離することを決定できました(堂埜氏)

技術者や営業という専門家視点を取り込む際に重要な3つのポイント

続いて、「設計」の工程における取り組み紹介だ。設計の工程では、技術者や営業という、専門家を巻き込んだ設計検討会を実施した。片岡氏は大事なポイントとして次の3つを挙げた。

ポイント1:専門家には情報のインプットから行う

専門家は日頃から自分の分野について考えているので、Webサイトの設計への意見を求めると、たくさんの要望が返ってくる。しかし、専門家観点からの意見のためWebサイトにはそぐわない意見もある。そのため、まずはプロジェクトの背景や、Webサイトに関する情報を共有することが大切だ。その後に意見を聞くことで、よりブラッシュアップされた返答を得られる。

今回のリニューアルでは、競合の企業コンテンツの調査分析、自社サイトの現状分析、競合の製品コンテンツの調査分析、社内・顧客調査による自社の強みやイメージ調査の結果などをインプットとして提供したという。

ポイント2:さまざまな分野の専門家の意見を聞く

Webサイトは企業の情報をアウトプットする場なので、さまざまな部門の意思や意見を反映する必要がある。技術者だけでなく、顧客に商品を紹介する専門家である営業の意見も聞くなど、複合的な観点から設計の検討を行い、アイデアに偏りがでないようにする。

ポイント3:専門家(マニアックなユーザー)を観察する

デザイン思考のユーザー観察でも、「リサーチの基本は量より質」と言われる。一般的なユーザー100人の観察を行い、10の気づきを得るよりも、マニアックなユーザー10人を観察したほうが100の気づきが得られる可能性がある。マニアックなユーザーの視点や意見は設計の重要なヒントとなる。

次の図がサイト設計の方針だ。設計検討会の結果、さまざまな検索軸から製品ページにたどり着き、そこから回遊できるサイト設計となった。「ユーザーによって目的や探し方が異なるので、たくさんのルートを用意しておくことが必要だ」と片岡氏。

製品サイト設計の思想。

『セレクションガイド』では、トレックスがプロモーションしたい製品をピックアップして情報を掲載しています。『技術情報』も今回、力を入れたところで、以前から技術情報を拡充したいという要望をいただいていたので、設計に組み込みました(片岡氏)

技術情報はコンテンツを更新し続ける難しさがあると、堂埜氏は感じていたというが、現在も技術部門が積極的に記事を書いて、コンテンツの追加を行っているという。片岡氏も「みなさんの意欲があって、日々コンテンツが更新されており、とてもよいサイクルが回っている状態だと思います」と語った。

CMS管理の業務効率の課題は、Drupalの採用で大きく改善できた

今回のサイト構築は、オープンソースのDrupal(ドゥルーパル)を採用した。業務効率に関する課題はDrupalを採用することで解決できたという。Drupalのマルチサイト機能を使って、1つのCMS上に別デザインの3サイトを管理している。このような構成となっているため、システムのメンテナンスは一つだけでよいので業務効率の改善につながった。デザインは、共通部分と個別部分を分けることで、サイト全体のデザインのトーン&マナーの統一に役立っている。

Drupalは、商用CMSと比べると比較的容易に扱えるので、軽微な修正やカスタマイズをあやとりが行えるようになり、高速でPDCAを回せるようになった。堂埜氏も日々の更新が簡単にできるようになったと満足している。

多言語管理は、これまでのCMSでは言語ごとにWebサイトが独立管理されている構成となっていたが、リニューアル後は1つのサイトでページごとに翻訳を入力するような仕組みになり、管理が楽になったという。

また、これまでは、言語ごとに必要な項目をすべて入力していたが、構成を工夫することで、入力工数を削減した。具体的には、言語が異なっても同じ値が入る共通の入力項目を作成し、日本語と英語で異なる値を入力する必要がある場合のみ言語ごとに項目を作成した。ちょっとした工夫と思われるかもしれないが、取り扱い製品は300製品にわたるため、1つのデータを4言語で共通利用できることはかなりの業務工数の圧縮につながったという。

Drupalを採用したことで多言語管理の業務効率が改善

リニューアル前は、同じファイルであっても、それぞれの言語ごとにファイル名を変更してアップロードする必要がありました。現在は、一つのファイルを共有して使えるようになったので、作業時間が短縮されました(堂埜氏)

気になるコストの話。当初、フルリニューアルは不要ではという意見も

リニューアルで気になるのはコストの話。続いて、片岡氏はコスト観点で堂埜氏に話を聞いていった。「最初の予算取りでアクシデントが発生していましたよね」と片岡氏。

実は、トレックス社内では、サーバのサポート期限の延長、CMSのバージョンアップをすればフルリニューアルは不要ではないか、という意見があったと堂埜氏が振り返る。また、オープンソースの安全性へも不安の声があった。結果的に、理解を得られたものの、Webサイトを詳しく知らない部門の方から理解を得るのは難しかったという。理解を得るために、どういった説得をしたのかと片岡氏が問いかけた。

今後5年間のランニングコストの試算を提示し、リニューアルでどれだけ費用削減できるかと、リニューアルによって新しく実現できることを説明しました。オープンソースの安全性は、Drupalのセキュリティなどを丁寧に説明しました(堂埜氏)

リニューアル後は、CDN(Content Delivery Network)の契約プランの見直しや、CMSのライセンス費用が不要になったこともあり、ランニングコストは大きく削減できたという。今後は、サーバスペックの調整を行ってさらにコスト削減を図る予定だ。

サイト公開直後にKPTで振り返りを実施。リニューアル後も改善を継続中

最後のテーマは、今後のWebサイト活用についてだ。サイト公開後、アジャイル開発などにおいてよく活用される改善フレームワークであるKPT(Keep、Problem、Try)法により、他部門も含めて振り返りを行った。

長い期間のプロジェクトなので振り返りが難しいが、終了直後に実施したことで反省点や次回につなげたいものが見えました。リニューアルの途中で実施できると、見直しができて、さらによいと感じました(堂埜氏)

Try(挑戦したいこと)で出た課題は、タスクリストに落とし込み、今後Webサイトで実現していきたいと片岡氏。技術情報も今後、さらにコンテンツを拡充していく予定だという。また、今回のリニューアルからは話が逸れるが、直販サイトでの海外への販路拡大も計画しているという。

本講演では、BtoB Webサイトのリニューアルのポイントとして、他部門を巻き込んだ戦略策定のコツ、専門家を巻き込んだサイト設計のコツ、ウェブサイト運営の業務効率改善の事例が紹介された。リニューアルを検討している方は、ぜひ参考にしてほしい。

この記事が役に立ったらシェア!
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

人気記事トップ10(過去7日間)

今日の用語

WWW
「World Wide Web(ワールド・ワイド・ウェブ」の略。世界中のサイト( ...→用語集へ

インフォメーション

RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]