Building an engaging website: drawing the structure, winning the reader

Starting with pen and paper, Manushak walks through essential steps to design a website.

By Manushak Mila Guilhem on

Getting started

I started with looking into different non-profit websites to get some ideas of what I want or do not want to see on my website. I found the WordPress showcase of non-profit websites quite helpful and I also looked at the websites of other organizations that are similar to Women for Development, the NGO I am usually working with in Armenia.

At this stage, it is important to answer these few questions: What problems does your organisation address? What is unique about your project? Who is your audience?

After my share of research, my head was full of many ideas. Perhaps too many… I wanted to use all the pictures, videos, maps and graphics on my website. It took me another few days before I realized that I don’t need to use everything together and on the same page. I went to think about the general structure and then started organising the pages one by one.

Pen and a piece of paper

I always feel more comfortable using a pen and a piece of paper, when it comes to outlining a project. That’s what I did.

On a piece of paper, I structured a draft main menu and subcategories. After discussing with my colleagues at Huridocs, we added, changed and removed some parts. I also remained in touch with my colleagues back in Armenia and made sure they provided input and feedback. When the menu was agreed on paper, I created it in WordPress – which was really easy. Then I turned to creating new content and copying bits and pieces from the old website.

Writing and structuring text is important

Speaking of the content- it should reflect the organization’s work and provide the necessary information. The text should be easy to follow and it should be even easier to find what you are looking for, for example by structuring the text with straight forward sub-headings.

When coming to your site, a first time visitor should immediately be able to understand what your organization is doing and why it is relevant. For instance, on our old website when we talk about WFD projects, all we have is a general short description of a project. While working on the content, I decided to clarify the need of the projects.

Here is an example:Research has shown that teachers have to deal with different conflict situations during the day; often they spend up to 35-60% of academic time to manage the conflicts occurring among students. This is true for most of the teachers in every society and country. Armenia was not an exception…” I subsequently went on to explain how the project addresses this particular challenge.

Pictures speak to emotions

Pictures are an important part of any website. They reflect your work and usually tell a story. That’s why having nice pictures on the website helps visitors to receive a complete image of the your organization and the issues you are addressing. They can also be an important complement to text, as they can appeal on a more emotional level. You will need to spend some time on filtering and choosing pictures, if you have a large photo archive. If not, it is a good idea to start building one.

For our new website, I went through many pictures in our archive and created a folder with my favorites. This folder will be useful, not only when building the website, but whenever we need pictures for our communications in the future. Picking them, however, is not always easy. Here is an example:

Both pictures are nice and show similar scenes, but I would choose the first picture over the second one, because:

  • Students seem to be more involved and interested in the class
  • It is a picture that shows real action, rather then students waiting for a photo to be taken
  • All the posters of the peace education course appear on the wall, so the picture better reflects what actually has been going on

With my selection of pictures, my colleagues and me can now focus on the texts on the new website. As I said before, we need to write some new texts and need to get back to the old ones and update them. It is a lot of work, but it is rewarding, because we can make sure Women for Development and our work will be presented just as it is right now.

Workshop coming up and important work on the homepage

As soon as we have the content ready, we will start working on the homepage – that’s the first page most people will see. It’s tremendously important to make sure it will be good and I will come back to the blog with more on what is important and how to present information on the homepage.

Now I am preparing for the Open Society human rights workshop for this year’s interns in Budapest. During the workshop I have a session about information management and communications tools for NGOs. I will share a few useful tricks and apps, which I hope can help other interns in their work. I will share my impressions and presentation from the workshop, so you can also have a look if interested.

This is my second post about my internship at Huridocs. In the first post, I talked about how I started building an engaging website.

Manushak is an intern at HURIDOCS from the NGO Women for Development, based in Armenia. She has joined  HURIDOCS for four months as a part of the Open Society Human Rights Internship program. Manushak holds a BA in Theology from Yerevan State University and an LLM in European Law from University of Saarland in Germany. 

Posted in: