事例紹介

より支援者があつまり、寄付がうまれるサイト構造へ。国際NGOのWebサイト全面リニューアル支援

子ども支援/国際NGO法人

ご紹介するクライアントは、途上国における子どもの支援を行う国際NGOです。
2023年から2024年にかけて、同団体のWebサイトを全面的にリニューアルし、寄付者増加と支援者の拡大を目指すプロジェクトを実施しました。

課題

Webサイトの機能面での課題と寄付獲得の阻害要因

リニューアル前のWebサイトには、問題点が大きく4つありました。それぞれの問題が相互に影響し、ユーザー体験や寄付の獲得に悪影響を及ぼしていました。

問題点1 モバイル対応の不足
WebサイトがPCファーストで設計・作成されており、スマートフォンやタブレットでのアクセスに十分対応されていませんでした。そのため、モバイルでWebサイトに訪れたユーザーにとって見づらく使いづらいWebサイトになってしまっており、直帰率が高い状態でした。

問題点2 SEO対策の不足と寄付導線の不明確さ
SEO対策が不十分で、検索エンジンからの流入が非常に少ない状態でした。また、検索でユーザーが流入するページから寄付に関するページへの導線が明確でなく不十分だったため、ユーザーが寄付ページにたどり着かず、途中でWebサイトから離脱することが多い状態でした。

問題点3 表示速度の遅さ
サイトの読み込み速度が遅く、ページがなかなか表示されない状態でした。不要なスクリプトや整理されていないCSSが原因で、ユーザーが離脱する一因となっていました。

問題点4 運用の複雑さ
1つのWebサイトに対し、3つのCMS(WordPress)が用いられており、更新や運用が煩雑になっていました。そのため、運用チームがシステムの複雑さが大きな負担になっており、スムーズな更新がしづらい状態でした。

これらの課題を踏まえ、Webサイトのユーザビリティを大幅に改善し、寄付導線の最適化を行うことが必要でした。特に、モバイルユーザーの体験を向上させ、サイト内での行動がスムーズに行える設計が求められていました。

解決策

モバイルファースト設計とSEO強化

この課題に対し、私たちはWebサイト全体のリニューアルを提案しました。ただ作り直すだけでなく、各部署へのヒアリングを通じて要求整理・要件定義を行い、コミュニケーションフローを整備しました。また、Webを活用した寄付促進のためのマーケティング戦略も支援しています。
このプロジェクトでは、以下の3つを基本方針として重視しました。

  1. 活動に共感した訪問者が寄付アクションを取りやすいサイトにする
  2. 活動内容や豊富な寄付メニューを初回来訪者にも正確に伝える情報設計
  3. モバイルファースト設計、ページスピードの改善、サイト内回遊率の向上

まず、現状分析を行い、クライアントのマーケティング要件とKPIを明確にしました。それに基づき、クライアントのターゲットユーザー像を深く分析し、ペルソナを作成しました。次に、ペルソナに基づいて、ユーザーがどのようなステップでWebサイトを利用するのかを明確にするために、カスタマージャーニーマップを策定しました。

<カスタマージャーニーの具体例>

  1. 認知・共感フェーズ
    寄付や団体に関連する情報を取得し、社会問題の存在や寄付ができることを知る段階。まだ関心が浅いユーザーに対して、社会問題の提示、支援の成果などの提供を行います。
  2. 興味フェーズ
    寄付先の団体に関する情報を比較・検討し、さらに詳細な情報収集を行う段階。どのような団体があるかを積極的に調べるようになるため、団体への信頼や寄付への安心感を醸成する支援者の声や、団体の強み・特徴が伝わるコンテンツが効果的です。
  3. 後押しフェーズ
    寄付への意欲が高まり、詳細を調べ始める段階では、不安感を期待感に変えることが重要です。寄付の効果や成果を具体的に示すことで、寄付のハードルを下げられます。また、寄付の種類を提示し、質問や相談に対応することで安心感を与えつつ、寄付金の用途や成果を訴求することが効果的です。
  4. 寄付フェーズ
    寄付を行うために、特定のプロジェクトを選択し、実際に寄付を実行する段階。フォームの利便性やセキュリティへの不安など、最終判断前のアクションの阻害要因を解消します。
  5. 寄付直後フェーズ
    寄付完了後の安心感を感じ、家族への共有やSNSで仲間探しを行う段階。支援後のサポートを行ったり、「寄付してよかった」と思ってもらえる情報を提供することで、帰属意識を醸成したり追加寄付を促したりします。
  6. サービスを続けて使うフェーズ
    寄付の効果やプロジェクトの進捗に満足し、さらなる寄付を検討する段階。継続寄付につなげるためのモチベーションを上げたり維持するための情報提供を継続します。
  7. 追加寄付フェーズ
    ロイヤルティが高まり、追加寄付を行う段階。団体からの支援に強い信頼と満足感を感じさせることができ、逆に追加寄付の不便さや負担を解消できると、さらに新しい寄付機会にも意欲的になり、追加で行うモチベーションが生まれていきます。
  8. シェアフェーズ
    寄付を行った後、その寄付経験を他者にシェアする段階。シェアの仕組みの提供やシェアしたいと思えるコンテンツの提供により、シェアのハードルを下げるように働きかけます。

