Moving away from the ‘Online Brochure’

5 tips to ensure your website is a valuable business tool

• Achieve two-way engagement for a better user-experience

• Increase transactional functionality

• Animation & Dynamic Design

• Keeping it Accessible

• Content that’s regularly updated

Reinforcing the web as a key resident touchpoint!

The ‘Online Brochure’

• Too much ‘inward thinking’

• No Human Touch: customers want engagement

• Lack of business-orientated features or functionality

• Navigation is unintuitive — users come to do something/find something

out

• No calls to action

• Website content that rarely changes

• Lots of text!

Reinforcing perceptions that its easier to pick up the phone!

The ‘Online Brochure’

Reinforcing the web as a key resident touchpoint!

The online world is an attention economy…

Bringing Digital Inclusion full circle…

• “There’s been a lot of great work to help people get online, but what do we as providers want them to do when they get there?”

• “We didn’t want to just get swept along with the frenzy without a

comprehensive plan for customer access”

• “What does it practically mean? We want to encourage and people to get online and then to transact when they’re there. There are cost efficiencies on both sides.”

1. Achieve two-way engagement

on your website

• Involve users in the design

• Group content to improve your sitemap

• Interactive elements

• Facilitate feedback & collaboration

• Social Media integration

• Personal touch: make it relevant to the local community

Profiling your audience

• Who is using your website?

• E.g. Residents / Prospective Customers / Stakeholders / General public

• Who should be using your website?

• E.g. Residents ranging from: Younger Generation / Housing applicants / Board members / Staff / Stakeholders / Regulatory bodies / General public / Media / Non social-housing customers

• Who will be using the functionality and for what purpose?

• E.g. Residents accessing online services / Community events / Resident Involvement e.g. HomeCall / Jobseekers / Employment and Training / Shared Ownership Application

• Who are the stakeholders?

• E.g. Involved members / Contractors / Management / Partners / Board members/ MPs / Local Authorities / Developers

The key to engagement with tenants and stakeholders

Consultation!

• A Web Partner can help you engage and understand what your audience wants in the context of the web • Dedicated engagement sessions with internal and external stakeholder

groups • Project team and stakeholder group questionnaires constructed using IA

principles • Knowledge of other solutions in your sector, best practice, and latest

technological trends • Understanding of what works well and how audiences prioritize tools and

information

Achieving a user-centric web presence

Wireframe and User Journeys

Wireframe and User Journeys

Via a card sort exercise the Project Team can begin drafting a site map by listing the content required to satisfy the priorities of these key target audiences

Creation of Site-Map Simple Navigation

Shepherds Bush Housing Group Relevant to Local Community

Shepherds Bush Housing Group Illustration

2. ‘Empower your residents with

the ability to transact via the

web…’

2. Empower your residents with the ability

to transact via the web…

• Your website will deliver cost-savings

• Achieve take-up and loyalty

• Empower residents to take control of their personal information

• Consider back-end systems – will require a level of techncal integration

• Extend to other areas

Cost Savings

17

• The explosion of digital communications now offers the

ability to engage communities in debate and discussion

about the changes, challenges and choices they face.

• With the government lauding localism and "big society" —

whilst at the same time set on deep cuts — the role of the

web in providing a cost-effective and measurable channel

of engagement and self-service is being taken increasingly

seriously.

• Peabody has calculated an average per-transaction saving

of £9.44 over face-to-face and £2.64 over telephone.

• ‘Channel Shift’—SOCITM recently stated that one council

spent £5.6m on ‘front office’ customer contact, while a

second, similar, council spends half this, at £2.5m

Integration with payment platforms

Verification of what you have typed into the form

Integration with payment platforms

Make the payment – Once made will take you back to the

website

Paperless Direct-Debits

Paperless Direct-Debits

Paperless Direct-Debits

Datafish Secure Resident’s Portal

Reporting a Repair

So what do your tenants get?

• Empowerment and value for money

• Users have a choice about how, when, and where to access your services

• Reduced overheads by using the web to target and handle enquiries

• Targeted content and services by secure registration

• Involvement and support

• Areas for fully moderated user-generated content

• The exchange of information among peers

• Participation in “many to many” conversations

• Access and diversity

• Online relationships with multiple individuals and communities

• Choice of many methods of interaction

• Another channel to make their voices heard

Secure portals – top tips

• Don’t bury your self-service or portal!

• Be realistic: take a phased approach if necessary

