NGO Website Development in India: How to Design a Navigation Menu That Works for Donors, Volunteers, CSR Partners and the People You Serve

NGO Website Development in India: How to Design a Navigation Menu That Works for Donors, Volunteers, CSR Partners and the People You Serve

An NGO website menu works when it lets each of your four or five audiences find their next step in one or two clicks, using words they would use themselves. For most Indian non-profits that means a short main menu of five to seven items (About, What We Do, Get Involved, Impact and Reports, and Contact), one always-visible Donate button, and a footer that carries the trust and compliance pages. It does not mean one menu item per programme, one per department, or one per trustee's idea. This guide explains how to design that structure, how to test it cheaply before you build, and how to avoid the mistakes that make good NGO websites hard to use. It is written for directors, communications heads and trustees commissioning or rebuilding an NGO website in India.

Menu design sounds minor, but it is where the organisation's internal structure collides with the visitor's goals. Staff think in departments and funded projects. Visitors think in questions: Is this organisation real? What do they do? Can I trust them with money? How do I help? Where do I apply for help? The menu is your first, and sometimes only, chance to answer.

Who is actually using your menu

List your real audiences before drawing any menu. Most Indian NGOs have these, in varying proportions:

• Individual donors. Often arriving from a WhatsApp message, an appeal or a search. They want to know the cause is real and how to give, and many are on a phone.
• Volunteers and interns. Students and professionals who want to know what is on offer, where, and how to apply.
• CSR and institutional partners. Company teams and foundations who need proof of governance, registrations, reporting and past partnerships, and a named contact.
• Beneficiaries or their families. People seeking help, who may be on a low-end phone, may prefer Hindi, Marathi or another language, and may be in distress. If your services are open to applications, this audience needs a clear path that does not run through a donation page.
• Media, researchers and government officials. A smaller group looking for facts, reports and contacts.
• Staff and job seekers. Sometimes relevant, usually a footer link.

Ask your team how many visits you get from each, using real data where you have it: analytics landing pages, the enquiries your inbox receives, the calls your reception takes. Where you have no data, say so and estimate honestly. The menu should serve the audiences that matter most to your mission, not the one that speaks loudest in the meeting.

Principles for the main menu

Use five to seven top-level items. There is no law of nature that sets this number, but a short list is easier to scan on a phone and forces decisions about priority. If you have fifteen items you have not decided what matters.

Name items by what the visitor wants, not by your org chart. "Get Involved" is understood by more people than "Engagement and Outreach". "Our Work" or "What We Do" beats "Verticals". "Reports and Financials" beats "Statutory Disclosures", though you can use the formal term on the page itself.

Put the donate action outside the menu list. Make Donate a distinct button, in a contrasting colour, at the right end of the header, and keep it visible on mobile. Do not bury it inside "Get Involved" only. Duplicate it inside the menu too, because some visitors look there first. Our guide to donation page design covers what the button should lead to.

Keep programme names out of the top level unless you have two or three flagship ones. An NGO with eleven programmes does not need eleven menu items. Group them under What We Do by the issue or by the beneficiary, such as Education, Health, Livelihoods, and let the landing page list individual programmes. Visitors browse by issue much more often than by internal programme code.

Use dropdowns sparingly. Dropdowns work poorly on touch screens, are easy to trigger by accident, and can be hard for people using keyboards or screen readers. A good rule is one level of dropdown, no more than six items each, and always make the parent item itself a real page that is also useful, because on a phone the first tap may open the submenu instead of visiting it.

Make it consistent. The same menu in the same place on every page, with the current section clearly marked.

Add breadcrumbs on deeper pages. A trail such as Home, What We Do, Education, Scholarship Programme helps visitors who arrive from a search directly on a deep page orient themselves.

A sample structure

This is an illustration for a fictional Pune-based education and livelihoods NGO, not a template to copy. Adapt it to your own audiences.

Header: Logo | About | What We Do | Get Involved | Impact and Reports | Contact | Donate

• About: Our Story, Mission and Values, Trustees and Team, Registrations and Governance
• What We Do: Education, Livelihoods, Health Camps, Where We Work
• Get Involved: Donate, Volunteer, Partner With Us (CSR), Fundraise for Us, Careers
• Impact and Reports: Annual Reports, Audited Financials, Stories, Newsletter
• Contact: Contact Details, Get Help (for beneficiaries), Grievance or Feedback

