外国為替証拠金取引（FX）サービスを手がける株式会社外為どっとコム。同社の顧客向けのサービスサイトは、前回のリニューアルから相当の期間が空いてしまったことなどから、スマホ・タブレット対応が十分ではない、コンテンツ量が多く整理されていないといった課題を抱えていた。そこで、サイト管理基盤をCMS化するなどのリニューアルに着手、モバイル最適化によるSEO施策やUI/UXの向上などにも取り組んだ。リニューアルの経緯や効果などについて、同社 営業本部長 営業部長の渥美理人さんと同部 係長 保坂磨里奈さん、サイト構築を担当したCOLSIS（コルシス）Webディレクターの中西卓也さんと上野誠敬さん、UI/UXデザイナーの榎本一輝さんに話を聞いた。
リニューアルから時間が経過し、モバイル最適化やデザイン、サイト構造等に課題
同社は2002年に設立された外国為替証拠金取引（FX）サービス専業の事業者だ。渥美さんによると「口座数は2023年2月時点で58万口座を誇っている」という。
また、「お客様第一主義」を掲げ、FXという金融商品に関する認知や普及を進めるとともに2009年にはグループ傘下に外為どっとコム総研を設立、日本の個人投資家向けにFXマーケット情報を発信するなどの啓もう活動を行い、すべての投資家によりよい資産運用の環境を提供する取り組みを行ってきた。
同社の顧客向けのサービスサイトは、会員向けの各種情報や、これから取引を始めたいという人に「初めてのFX」に関する情報提供やサービスの説明、キャンペーン情報などを提供している。保坂さんは「前回のリニューアルから時間が空いてしまったこともあり、いくつかの課題を抱えていた」と話す。たとえば、PCでの閲覧を前提としていたため、スマホ、タブレットなどのモバイルデバイス向けにサイト表示が最適化されておらず、「SEO（検索エンジン最適化）としてさまざまな施策を行なってきたものの、スマホ対応が根本的な壁として課題になっていた」ということだ。
また、サイトデザインやレイアウトも経年のせいでトレンドに合わなくなってきという課題や、「コンテンツ量が多いものの整理されていない」（保坂さん）といったサイト構造、情報整理の面でも課題を感じていた。
CMSとして実績のある Movable Type に関する豊富な知見を有している点が決め手
そこで、サービスサイトのリニューアルを検討開始した。保坂さんによると、次のような要件をもとに複数の会社に声をかけコンペを実施したという。
（1）ゼロベースでUIUX設計・デザインをフルリニューアル（2）コンテンツも整理して、サイト構造をわかりやすく
（3）Googleの「Core Web Vitals（コアウェブバイタル）」対応を含む、SEO施策を実施する
（4）全コンテンツをCMS管理にして、更新性を高める
（5）セキュアで拡張性のあるインフラを構築する こうした要件に対し、コルシスの中西さんは「サービスサイトはサービスも多く、ページも多岐にわたるため、サイト構造、構成をゼロベースで見直し、併せて金融機関のサイトということで、インフラから高いセキュリティを確保するよう提案を行った」と話す。レスポンシブ対応のサイトとし、SEOを高め、CMSにより運用更新を容易にすることがポイントだ。 渥美さんは、リニューアルのパートナーとしてコルシスを選んだポイントとして「デザイン面だけでなく運用、セキュリティといった全体のバランスを重視した」と話す。特に、「CMSとして実績のあるMovable Type（MT）のサイト開発、プラグイン開発に豊富な実績、ノウハウを有している点」が高く評価された。 CMSには、MTのライセンスに加え、サーバー配信やワークフローなどのエンタープライズ向けに必要な機能がパッケージされた「Movable Type SmartSync Pack」が採用され、リニューアルプロジェクトは2021年夏頃から開始された。保坂さんは「初心者にわかりやすくFX取引を紹介するコンテンツからサイト内の回遊を高め、口座開設につなげていく動線を重要視し、サービスの拡張を通じて重複していたコンテンツをまとめ、足りないコンテンツは補充するといった整理が必要だった」と話す。その上で、コルシスには「サイト分析やターゲット分析、動線設計など、サイト制作の要件定義のフェーズに時間をかけてもらった」と振り返る。 コルシスの中西さんは、要件定義のフェーズについて「データからサイトを分析し、現状を共有するとともにターゲットとなるペルソナを明らかにした」と説明する。また、サイト構造とコンテンツの取捨選択について、コルシスの榎本さんは「関連するページへの誘導などの導線を整備して、継続的に閲覧を促すよう回遊性を高めた」とUI/UX面から狙いを説明してくれた。 コロナ禍での開発は、基本的にリモート体制で行われたが、コルシスの上野さんは「コミュニケーションを密にとることで開発の難しさは感じなかった」と振り返る。また、リモート開発が効率的、効果的に進むよう「開発ツールも制限なく使わせてもらうことができたので、設計やデザインはパワポ資料ではなく、実際に動くプロトタイプで説明できたことも、スピーディにプロジェクトを進められたポイントだった」（上野さん）ということだ。
コールセンターへのサイトに関する問い合わせはほぼなく、成功といえる
そのほかに、上述したリニューアル要件に対する対応としては、SEO対策として、数千あるページを2、3千ページにスリム化、実装面ではサイト表示のスピードに関するガイドラインを作成し、Googleの検索アルゴリズムに追加された「Core Web Vitals（コアウェブバイタル）」を含むSEO施策にも対応した。
また、更新性向上の観点からMTの管理画面のカスタマイズを実施。コルシスの上野さんは「更新対象のページ数が多いサイトなので、コンテンツを分類して、ダッシュボードを分けるなど、使い勝手を高めることに配慮した」と説明した。たとえば、「お知らせやイベントなど入力項目が多数なページでは、出力されるページの表示と入力項目の順番を合わせたり、パンくずリストについても、イベント情報などの入力情報をもとに自動生成できるようにした」（上野さん）ということだ。これにより、Web専門知識を持たない更新担当者も容易に更新できるようになり、「リニューアル後は、これまで担当者ごとにテイストが異なるデザインパーツなどが更新されていたものが、統一されたコンポーネントとしてボタンやパーツが管理され、更新されるようになったため、担当者が効率よく、新たなページを追加、改修できるようになった」と保坂さんは話す。
また、「モバイルファーストの面では、これまでスマホとPCのサイトで別々に更新が必要だったものが、ワンソースで管理できるようになった」（保坂さん）ということだ。
サイトデザイン面では、「自分がどのページを見ているか、サイト内で迷うことがなくなった」と保坂さんは話す。ナビゲーションの動きも直感的になり、既存顧客の離脱が少なくなったことで「リニューアル直後の、コールセンターへのサイトに関する問い合わせはほぼなく、その点で成功したといえる」と保坂さんは話す。
そして、セキュリティ面では、上述した Movable Type SmartSync Pack の「サーバー配信」機能を活用することにより、「CMSとWebサーバーを分離して管理し、MTから生成された静的ページが保管される本番サーバーとCMSが保管されるサーバーを分けることでCMSを狙ったサイバーリスクへ対応した」と渥美さんは説明する。レスポンシブデザインによるモバイル最適化やCMSによる運用効率の向上も相まって、リニューアルの効果を実感しているところだ。
今後も顧客関係強化のチャネル整備にコルシスにはサポートを
今後の展望について、渥美さんは「Webサイトは作って終わりではないので、長く続けていけるように修正、更新に取り組んでいきたい」と話す。スケジュール等から元の要件から削った機能などもあり、そこを今後の更新、改修で実現したいということだ。
その上で、「お客様第一主義」に基づく、重要な情報をわかりやすく提供するチャネルとして、WebサイトだけでなくSNSやYouTubeなどのチャネルを強化していくためのサポートを今後もコルシスには期待したいと話した。
また、保坂さんは「MTにより、Webの専門知識を持たない人でも容易にサイトを更新できるようになった」とした上で、今後はより多くの人が更新できるよう、サイトに携わる人を広げていきたいとし、そのためのプラットフォームの強化、市場環境の変化などへの対応にコルシスには引き続きサポートをお願いしたいと締めくくった。
事例データ
- サイトURL： https://www.gaitame.com/
- 制作会社： 株式会社COLSIS
- 使用した製品： Movable Type SmartSync（コルシス社提供、Movable Type ソフトウェア版をバンドル）
- リニューアルの目的：モバイル最適化を含むSEO対応や、UI/UXの最適化、CMS導入によるサイト更新性の向上などを目的に。
- どのような手ごたえがありましたか？：これまでスマホとPCのサイトで別々に更新が必要だったものが、ワンソースで管理できるようになり、ナビゲーションの動きも直感的になり、既存顧客の離脱が少なくなった。