• Think about usability

• Keep it on brand

• Tap into the spirit of the digital champions

• Look for flexibility

• Whilst they’re captive: resident involvement & events

3. Things can finally get a bit

animated!

North Hertfordshire Homes Dynamic design

Flagship Housing Group Animation

4. Keep it accessible…

• Assistive technologies

• Browser environments

• Operating systems

• Mobile platforms

• Connection tools

Testing is the only way to ensure success!

What is WCAG 2.0?

Published by the Web Accessibility Initiative

(WAI)

• sub-division of the World Wide Web

Consortium (W3C)

• Version 1 for 9 years

• Version 2 for 3 years

Single A 25 Success Criteria

Double AA 13 Success Criteria

Triple AAA 23 Success Criteria

31

Not give Bernard meaningful links!

Bernard – aged

28

Registered blind

and uses a screen

reader to read out

the text to him.

• Click here... or More...

• Available in our housing Leaflet

WCAG 2.0 FAILURE Single A 32

Indirect

Not use formatting correctly for Headings!

• Here is an example of using heading

format to emphasise a paragraph.

• Headings should be formatted according to

their hierarchy and text should be

formatted as body text

Garden Birds

We can still expect to see quite a variety in the average urban garden.

Robins These delightful little birds are the most easily recognisable to visit us.

This article is all about the different birds that can be found in the average urban garden.

Robins are the most easily recognisable of the birds to visit us.

WCAG 2.0 FAILURE Single A 33

Indirect

Not consider the older user!

• Ensure that text can be made larger

• Avoid the need to scroll horizontally to

view line endings.

Sylvester

aged 70

Needs a

magnifier to view

the screen.

34

Indirect

Not ensure forms are easy to use!

• Associate labels with text boxes

• Give adequate instructions before

user inputs information

• Warn blind users in advance

whether text box, check box

or radio button

First Name

Last Name

Address

e-Mail

Tel

Please enter

Post Code in

separate box

Post Code

Subscribe to

our newsletter Yes No

Tick all that apply

Mens

Ladies

Kids

Pets

|

35

Indirect

What should we be doing?

• A web accessibility audit is a quick way

to find out if there are any concerns. Best

carried out BEFORE user testing.

• .GOV web service providers must

achieve Double A or their status could be

removed.

• Very few websites meet Double A

compliance.

36

How important is Mobile Access?

• More mobile phones in the UK than people

• 52% of these are smartphones

0

10

20

30

40

50

60

70

80

People Mobiles

In M

illi

on

s

Smartpho…

The Mobile Web: Stats

• “Using my mobile is the

easiest way to research

products, services, or

information.”

—42% of British people

• According to ONS 71% of

16-24 year olds use

mobiles to access internet

vs only 8% over 65

• Men (56%) were more likely

to use the Internet on their

mobile phone than women

(46%)

Gender

Age

Older

Younger

Female

Male

Are mobiles important?

• 25% of people browse

ONLY with a mobile

device

Mobile & Accessibility

• People using mobiles face similar challenges to what

those with disabilities face using a computer

• Small or hard-to-read text, lack of context

• No pointing device or ability to “hover”

• Typing is slow, tedious, error-prone (see:

Autocowrecks, etc.)

• Lower bandwidth means not seeing images, videos,

etc.

• Screen resolution makes it hard to distinguish colours

• Shared accessibility principles—what’s good for

desktops will help on mobile

• Mobile Web Best Practice Guidelines

• http://www.w3.org/TR/mobile-bp

So what are the options?

3 types of mobile solution

• Mobile stylesheet (“Responsive design”)

• Applies a new stylesheet (CSS) to your website, depending on

your browser configurations

• Mobile optimisation

• Uses a different set of HTML templates if you’re viewing the

website on a mobile phone’s browser

• Mobile application

• Recreates your website as a piece of software, which users can

download from an app store onto their phone

Which is the best option…

Mobile stylesheet

• What does it look like?

• Example:

• www.nhh.org.uk

• Advantages:

• Quick to create

• Easy to implement

• Widely used

• Superior user experience

• Google’s preferred mobile

solution (single URL)

5. Current content that’s

regularly updated…

Take ownership and update!

Flexible CMS platform

• Creating a poll to engage users and obtain feedback

• Schedule publish and unpublish

• Set review dates and tasks – workflow

• Layout feature: non-technical changes to front-end

• Flexible design elements: change styling of placements

Questions?

Thank You