Good web design for the Housing Association Sector – 10 tips

We have been designing and developed Housing Association websites for across England and Wales for ten years and gained a huge amount of experience that we can bring to your project

How to design a housing association website

We have been designing and developing websites for the Social Housing sector for the last 5 years, one of our first jobs being for Waterloo Homes Housing group and Southern Housing group. It is an exciting sector to be in, especially as there are so many stakeholders to be considered; from a resident trying to pay the rent via a resident’s portal, to potential tenants looking for a property via a property module, to investors and developers looking for opportunities to invest, to government bodies, council officers, researchers etc. And with the housing crisis, we are able to serve organisations with our expertise to help the situation to get people access to affordable homes.

I find the human side of things interesting and a challenge to work with different departments within the HA organisation trying to achieve a design which engages, helps channel shift from calling a call centre to getting residents using online systems, and is quite frankly a nice experience for the user.

Here are some findings, I have collected, when designing for the housing sector (some of these apply to all web design projects):

Ready to find out more?

For more information on our web consultancy, web design, web build and web marketing services visit our housing association web services page

10 handy design tips to achieve good web design for a social housing website

1/ Listen to the stakeholders via a discovery workshop

Engage with all stakeholders such as residents, staff members and property sales staff to understand what they need prior to even thinking design. This because you need to design a website for the residents, the potential resident and without really getting into their head and understand what they need, you can’t start a design. I propose to undertake wireframes first as you can test the user journeys, see where the current failings lay in why users are not using a website or engage with the website via call to actions. Don’t ask them to have an opinion about design (you have to find the design solution, you are the design expert), but ask them how they would like the site to work, what doesn’t work for them and why, and maybe ask them for some good examples. We always offer workshops with all different stakeholders to get answers to questions you may not think of at design stage. You also get a flair of the brad of an organisation through attending the workshop, which you will need to create a good look and feel.

In the process take the odd occasion and cal the client back to ask how they are doing, how they are getting on with integrating content into your design. For example I have found that after a training session the client find it hard to find which content fits into which template, and I am always happy to advise on that as well as which styles to use. Don’t feel that this should be additional paid work, but it all helps to make your design looks its best. Stay in touch with the client at all times and offer a helpful hand eg cutting a picture here and there ready for integration into the content management system.

2/ Don’t allow design by committee

Design is an integrated process, it’s is all about hierarchies, focal points, negative space, using the right visual tools to communicate. Designing a variety of designs for a project in my eyes is open to problems as a ‘pick and choose’ mentality can create  a work culture which I do not support. I believe that you should be presented with the problems the client has and you as the specialist designer then offers the solution in design. They can ‘like it’ or ‘dislike’ a design but don’t ask why they don’t like it. Go back to asking them about the objectives of the website and the design, the aim, the feeling they want to portrait, the brand and  then try to find answers to these questions in design. This may practically mean you may present a solution and then the client doesn’t like it, but in my opinion it is a chance for you to go over things and check again and again the objectives of the web, what it is used for, who it needs to appeal to (persona) and what they main call to action / digital engagement should be. (What do you want the user to do). I often present one design concept, (and very unlikely a wild card), after having attended a workshop, listened extensively to the brief, done my research, and thought about the main key objectives.

3/ Create a good brief

Work with Housing Association on the brief, listen and engage with them, they know their organisation and their problems, their users and sometimes their prospective users. Using a standard design brief is a good starting point to commence wireframes and then the look and feel. this brief shall entail objectives, aims, talk about personas, design legacies, do’s and don’ts, and may be supported by a branding guidelines which most organisation have (If they don’t ask an expert to produce one of them as it is critical in assuring a consistent brand and communication strategy).

4/ Design with conviction

You are designing a tool to be used by residents to get advice, pay their rent, report a repair or Anti-social behaviour etc. A tool that may also be used by developers to engage with the Housing Association, so it needs to look corporate whilst having a human touch. Think of this end-user when you design: use clear concise language, large titles, good clear call to actions to make sure the visual language helps them with digital engagement, which in turns helps the HA on channel shift. Don’t be afraid to experiment but make sure you understand the main accepted standards for good web design, and good usability, work with a grid, establish 3-4 templates and not more as too many maybe confusing for the content editors. Start thinking about the editor and how they will need to add and update content continuously, so be friendly by keeping things simple, avoid decoration but get to the point, making sure at all times you know the hierarchies of content and what is to be communicated, that there is clarity in the message and everything leads to the call to action (the engagement), eg ‘Call us now’, Report Anti-Social behaviour here’, rather than ‘More’.

