Miles Maier Twitter @LasaICT Lasa

New Website Initiative

Jason King Web kingjason.co.uk

• London For All - funded by London Councils • http://tinyurl.com/pgtea2c

• Attendees MUTED by default • Ask questions at any time • Take part by raising hand or via chat panel • Recording available to download later • Please complete the post webinar survey

About Lasa

• 30 years in the sector

• Technology leadership, publications, events and consultancy www.lasa.org.uk

• Welfare Rights

www.rightsnet.org.uk

Jason King

• Freelance web designer and trainer • Many clients from welfare rights and law

sector • Worked for charities in the UK and Australia

on managing technology and websites jason@kingjason.co.uk

Planning a new website initiative

Notes to accompany the webinar by Jason King kingjason.co.uk

1. Do research Because most people's knowledge of modern website design is outdated. Don't compare yourself to poor websites, find out what the good ones look like.

www.uk-sands.org

Good non-profit web design: vandelaydesign.com/blog/galleries/best-non-profit-websites/ LASA Knowledgebase: ictknowledgebase.org.uk/youronlinepresence

2. Write a project brief Personally I never quote on a project until I've seen a detailed brief that shows the client has thought through what they need. Once your brief is written, get it signed off by committee, and you have something to send to potential web designers. What should a brief contain? ictknowledgebase.org.uk/websitebrief 10 things not to leave out: boagworld.com/business-strategy/web-design-brief WCAG 2 accessibility standards, a legal requirement: w3.org/TR/WCAG20/ Find a volunteer IT professional to help prepare the brief: it4communities.org.uk/

Find a web developer: suppliersdirectory.org.uk/

3. Choose a CMS There are many CMS to choose from, and various ways to build a website. Commission your website from a web developer who can confidently explain how their preferred CMS can match your project brief's requirements. Which CMS for your charity? http://bit.ly/1jPhmsO Drupal – needs to be installed on your own hosting: drupal.org WordPress.com – hosted for you, mostly free, but charge to use your own domain name: www.wordpress.com WordPress.org – self-hosted, free but you need to pay for hosting and perhaps someone to install it: www.wordpress.org WordPress themes – a cheap way to get a professional looking website, plenty of choice: ElegantThemes.com StudioPress.com www.WooThemes.com

4. Layout UK-Sands is a great example of a mobile responsive non-profit website (view it on your phone / tablet and note how it resizes): uk-sands.org Wireframes help you plan page layouts: http://www.usability.gov/how-to-and-tools/methods/wireframing.html

5. Visual design If your organisation's branding isn't good enough, engage a graphic designer to improve it. The more you know what you want the website to look like, the more likely a web designer is able to provide a good solution.

Make a mood board creativebloq.com/graphic-design/mood-boards-812470

Maybe use Pinterest.com as a tool for gathering sites and elements you like.

www.pinterest.com/ben/

6. Code and test It's better to get a web professional to check the code manually than to use automated testing tools, but you can at least check the html and css code validate, and see what it looks like on mobile devices.

RNIB and Abilitynet both do accessibility audits of websites:

rnib.org.uk/professionals/webaccessibility abilitynet.org.uk/accessibility-services/user-testing

Test your html code validates 100%: validator.w3.org CSS controls how your web pages display. Test CSS code: jigsaw.w3.org/css-validator Web pages are increasingly being viewed on mobile and tablet devices. If your organisation work with younger people it is especially important to test your site displays properly on mobile devices: mattkersley.com/responsive This is how www.lasa.org.uk displays on different screen sizes. Try it out on your own site.

7. Launch and promote Promotion should be continual, not just at launch. Use social networking tools (Facebook, Twitter etc) as well as email newsletters. Put your website's address everywhere, on email signatures, business cards, posters, tattoos etc. Get other quality, relevant websites to link to your site.

Google AdGrants is the non-profit version of Google AdWords, Google’s advertising tool. It’s worth spending time thinking about words or terms people are likely to use in searching for your charity, as getting it right can help propel your website to the top of searches. Try Googling your own charity and noting the rank it appears in the search results. google.co.uk/grants

8. Assess Keep refreshing the content, keep promoting the content, keep analysing success. These tools will help.

Use Google Analytics for free and detailed web stats: google.com/analytics

Use Google Webmaster Tools to ensure Google sees all your content: google.com/webmasters/tools

Resources

• Knowledgebase:

www.ictknowledgebase.org.uk/youronlinepresence

• Nonprofit website project handbook: http://bit.ly/W83q0K

• Optimise your online content toolkit: http://bit.ly/W83KfV

• Social Media Decision Guide: http://tinyurl.com/2esjkxv

Twitter @LasaICT Web www.lasa.org.uk Rightsnet www.rightsnet.org.uk ICT Knowledgebase www.ictknowledgebase.org.uk