Footer: Registrations (with numbers), Privacy Policy, Terms, Refund and Donation Policy, Contact, Social links, Newsletter signup, Language selector

Notice what the example does. Volunteers, CSR partners and fundraisers are all inside "Get Involved", which keeps the main bar short, but each gets its own page with its own content. Beneficiaries have a "Get Help" link that is not hidden under donation language. Governance and reports are easy to find, because that is what CSR teams and cautious donors look for.

Build a CSR partner path and a volunteer path

These two audiences are often mishandled because they are lumped into "Contact Us".

CSR and institutional partners judge you on proof. Give them a Partner With Us page that explains the kinds of partnership you offer, who to contact, what documents you can share, and how reporting works. Place registration details, trustee information and audited reports one click away. We have written about this in our guides to CSR volunteer portals and transparency and impact reporting. Do not publish figures you cannot back up, and use only partner logos for which you have written permission.

Volunteers need specifics: what roles exist, in which cities, the time commitment, the age or skill requirement, the application steps and what happens next. A single "Volunteer" page with a simple form and an honest description of expectations will convert better than a vague call to action. If volunteer opportunities change, say when the page was last updated, so a visitor does not apply for a closed role.

The beneficiary path

If any part of your work is open to applications, such as scholarships, medical support or training, the people who need it may be the least well served by a typical NGO site. Consider:

• A clearly labelled "Get Help" or "Apply for Support" link, in plain language, visible from the home page.
• Content in the language your beneficiaries use, not only English. See our guide to a multilingual Hindi and Marathi donation site.
• A page that works on a basic phone and slow mobile data. Our guide to low-bandwidth mobile design for donors applies equally here.
• A phone number and, if you operate it, a WhatsApp number, because some people will not fill in a form.
• Eligibility stated plainly, so people do not apply when they cannot be helped and are not disappointed.

Keep this path separate from fundraising language. A person seeking help should not have to scroll past a donation appeal to find the application.

Trust and compliance pages: where to put them

Indian donors and CSR teams look for evidence that an NGO is legitimate. The menu is not the only place to provide it, but it should make it easy to find. Many NGOs gather these on a single page, often named "Governance" or "Registrations and Reports", linked from the main menu and the footer:

• Legal registration details (trust, society or Section 8 company) and the registration number.
• Tax registrations your organisation actually holds, such as 12A and 80G, with the numbers and validity dates exactly as shown on your certificates, and a PAN.
• FCRA registration, only if you actually hold it, and the details of your FCRA designated account if you accept foreign contributions. Check current requirements with your adviser; the rules have been amended several times, as we note in our guide on the FCRA amendment rules.
• Other recognitions, such as an NGO Darpan unique ID, if you have one. See our piece on NGO Darpan.
• Trustee or board names and short biographies, with permission.
• Annual reports and audited financial statements.
• Contact details for a named person who handles queries.

Only publish what is true and current, and update it when certificates are renewed. An expired 80G reference left on a page is worse than none. If you are unsure what applies to your organisation, ask your chartered accountant; we build the pages, but compliance decisions are theirs.

Test the menu before you build it

You can test a navigation structure cheaply before any design or development.

Card sorting. Write each of your pages or topics on an index card or a sticky note, about thirty to forty of them. Ask five to eight people from your real audiences, such as a regular donor, a volunteer, a CSR contact and a beneficiary's relative, to group them and name each group. Where they disagree with your structure, take note. You can do this on paper in a meeting room or with a free online tool.

Task testing. Once you have a draft menu as a simple diagram or sketch, ask the same people to say where they would click to do specific tasks:

1. "You want to donate monthly. Where do you go?"
2. "You want to check whether this organisation is registered and see its accounts."
3. "You are a company wanting to fund a project. Where do you go?"
4. "You are a student wanting to volunteer in Pune this summer."
5. "You need help paying school fees for your child."

If three of five people hesitate or choose differently on a task, the menu needs work. Five testers will not give you statistics, but they will reveal the major problems. As the nature of the test is qualitative, treat it as a way of finding problems, not of measuring them.

Measure and adjust after launch

After launch, look at real behaviour for a few weeks before changing anything.

• Top landing pages and exit pages in analytics show where people arrive and where they leave.
• Click data on the menu and the donate button can come from your analytics events or a free recording tool. If almost nobody clicks "Impact and Reports" but many search for "80G", your label or placement may be wrong.
• Site search queries, if you have a search box, are a direct list of what people could not find.
• Calls and emails asking questions the site should already answer are a sign something is hidden.