Make sure your designs remain true to the initial concept through the process, and don’t be afraid to tell the client if you feel that the design is moving away from the initial look and feel.

Make sure you have a good list of ‘my favourite sites’ always updated as it helps you to know what you like without influence. Learning from others is fine, but always trust your gut instinct, the client will learn to appreciate your conviction.

5/ Think responsive

Think of the user, 30% of users will be using a tablet or a phone, so definitely enter a repsosinvive design process, and if you don’t have the expertise make sure you find someone who does. It also teaches the designer to keep things simple; I am very happy that we have come to this where we have to think/ design agile, and allowing design to move and adapt to different devices. yes I may loose control over how something looks, but I am happy I facilitate the path to better engagement via the right tool. And in regards to design, there has been a trend of less decorations, less fuss, more to the point –  with my background, this is very welcome. The option to now integrate Google fonts has really helped creativity and I can say I can almost design anything.

6/ The proof is in the pudding (yum)

So how do you proof if something is working in design? Well everyone has an opinion about design, that is clear but can we actually test how users engage with content, if they are affected by content, design, graphics etc, and if they engage with it?

We can test engagement via AB testing where we present the user with a variety of option (design options) and let Google via Google analytics display the ‘preferred version’ of a design element. I work closely with our SEO specialist in achieving good results on digital engagement via AB testing.

We can also undertake ‘eye-tracking where we sit users in front of a retina camera to see how they engage with a website, if they can find certain call to actions, how long it takes them to understand a page, read it and move onto a call to action,  and we can create heat maps which are then analysed to improve the website. I find this fascinating.

7/ Make it personal

Use testimonials from residents to make the site personal. Use interesting engaging imagery that represent the HA, not stock photography. Encourage the client to facilitate the change of photos, they may want to use an intern to update images etc, they keep a site lively and fresh.  By adding little special graphics element, such as a nice fact or an infographic you can really portrait an organisation, using nice typography, graphical icons etc. This makes a design personal and the client will like it more than an out the box design. BUT less is more, keep styles simple.

8/ Don’t be afraid to have an opinion

It is so easy to take the brief, a branding guide, a communications guide from a HA and simply translate this into a web design. Don’t be afraid to voice your opinion if you feel the Corporate identity isn’t right, the brand isn’t reflected, the tagline doesn’t suit what you understand the HA’s core values are. I have found that by being passive you come to regret later when the outcome is ‘bland’, unsynced. Once you are in the design process, stick to you intial concept and make sure this is adhered to; you are the expert with the conviction so you need to help the client to remain on that path. This may be difficult as you will be handing over the web site for the client to integrate the content, but you can be there in the background, advising and pointing out when things are moving away from the main objectives.

9/ Undertake Quality assurance after content entry – it’s all in the details

All good and well designing a nice design with a good informa pages pages containing lots of styles, but without real content, you don’t know if you design works. It’s about details, padding can make a huge difference, a nice highlight box in the right place can add interest to a boring page, so make sure after the client has had a trainings session and started to add some content, you have a look around the site and see what styles are required to make a nice design even better. This maybe a nice breakout box or a better listing, rather than just a boring bullet list using a graphical device to make content more appealing. Good QA after the build is critical but even better to have a look at the design as a whole after the content has been entered, even if only at 70%. You are the owner of the design so make sure you check on it.

10/ Take the opportunity to upsell

The best time to talk to a client is after a successful web build, when everyone is at a high and the site still looks nice. Even if you are a designer and not a salesperson you have established a relationship with the client, so it is a good time to ask if they require any promotional materials, a video perhaps or new stationery. They may even go to an exhibition and you can help them with this too. It is good to offer a one-stop shop for the client as they know you own the design.

…and one more/ Add the latest to your portfolio

Don’t forget to ask the client for a testimonial after you have finished the design process. Then, when the site has gone live, make sure you show your work off via your portfolio and even write a case study. This way you make sure that your pipeline doesn’t dry up for more work. LinkedIn offers the facility to upload designs, so use it.