カスタマージャーニーマップに基づき、訪問者がスムーズに行動できるユーザーフローを作成し、各ページが適切にリンクされ、ブログ記事や活動報告から直接寄付ページにアクセスできる設計を行いました。

次に、サイトの軽量化を意識したWebサイト設計と構築を進めました。不要だったスクリプトや煩雑なCSSを無くし、ページの表示速度向上を意識した構築を行いました。さらに、WordPressも1つに統合することにより運用効率を高め、管理の負担を軽減しました。

また、Webサイト構築時は訪問者が関連情報に簡単にアクセスできるよう、回遊性の向上も図りました。従来は「NEWS」「活動レポート」「ブログ」に分かれていたコンテンツを「活動分野」や「国別」で再整理。タグを利用して関連する記事へのアクセスを簡易化し、訪問者が興味あるトピックに自然と回遊できるよう設計しました。また、寄付先の課題が明確なキラーコンテンツを新たに作成し、訪問者が団体のミッションに共感しやすい仕組みを構築しました。

さらに、Webアクセシビリティ向上のため、JISX8341-3のAAレベルに準拠したサイトを構築。運用面では、デザインをコンポーネント化し、今後の更新作業でも一貫性が保たれる設計を整えました。加えて、Webサイトが常に高品質で維持されるよう、アクセシビリティガイドラインと運用ガイドラインも策定しました。

結果

寄付額 約77%増/セッション数 約40%増

1年以上にわたるプロジェクトでしたが、無事にリニューアルを完遂させることができました。
リニューアルの結果、PV数はプロジェクト開始後の5か月で、リニューアル前に比べて40.5%増加し、寄付額は昨年の同期間と比較して77.1%の伸びを記録しました。今回のWebサイトリニューアルによって、ターゲットが明確になり、寄付者が寄付しやすい構造にしたことが、成功の要因と考えています。

また、ページ表示速度の改善や回遊性の向上により、訪問者はストレスなくサイトを利用でき、寄付までのプロセスもシンプルで効果的に最適化されました。カスタマージャーニーに基づいた設計によって、今後の運用改善時にも持続的に支援者、寄付者増加に向けた継続的な施策実行が期待できます。

NPO・NGOにとって、Webサイトは支援者との重要な接点です。今回のプロジェクトは、限られたリソースの中で、いかに効率的に支援者を獲得するかという観点からも大きな成功を収めています。

私たちクリエイティブホープは、NPO・NGOがより支援者と寄付者が集まるWebサイト作成のご支援を今後も行ってまいります。

私たちが提供する
サービス

その他の実績紹介

戦略策定から運用負荷軽減まで。マーケティング思考をベースにしたWebサイト構築による、デジタルメディアの戦略的活用。

WWFジャパン様
ふかく知る

顧客とのデジタルコミュニケーションにおける、プロモーション企画・開発支援

劇団四季様
ふかく知る

顧客フォローアップをより効果的にした、マーケティングオートメーションの活用

スウェーデンハウス株式会社様
ふかく知る

ユーザー体験を向上!定量データ分析基盤を整えてマーケティング成果を最大化

放送関連メディア制作会社
ふかく知る

寄付フォームへの遷移率2倍。寄付促進とブランド強化を実現した国際NGOのWebサイトリニューアル事例

環境保護/国際NGO
ふかく知る

アナログ管理からデジタル運用への大転換で申込者数増加を実現、Hubspot導入で業務効率化

音楽関連の公益財団法人
ふかく知る

HubSpotを用いたリードナーチャリング戦略策定と実行支援で商談創出を加速

BtoBマーケティング企業 
ふかく知る

ビジネス目標達成に向けて自走しつづける営業組織のDXを実現!

採用関連SaaS企業
ふかく知る

デジタルマーケティングの立ち上げ支援から体制整備

大手海運グループ/物流企業
ふかく知る

「デジタルによる直販モデル」の立ち上げ戦略から基盤構築までご支援

大手住宅設備機器メーカー
ふかく知る

宇宙利用ビジネス創出のためのプラットフォーム構築の基本戦略から戦術までを支援

一般財団法人宇宙システム開発利用推進機構様
ふかく知る
google mapで見る