Our guide to donation analytics and the GA4 funnel explains how to set up the events, and our guide to planning SEO pages for donors shows how your page structure also affects how people find you in search.

Accessibility and the mobile menu

A large share of NGO visitors arrive on phones, so design the mobile menu first.

• Use a clear menu button with a visible label or a recognisable icon, large enough to tap comfortably.
• Keep the Donate button visible outside the collapsed menu.
• Make sure the menu can be used with a keyboard and a screen reader. Focus order should follow the visual order, and open and close states should be announced.
• Provide sufficient colour contrast between text and background.
• Avoid hover-only submenus, since there is no hover on a touch screen.
• Test on at least one older Android device and on slow data.

An accessible menu helps everyone, and it also protects trust: our article on accessibility and donor trust explains why.

Common mistakes

1. A menu that mirrors the organisation chart. Visitors do not know or care which department runs a programme.
2. Fifteen top-level items. Nothing stands out, and on a phone the menu becomes a long scroll.
3. Donate hidden in a submenu. The most important action should be the easiest to find.
4. Jargon labels. "Verticals", "Stakeholder engagement" and "Statutory compliance" mean little to most visitors.
5. A mega-menu on a mobile site. It looks impressive in a desktop mock-up and is painful on a phone.
6. No path for beneficiaries. The website becomes a fundraising brochure and ignores the people the organisation exists for.
7. Trust pages buried. Governance information that takes four clicks to find is not much use.
8. Out-of-date items. Closed campaigns, expired registrations and "latest news" from two years ago.
9. Redesigning the menu without redirects. If URLs change, old links from donors' emails, news articles and WhatsApp messages stop working. Plan redirects. See our guide on 404 errors and redirects.

A step-by-step process for your team

1. List your audiences and rank them by importance to the mission.
2. List every page that exists or should exist, and delete or merge the ones nobody needs.
3. Run a card sort with five to eight real people.
4. Draft a menu of five to seven items and a footer. Write labels in plain language.
5. Run the five task tests on paper.
6. Revise, then build the menu, with the mobile version first.
7. Add redirects for any changed URLs.
8. Launch, then review analytics and site search after three to four weeks and adjust labels.
9. Review again once a year, or when your programmes change.

If you also want a sense of what a full NGO website involves, our guides to NGO website cost in India and must-have NGO website features are useful companions.

Frequently Asked Questions

How many items should an NGO website menu have?

Five to seven top-level items is a sensible target, plus a separate Donate button. Group programmes and related pages beneath them rather than adding more top-level items, and test the labels with real visitors.

Should the Donate button be in the menu or separate?

Both. Make it a visible, contrasting button at the end of the header that stays on screen on mobile, and also include a Donate link inside the Get Involved menu for visitors who look there.

Where should an NGO put its 12A, 80G and FCRA details?

On a clearly labelled governance or registrations page linked from the main menu and the footer, using the numbers and validity dates exactly as on your certificates. Only list registrations your organisation actually holds, and keep them updated.

Do NGO websites need a separate page for CSR partners?

It is strongly advisable. CSR teams look for governance proof, reporting and a named contact. A dedicated Partner With Us page, with documents and reporting explained, serves them better than a general contact form.

How can we test a menu without spending much?

Run a card sort with five to eight people from your real audiences and then ask them where they would click for specific tasks. It costs only time and shows the major labelling problems before you build anything.

Sources

• Nielsen Norman Group articles on navigation design, card sorting and mega-menus, for the general principles of short labelled menus, card sorting and task testing.
• W3C Web Content Accessibility Guidelines (WCAG) 2.2, for keyboard, focus, contrast and target size requirements.
• Official certificates and the relevant government portals (Income Tax Department, FCRA division of the Ministry of Home Affairs, NGO Darpan) for registration details; check current rules with your adviser.
• The sample menu is a fictional illustration, the five task tests and the nine-step process are our own working guidance, and no audience percentages are claimed.

About the author and next step

This guide was written by the NGO web team at Govindani Infotech, a website design and development company at 2nd Floor, Landmark Plaza, 206 Satara Road, Parvati Paytha, Pune 411009, which has built more than 500 non-profit websites. If you would like help restructuring or building your NGO website, see our NGO website page and website creation service, or contact us on 092019 58274. Scope and pricing are confirmed by the team after understanding your organisation.