NPO専門ホームページ制作 -ニューウェブ-

MENU

NGOのホームページで参考になるサイト【事例10選】

NGOのホームページで参考になるサイト【事例10選】

ホームページを作る・新しくすることになったら、まず参考になるサイトを探される方が多いと思います。しかし、NGOの優れたホームページがまとまっているサイトはほとんど見かけません。

そこで、今回のnuwebコラムでは、参考になる優れたNGOのホームページをご紹介させていただくとともに、NPOやNGOに特化したホームページ制作を行うnuwebだからこそお伝えできる、お手本にしたいポイントも伝授させていただきます!

※この記事は、2022/06/28に更新されました

目次

1.公益社団法人 シャンティ国際ボランティア会

■ポイント:シンプルなメニューで情報にすぐ辿り着ける構成

非営利・非政府活動はアピールしたいことや求められる配慮が多く情報が溢れがちです。
シャンティ国際ボランティア会のホームページのメニューはとてもシンプルになっています。

ユーザーが得たい情報にすぐたどり着けるように、最初ヘッダー部分に目立つように表示されるのは「オンラインストア」「シャンティについて」「活動内容」「トピックス」「支援する」に絞られています。

22fc268ff55e1db4b09b04a57e01ec29-1656309414.png

出典:公益社団法人 シャンティ国際ボランティア会
https://sva.or.jp/

2.NPO法人 国境なき医師団日本

■ポイント:「初めての方へ」ページをつくる

最近、NPOのホームページでよく見かけるのが「初めての方へ」ページです。

団体概要やどんな社会課題に対して活動をしているのかを分かりやすく伝え、最後に支援を求めます。訪問者は1ページで団体のことを把握できる上に、どんなアクションをしたらいいのかが分かり、支援にも繋がりやすいので、これからホームページを作る・新しくされる団体にはぜひ作っていただきたいです。

97390d1dce74498c661c41e23f3f1395-1656309635.png
ab0aba10271d641f5553ca97beec3889-1656310114.png
00a93844631c994b5439754947b2ebaa-1656310156.png

出典:NPO法人 国境なき医師団日本
https://www.msf.or.jp/

3.公益社団法人 セーブ・ザ・チルドレン・ジャパン

■ポイント:ファーストビューがHPの印象を決める

ホームページに訪れたとき最初に表示される画面を「ファーストビュー」といいます。

セーブ・ザ・チルドレン・ジャパンは赤をメインカラーに、印象的な写真でファーストビューを作っており、切迫感が伝わってきます。

c47fa7fa97e76241f1754b8ca79da0a9-1656310400.png

出典:公益社団法人 セーブ・ザ・チルドレン・ジャパン
https://www.savechildren.or.jp/

4. NPO法人 ジャパンハート

■ポイント:活動への参加方法を1ページにまとめる

遠い国で起こっているように思えるNGOの活動に、自分にできることは何か知れるページを制作しておくのは重要です。
どのような参加方法があり、自分に合った方法は何かをまとめて示すぺージを用意しておくと、自分にあった応援の仕方を見つけやすくなり、最初の一歩が踏み出しやすくなります。

c8f699cc38296bf0790f7a7fde1c0b01-1656314472.png
990fef30270b27f9a0aa4bb59a75705c-1656319560.png
dfb86ea25ddf0bcd94ca2794035ab74b-1656319567.png

出典:NPO法人ジャパンハート
https://www.japanheart.org/

5.NPO法人 ワールド・ビジョン・ジャパン

■ポイント:寄付募集の見せ方を工夫する

ワールドビジョンジャパンのチャイルドスポンサーシップ制度のページでは、取り組む課題や寄付制度の説明、実際の子どもたちのストーリーが1ページにまとめられています。
実際に支援している女の子の名前を出し、その子の暮らしを動画を用いて紹介するなど、感情に訴えかける内容になっています。
さらにそれだけでなく、毎月の寄付金額やそれによって女の子の将来がどう変わるかも見せるので、初めてサイトを訪れた人でも寄付につながりやすい設計になっています。

8033adc61884e8c5ae66b70c7bd31896-1656314991.png
87b833151d66bbb28167ad9d07c41209-1656315001.png
3190d2273b948e83ddaa5abe06b966b4-1656315014.png

出典:NPO法人 ワールド・ビジョン・ジャパン
https://www.worldvision.jp/

6.公益財団法人 プラン・インターナショナル・ジャパン

■ポイント:数字の見せ方を工夫する

活動に共感してもらったり、支援を促したりするのに数字はよく活用されます。例えば、「1,000円の寄付で〇〇ができます」「世界の◯%が~~です」といったものです。

プラン・インターナショナルでは、それらの見せ方に加えて、「女の子が1年長く初等教育を受けると、その子が将来得る収入が約11%増加。」「女の子の早すぎる結婚を10%減らせば、人産婦死亡率は70%減る」というような、支援があればどれほどの効果があるかを数値化しています。

