NPO法人ホームページ作成事例7選 ｜ 制作時に必要な項目も徹底解説

ホームページの活用による集客は、営利企業に限りません。NPO法人もホームページの内容を充実させることにより、会員や寄付金を集めることが可能です。

現在NPO法人の数は上昇傾向にあり、令和3年度10月末で認証されている法人数は50,000以上に上ります。このような沢山のNPO法人があるなかで自分の団体を知ってもらうためにはオリジナリティのあるホームページの作成が必要になります。

本記事では以下にあるNPO法人のホームページ作成に役立つ情報をお伝えしています。

• NPO法人のホームページ事例
• NPO法人のホームページに入れておきたい項目
• NPO法人に特化したホームページ制作会社

また、最終章では団体を知ってもらうためにポータルサイトの紹介も行っています。初めてホームページを作る方や、NPO法人のホームページがどういったものか知りたい方は是非ご覧ください。

NPO法人におけるホームページの役割

NPO法人は営利を目的としていないために、ホームページから積極的に集客をする必要がないと考えている人も多いでしょう。しかし、NPO法人におけるホームページの大きな役割の1つは、会の活動を多くの人に知ってもらい、会員や寄付金を増強して活動を財政的に安定させることにあります。

そのため、設立の趣旨や活動報告などの情報を継続的に発信して、周囲に興味を持ってもらうことが大切です。そうした情報発信からより多くの会員や寄付金が募れれば、経営安定の支えとなるでしょう。

NPO法人ホームページの事例7選

それでは、ホームページの制作や見直しには、どのような点に注目すればよいのでしょうか？事例を紹介しながら、学ぶべきポイントを見ていきましょう。

1. 認定NPO法人　グリーンバード

グリーンバードは原宿表参道発信のプロジェクトで、「街をキレイにする」をコンセプトに全国でさまざまな掃除プロジェクトを企画・実行しています。通常であれば掃除をしている人々の画像がたくさん並びそうですが、トップページは、白を背景に緑色の線だけで街がシンプルに描かれています。

そこに飛行船が飛んできたり人が掃除をしていたりといったアニメの「動き」を一部に取り入れることで、ある種の躍動感が生まれます。

街のあちらこちらに散りばめられたバナーは、一般的なホームページの「メニュー」にあたります。こういった独特な構成は、訪問者をいっきにグリーンバードの世界観に引き込むことに成功しています。

2. 放課後NPOアフタースクール

ちょうど子どもたちが教室から帰路に向かおうとする「3時33分」というキーワードを効果的に使用している例です。例えば、時計のアニメーションが3時33分でストップした先に、放課後を自由に楽しんでいる子どもたちの写真がちりばめられています。

また、「午後3時33分　あなたの子どもはどこにいますか？」というテキストを目立つように配置し、このNPOの存在意義をアピールしています。

さらにトップページをスクロールすると「午後3時33分、アフタースクールはゴールデンタイムです。」というキャッチフレーズが目に飛び込みます。キーワードを「時刻」に託して表現した好例です。

3. NPO法人 芦生自然学校

目に飛び込んでくるのは、子どもたちが自然を楽しんでいる生き生きとした様子の動画です。なんといってもこの迫力と躍動感がこのホームページの一番の魅力でしょう。

また、随所に配置された、丸みをおびた写真背景の切り取り方、手書きのようなフォントの選び方、黒一色のシンプルなイラストの描き方などから、活力や自然体、軽快さ、満ち溢れるエネルギーなどを感じ取れます。素材と活動テーマがうまく調和している事例です。

4. NPOバディチーム

バディチームは、虐待防止を目的に家庭訪問型の支援活動を行うNPO法人です。暗くなりがちなテーマですが、オレンジと白を基調とした、たくさんの家族のイラストを随所に見せることで、「安心感」や「暖かさ」を表現。さらに、どのページもテキストはシンプルで短文です。

なるべく長文や難しい専門用語を避け、見やすさ、わかりやすさを主眼にしています。それぞれのテキストが短文なだけでなく、その周囲に十分なスペースを設けることで、そこにある情報を短い時間で把握できます。

明るい色調とシンプルなイラスト、そしてわかりやすさを最優先させたテキストとその配置の仕方を参考にしましょう。

5. NPO法人My style

地域の人材育成やネットワークづくりを中心に活動しているMy style。トップページのスライドショーでは、画面を二分割。右側に活動を連想させる人々の写真を、左側にそれに連動する短い詩を紹介。この団体のコンセプトや姿勢を、詩というモチーフで楽しみながら理解できるように工夫されています。

