© NGO Forum on ABD
© Forus
2024-12-19
Web Development Guide for Civil Society Organisations: Best Practices from the Forus network
Websites are key tools for Forus members - National and Regional civil society platforms - to engage members, share information, and coordinate efforts. Designing a website for such purposes requires a structured approach, clear objectives, and a focus on inclusivity. Here’s a detailed guide developed with the support of the Forus communications working group for the unique needs of civil society organisations. For more information, you can visit the Forus Communications Clinic.
1. Designing a specifications document for your Webmaster for a new or existing website: Key elements to include and questions to ask
How can we align our vision with the webmaster’s technical capabilities and ensures clarity throughout the process?
This is an opportunity to sit down with your own members and teams to define how the website can support your communications, advocacy and capacity strenghtening objectives.
Define the primary purpose of the website and the type of content you are most likely to upload as well as the frequency based on your human resources and the type of contract you want to have with the webmaster.
Below you can find some guiding questions to help you conceptualise your website:
Purpose and Objectives
- What are the main goals of the website - these could be raising awareness, hosting resources for members, showcasing impact stories, organising events etc.
- How does the website fit into our broader communication and advocacy strategies?
- Do we need features like a members-only area, interactive maps, or event calendars to support our objectives that might imply additional costs?
Content Planning
- What types of content will we upload? Blog posts, reports, multimedia (videos, podcasts)?
- How frequently do we expect to update content?
- Who within the organisation will be responsible for creating and maintaining content? Do we need to plan for someone external do support us?
User Experience and Audience Needs
- Who is our primary audience? Members, donors, policymakers, the public?
- What actions do we want users to take on the website? Download resources, register for events, participate to our campaigns, donate, or contact us?
- Are there specific accessibility needs or language needs (e.g., for visually impaired users or if the website needs several languages)?
Technical and Design Requirements
- Does my organisation have a brand and graphic idendity that needs to be reflected in the website?
- Do we have images from our membership of high-quality that we can use to showcase our work?
- What features are essential to our website and why? Secure login for members, document repositories, data visualisation tools?
- Do we need the website to integrate with other tools or platforms, such as social media or email marketing systems to send out newsletters (like Mailchimp)?
- What level of support do we require from the webmaster? Ongoing maintenance, ad-hoc troubleshooting, or training for in-house staff?
Budget and Resources - how to make these sustainable
- What is our budget for the initial design?
- What is the budget for the maintance and what are the recurring costs per year (these might include hosting, domain name and human resources)
- Are there external grants or partners who might fund specific features or improvements?
2. Specify Technical Requirements with the Webmaster
- Identify core functionalities for your website, such as the inclusion of a members-only section, integration of maps to highlight network diversity, or the ability to host multimedia content such as podcasts and videos.
- Mention accessibility standards (e.g., compliance with WCAG guidelines) and multilingual support if operating in regions with diverse languages.
-
Recruitment Criteria for a Webmaster:
Look for:- Proficiency in accessible web design and user experience (UX).
- Experience with content management systems (CMS) like WordPress, Drupal, or Joomla.
- Support in capacity strenghtening for civil society staff
- Ability to implement secure login systems for private spaces like members-only sections (if needed).
- Skills in integrating tools such as interactive maps or data visualisation dashboards.
- A clear breakdown of costs - each item, from the Domain name to the hosting costs, security certificates, design and implementation of the visual identity have to be broken down separately.
-
Assignment Example for webmaster:
Task the webmaster with designing a homepage wireframe that includes a way to show your network's impact (e.g. visualisation and data) and a section for updates and news. Use this as a test to evaluate their understanding of your organisational goals and values. -
Content to ask a webmaster for proposals
Web developers should include the following elements in their proposal:
-
A detailed breakdown of costs, including any potential hidden costs, for full transparency.
-
Design costs: development of the website architecture, creation of mockups and visual design.
-
Development costs: coding, integration of features, tools for mapping and data visualization.
-
Training costs: training sessions, production of guides or tutorials.
-
Miscellaneous costs: fees for third-party tools (APIs, software libraries), certifications, or any other additional services required.
-
Recurring costs:
- Hosting costs: suggestions for hosting solutions, estimate of annual fees, and renewal options.
- Maintenance costs: post-delivery technical support, regular updates, bug fixes.
- Security costs: integration of security protocols, data protection, vulnerability testing.
-
-
A precise description of each component of the project, accompanied by a breakdown of costs by phase or task.
-
Examples of previous similar work, with links to completed websites or projects.
-
A list of tools and technologies that will be used for the website development, with an explanation of why these were chosen.
-
The terms and conditions for maintenance after the website is launched.
-
Understanding of the civil society context, including a short paragraph detailing the understanding of the context and their vision for the project.
Examples from the Forus network: Forus member in Brasil, Abong, uses an interactive map to showcase the diversity of its members: https://abong.org.br/
Forus member in Nigeria, NNNGO, uses pictures from their membership to show the impact of their activities together with a clear menu, easy to navigate, making their mission immediately understandable: https://nnngo.org/
Forus member in Nigeria, NNNGO, has also developed a CSO Atlas: https://csoatlas.com/
Forus member in Botswana, BOCONGO, has integrated a member-only space on their website for better civil society coordination in the country: https://bocongo.org/
Forus member in France, Coordination SUD, has a pop-up integrated into their website immediately asking to subscribe to their newsletter to increase the reach and visibility of their actions: https://www.coordinationsud.org/
Forus member in Finland, FINGO, has a functional website that includes the possibility to access content in local and indigenous languages: https://fingo.fi/en/finnish-development-ngos-fingo/ -
3. Choosing Secure, User-Friendly Hosting Solutions - Key Questions to Ask:
- Does the hosting provider offer SSL certificates for secure browsing?
- Is there support for creating and maintaining private member-only spaces?
- What backup options are available to protect against data loss?
-
When choosing a hosting provider, consider reliability, support, performance, and data centre locations that align with your audience’s geography - so with your region.
-
- Server Location: Choose a provider with data centres close to your primary audience to minimise latency.
- Scalability: Ensure the hosting plan can grow as your organisation’s needs expand.
- Security: Look for SSL certificates, firewalls, and regular backups.
- Support: Prioritise 24/7 customer support, especially if you lack in-house IT expertise.
- Budget: Evaluate costs for both initial setup and long-term maintenance
Below are examples of hosting options in different regions:
- Africa - Afrihost (South Africa): Affordable and reliable, ideal for small to medium-sized organisations.
- Truehost Africa (Kenya, Nigeria, South Africa): Offers local data centres and beginner-friendly pricing.
- HostAfrica: Specialises in VPS hosting with a strong presence across Africa.
Europe and North America - European hosting providers that offer strong data privacy laws (GDPR compliance). - SiteGround (Bulgaria): Offers robust security, fast load times, and support.
- IONOS (Germany): User-friendly hosting with strong customer service.
- LatinCloud (Argentina, Brazil, Mexico): Specialises in cloud hosting with reliable performance.
- Hostinger (Global, headquartered in Lithuania): Affordable plans and a strong presence in Asia.
- Amazon Web Services (AWS): Scalable and flexible, perfect for large-scale projects.
- Google Cloud Platform (GCP): Offers robust infrastructure and integration with other Google services.
- Cloudflare: A global CDN and hosting solution for speed and security.
-
4. Workflow for inclusive design: structure, colours, and accessibility
Inclusivity is crucial for CSOs serving diverse communities at national, regional and global level, including individuals with disabilities.
Tips for inclusive design:
- Use a clear hierarchy with headings and subheadings (H1, H2, H3).
- Break text into smaller sections, complemented by images or icons.
- Opt for high-contrast colour schemes to aid readability.
- Test designs using tools like WebAIM Contrast Checker.
- Ask support to civil society organisations that work for the rights of people with disabilities
Example from the Forus network: Forus member Cooperation Canada has included various options for people that need support to navigate their website: https://cooperation.ca/
5. General Tips for Civil Society Websites
-
Mobile-First Design:
-
Interactive Elements:
- Include a dynamic map to showcase projects, partnerships, or regional diversity.
- Add a news ticker or events calendar to keep your audience informed.
-
Simplified User Experience:
Keep navigation straightforward, with a focus on essential features like contact details, resources, and key updates. -
Security Measures:
Use multi-factor authentication (MFA) for private areas. Ensure regular updates and backups to safeguard against breaches. -
Cultural and linguistic:
- Translate content into relevant local languages where possible.
- Use imagery and examples that reflect your members.
6. Examples of Web providers and website builders
- What the Web: websites from non-profits includes capacity strenghtening sessions https://www.whattheweb.org/en/
- TechSoup - technology for non-profits (for advice and support in digital development) https://www.techsoup.org/
- Website builders as well are a practical solution for civil society organisations with limited budgets. They provide pre-built templates, and a range of tools to help you create and manage a professional website with in-house human resources. Below are some of the easiest website builders:
- Wix
- WordPress.com
- Squarespace
- Weebly
- Strikingly
- Carrd
- Webflow
- Jimdo