NGOの活動内容を数字で見せているのではなく、その結果として、どのような変化があるのかを数字として示しているのが見せ方としてとても上手です。

62ef8ac6a5f560022cf502b53cd5039e-1656315638.png

出典:公益財団法人 プラン・インターナショナル・ジャパン
https://www.plan-international.jp/

7.認定NPO法人 かものはしプロジェクト

■ポイント:想いののった文字を読みやすく

活動に想いがこもっていればいるほど、説明文は長くなってしまいがちです。そんなときには、字間に気をつけると読みやすくなります。

Webと長文の相性は悪く、説明文を短く収めるのに越したことはありませんが、デザインで情報の強弱をはっきりさせる、もしくは動きをつけて飽きさせない工夫するといいでしょう。

619d5a750b0622627f8f78e91934f47b-1656315893.png
2356dacae71de296eab3b2d6f0b1a836-1656315948.png
5f8f548165f7749466e0563d5e7db864-1656315992.png

出典:認定NPO法人 かものはしプロジェクト
https://www.kamonohashi-project.net/

8.認定NPO法人 e‐Education

■ポイント:トップページに伝えたいことをまとめる

一般的にトップページは、上から順にロゴやメニューがあり、写真や動画があり、お知らせ、サブページへの移動ボタン…と続きますが、e-Educationのホームページはトップページを読むと大まかに団体のことが理解できるような構成になっています。
活動を始めたばかりでコンテンツがまだそこまでたくさん無いという団体は、トップページで大まかに団体のことを伝えるのも有効です。

※nuwebにて制作

0a47874fcdeb838cbb3df199565ba6d6-1656316082.png
636fb0ad9a3dfb1a70c8a7da63872ac9-1656316022.png
33039658ab51a32e91ef6e9937726576-1656316033.png
ff81f6eeb70bfea1ac771b5e18b97f1e-1656316042.png

出典:認定NPO法人 e-Education
https://eedu.jp/index.html

9.認定NPO法人 Reach Alternatives(REALs)

■ポイント:活動内容の見せ方を工夫する

NGOにとって活動内容紹介のページは必須です。

REALsでは、活動内容一覧ページに、活動を「専門領域」と「活動地」に分類して表示しています。

広範な領域・国に活動を展開しているNGOほど、活動ひとつひとつを羅列するだけでなく、このように何かしらの観点で団体の活動をまとめているページがあることで、初めて団体を知った人に活動理解をしてもらいやすくなります。

※nuwebにて制作

aff585bedb618b6dd1f0e01ee8862a10-1655968609.png

出典:認定NPO法人 Reach Alternatives(REALs)
https://reals.org/

10.公益財団法人 ケア・インターナショナル

■ポイント:頻繁な更新でアクセスを増やす

ホームページへの訪問者を増やす一番簡単な方法は、ページ数を増やし、検索サイトから流入する窓口を増やしていくことです。

ケア・インターナショナルでは、毎月最新情報を更新しており、記事のテーマも様々です。
これにより、直接団体に関係がないような検索ワードでもGoogleやYahoo!などの検索サイトにホームページを表示させることができるのでアクセス数が期待できます。

※nuwebにて制作

8fd34a717d27e5b9ec0933c0d3f7a8ab-1656316232.png
958810fe297e78e4ce25dcbd493369e6-1656316343.png

出典:公益財団法人 ケア・インターナショナル
https://www.careintjp.org/index.html

NGOのホームページお手本ポイントまとめ

【構成について】
▽ファーストビューをシンプルに
▽トップページに言いたいことをまとめる
▽活動への参加方法を1ページにまとめる
▽「はじめての方へ」ページをつくる

【デザインについて】
▽訪問者に持たれたい印象をファーストビューに込める
▽文字は読みやすさを意識する

【その他制作での工夫】
▽寄付募集ページは「活動内容紹介+数字+声+支援ボタン」
▽ほしい情報にすぐ辿り着ける一覧ページをつくる
▽支援の結果どう変わるのかを数字で見せる

【公開後の運用について】
▽こまめに更新をしてアクセス数を伸ばす

いかがでしたでしょうか?

NGO自体やその活動をより多くの人に認知してもらうためにも、団体への寄付等をしてくれる応援者を増やすためにも、NGOにとってホームページはとても重要です。
今回のnuwebコラムがNGOのホームページ作成・リニューアルの参考になっていれば幸いです!

NGOのホームページ制作・運用サービスならnuweb

NGO・NPO法人・公益財団などのホームページ制作実績が120団体以上あり、ホームページ制作と公開後簡単に更新をしていただけるシステムがセットになったnuwebもご検討くださいませ!

NGOのホームページ作成・リニューアル事例をもっと見たい方へ

制作事例をもっと見る

NGOのホームページ作成・リニューアルに関して、プロに直接相談したい方へ

無料相談はこちらから

見積依頼・問い合わせ無料