活動内容や関わりが多方面に渡るため、「企業」「個人」「自治体」「団体」が一目でわかるようにアイコンを活用。なるべく「複雑だ」「難解だ」と思われないように、カラフルな色や楽しげなイラストを多用し、軽さや明るさを強調しています。

6. 認定NPO法人引退馬協会

スライド型式のトップページ画像では、写真が変わるとキャッチコピーもそれに連動したテキストに変えるのが一般的ですが、こちらのホームページでは、写真は変わってもキャッチコピーは一切変わりません。

そのため、馬の写真は次々と変わっても端的な活動内容を表現したテキストが私たちの目に印象付けられます。画面右側に固定されている「馬を引き取りたいあなたへ」の縦長バナーは邪魔過ぎない位置にあり、同時に導線をきちんと確保できています。

7. アフリカ象の涙

アフリカ象を守る活動をしているNPO法人です。トップページのメニューは少なく3つに絞り込み、カーソルを乗せることで細かなメニューが選択できるように工夫されています。

トップのメイン画像からクリックして飛べる「取り組む課題」では、シンプルな黒い太文字の数字と赤色のイラストを使用し、私たちにアフリカ象の現状を生々しく伝えてくれます。

赤と黒の組み合わせ、そして数字のインパクトをうまく利用することで、このNPOのコンセプトや役割がダイレクトに伝わります。

また、これまでに7つのNPO法人のホームページを紹介してきましたが、他のNPO法人のホームページを見たい場合はギャラリーサイトの利用をおすすめします。

DESIGN BASE

DESIGN BASEは世の中の参考になるホームページを見られるギャラリーサイトです。掲載している業種は多岐にわたっているため、葬儀社以外のホームページを参考にすることもできます。

また、ホームページデザインにおいては７つのポイントが挙げられます。

• ファーストビューでユーザーの興味関心を惹きつけられるか
• 情報の優先順位に応じてレイアウトができているか
• レイアウトや情報がシンプルでわかりやすいか
• ナビゲーションバーがあるか
• レスポンシブ対応されているか
• トンマナ、フォントに一貫性があるか
• ユーザーファーストが徹底されているか

上記に書いてあるポイントについて、より詳しく知りたいという方は以下の記事をご覧ください。他のギャラリーサイトの紹介や、デザイン性の高いホームページについての解説を行っています。

NPOのホームページに載せるべき内容

さまざまなホームページの好例を見てきましたが、どのNPOのホームページでも、最低限掲載するべき項目があります。まずはそれらをしっかりと押さえておきましょう。

活動内容

NPOはそれぞれ目的を持って活動しています。しかし、初めての訪問者にとっては、いったい何をやっている団体なのかがピンとこないこともあります。かっこいいキャッチフレーズや画像を散りばめるだけでなく、まずはどんな団体なのか、活動内容をわかりやすく紹介するページを設けることが必要です。

団体概要

設立の趣旨や沿革、関係する団体などを紹介するページを設けることで、その団体がどのような経緯で生まれ、今までに至るまでどのような関わりの中で活動してきたのかをより深く理解できます。団体概要は、団体の信用力向上のために必要です。

寄付依頼

どのような組織でどのような活動をしているのかが理解できたら、閲覧者は団体の活動に積極的に関わりたい、寄付をしたいと考えるかもしれません。そのために、寄付依頼のページをわかりやすい場所に設け、スムーズに寄付できる動線を確保しておきましょう。

活動実績

同じようなテーマで活動しているNPOはほかにも多くあります。その中でも自身が所属するNPOに協賛してもらうためには、どんな活動をしてきたか、過去の活動実績を伝えることが大事です。これにより、そのNPOへの信頼感が増し、応援したいと考える人が増えることでしょう。

お知らせ

継続的に活動していることを示すためには、お知らせページが必要です。立派なホームページを作っても、日々きちんと活動しているかどうかがわからなければ、実体のないものと捉えられても仕方ありません。常に情報発信を行うことで、閲覧者に継続的に興味を持ってもらえます。

FAQ

団体や活動に関するよくある問い合わせや質問を、FAQ形式で示すことも大事です。FAQを掲載するのはホームページの品質向上に役立ち、閲覧者の満足度向上にも寄与します。また、多くの人が聞きたいことをFAQにまとめておけば、自分たちの手間も省けます。

問い合わせフォーム

NPOや活動に興味を持ってくれた人が団体に問い合わせるときに、わかりやすい問い合わせフォームがなければ、その人とNPOの接点は妨害されたことに等しくなります。一目でわかる問い合わせフォームを作成し、閲覧者とのコミュニケーションの機会を大切にしましょう。

お問い合わせフォームの作成方法

では実際にはどのようにお問い合わせフォームを作成するのでしょうか？お問い合わせフォームの作り方は主に2つあります。プログラミング言語を使ってプログラミングコードを記述していく「コーディング」と「お問い合わせフォーム作成ツール」を利用していく方法です。

専門的な知識を要するコーディングで作成した場合と、比較的簡単にフォームを作成できるプラグインを使ったケースでは、メリットも異なってきます。

1．コーディングで作成

プログラミング作業がプログラムの設計から完了までの全般を指すのに対して、コーディングはプログラミング言語での記述を行う作業のみを指します。メリットは自らソースコードを書くため自由度が高く、思い通りのお問い合わせフォームを作れるというのがメリットです。

ただし、専門的な知識を持つ人材が自社にいない場合には、フォーム作成後の更新やメンテナンス作業も含め、外部へ発注しなくてはなりません。

2．お問い合わせフォーム作成ツールを利用

コーディングの知識を持つ人材がいなくても、お問い合わせフォームを作成できるツールやサービスを活用すれば、簡単にフォームを設置できます。自社のニーズに合う機能を備えたツールを導入すれば、業務の効率化に役立つはずです。以下でおすすめのお問い合わせフォーム作成ツールを3つ紹介します。

Googleフォーム

あらゆる用途に利用できる「Googleフォーム」は、世界的なシェアを誇る信頼性の高いツールです。サービスは無料で利用でき、豊富なデザインやテーマの中から雰囲気に合ったものを選択したり、画像や動画を追加したりすることもできます。また、モバイルデバイスにも対応しているため、ユーザーの環境を選びません。

自動集計機能でスムーズにグラフ化を行い、集計の手間が軽減できます。また、スプレッドシートとの連携により、より詳しい分析結果を表示させることも可能です。コーディングの知識がなくても、直感的な操作で簡単にフォームが作れる設計になっているので、導入後すぐに活用できます。

Tayori

「Tayori」は、スムーズな顧客対応の実現や会社の情報整理など、バックオフィス業務を支える用途で導入実績が豊富なクラウド型のサービスです。カスタマーサポートの効率化などに適しており、これまで40,000アカウントが導入したという実績があります。テンプレートも豊富に用意されていて、アイデア次第で多彩な活用方法が見出せるはずです。

ステータス管理・タスク管理機能も実装しているので、プロジェクト管理ツールとしての利用にも向いています。WordPressをすでに利用している場合は、専用のプラグインでスムーズに導入できます。自社の財産となる顧客情報を整理して、より良いコミュニケーションの構築を実現させるツールです。

オレンジフォーム

お問い合わせフォームはもちろん、資料請求やアンケートなど幅広い目的で使える「オレンジフォーム」は、自由度の高さが特徴です。PC・タブレット・スマホにも対応しており、作成したフォームをFacebookやTwitterなどのSNSに利用すれば、イベントの告知と応募フォームへの誘導が同時に行えます。

テンプレートからフォームを選択するだけの簡単なステップで作成できるため、専門的な知識は必要ありません。SSL通信対応で安全性が高く、メルマガとの連携機能など、マーケティングの効率化を実現する数々の機能が備わっています。

より詳しくお問い合わせフォームについて知りたい方は以下の記事を参考にしてみて下さい。お問い合わせフォーム作成時の注意点や今回紹介した以外のツールも紹介しています。

ホームーページに入れたい要素や項目が決定したらそれぞれのページに対してトップページからどのようにアクセスをつなげていくか、階層構造にしてわかりやすくまとめていきます。

トップページを一目見ただけで、そのサイトがどんなページで構成されているのかわかることが重要です。このような全体を俯瞰して見ることができる構成図のことを「サイトマップ」といいます。

またサイトマップが完成したら次にホームページのレイアウトを決める必要があります。その際に用いるのが「ワイヤーフレーム」です。

各ページを制作する前にレイアウトを決めておくことで、サイト全体の統一感を保てます。ワイヤーフレームの出来次第で、後々の作業のやりやすさも変わってくるので、以下のようなポイントに注意して作成します。

• スッキリしていて見やすいか
• 最も伝えたいことが目立っているか
• ユーザーの知りたい情報がどこにあるのかわかりやすいか
• ある程度サイト内を回遊できる作りになっているか

ワイヤーフレームの具体的な作成方法は以下の記事で詳しく説明していますので、併せてご覧ください。

NPO法人に特化したホームページ制作会社3選

沢山あるホームページ制作会社から自社にあった1社を見つけるのは困難です。そこで本章ではNPO法人に特化したホームページ制作会社を3社紹介しまっすので参考にしてください。

1. nuweb　

nuweb（ニューウェブ）では「社会課題解決をともにデザインする」と掲げ、NPOの思いを社会に伝わるような、寄付募集に強いホームページ制作・運用サービスを提供しています。NPOの制作実績は150件以上あり、料金プランは以下の2つです。表を通して料金を確認してください。

また、料金プラン以外のオプションプランとしてファンドレイジングやブランディング、広報支援も提供しています。

nuweb Lite

ページ数	5ぺージ	10ページ	15ページ
金額	250,000円	400,000円	550,000円

nuweb Basic

ページ数	10ページ	20ページ	30ページ
金額	900,000円	1,400,000円	1,900,000円

2. ファンドレイジング

ファンドレイジングはNPO法人が発展するための資金調達をサポートしている会社です。その事業は多岐にわたりますが、NPO法人向けのホームページ制作も行っています。

ホームページ制作に必要なドメイン・サーバー取得から、スマホ対応、SEO対策までをカバーしたホームページまるごとパックを提供しています。

必要な物がすべて揃って月額10,000円（税別）なので、初めてホームページを作成する方におすすめの会社です。

3. サイ株式会社

サイ株式会社ではNPO法人を中心にデザイン性の高いホームページ制作を行っています。実際に作成事例を見てみると、アニメーションが多用されており、オリジナリティのあるホームページを作成することができるでしょう。

また、ホームページだけでなく、パンフレットや本の表紙などのデザインも手掛けています。

NPO法人のホームページでやりがちなNGポイント

制作時に、特に気をつけたいNGポイントを解説します。

寄付への導線がわかりづらい

いざ寄付をしたいと思っても、寄付のページに簡単に行きつくことができなければ、閲覧者はホームページを離脱してしまうかもしれません。

寄付への動線をわかりやすくし、クレジットカードや電子マネーによる決済方法など、簡単に寄付できる仕組みを作ることにも注力しましょう。

更新頻度が低い

長期間更新されていなければ、活動を休止していると思われてしまいます。特に、寄付金を集めながらその使途についてどこにも掲載がなければ、信用は得られません。

しっかり活動を行っているのであれば、更新を随時行い、活発に活動していることをアピールしましょう。

NPO法人格があることを明記していない

NPOは非営利団体のことを指しますが、必ずしも法人格を有しているとは限りません。法人格の取得には、定款を作成し、所轄官庁の認証が必要です。

過去には、NPOと名乗り犯罪組織の隠れ蓑として利用されていた例もありました。こうした事情もあるため、NPO法人格を取得し、そのことで周囲に信用してもらうことはとても重要です。

寄付を受けるには、それ相応の信用が必要です。法人格を取得している場合は、必ず団体概要にNPO法人と記載しましょう。

ポータルサイトでの集客

これまではNPO法人におけるホームぺージ作成に必要な情報をお伝えしましたが、本章ではNPO法人のポータルサイトを紹介します。ホームページを作成するだけではなくこういったポータルサイトを利用してより多くの人に知られるようにしましょう。

activo

activoはボランティアの求人情報を載せているポータルサイトです。その掲載数は数多く、ボランティアに関心のある25万人にリーチしており、PV数・訪問者数ともに国内1位の実績を誇っています。

また検索キーワード「NPO　バイト」で3位「NPO　求人」で1位に表示されるため、多くの人の目に触れる可能性があります。料金プランは以下のようになっていますので参考にしてください。

	フリープラン	ライトプラン	プレミアムプラン
月契約	無料	1,450円	5,800円
年契約	無料	12,000円	48,000円

内閣府NPOホームページ

特定非営利活動促進法第72条に新たに第2項が追加され、NPO法人の信頼性向上を図って内閣府が独自のポータルサイトを展開しています。また、登録料や使用料は無料なので、最初に登録するのにおすすめのポータルサイトです。

まとめ

営利目的ではないNPO法人でも、多くの人に自分たちの活動内容を広く知ってもらうために魅力的なホームページ作りは欠かせません。

「見やすくわかりやすいホームページを作りたい」、「ホームページをリニューアルしたいけれど、どこから手をつけていいかわからない」、「更新頻度を上げたいけれどなかなか時間が取れない」などとお悩みの方は、一度、オンライン無料相談会を受けてみてはいかがでしょうか？