Online Experience Index

Transcription

Online Experience Index
Online Experience Index
U K P O L I T I CA L PA R T Y S I T E S – Ma r c h 2 0 1 5
Introduction
As the election date looms, the political parties of the United Kingdom and Northern Ireland
are locked in a fierce battle of wills to gather support and win the favour of the public.
In an increasingly digital world, websites and social media pages are becoming the major
touchpoints between the parties and the people, so it is critical to provide a user-friendly
and engaging online presence. As such, we decided to turn a critical eye to the web
experience of the major players in this years’ elections.
Looking at the Conservatives, Labour, Liberal Democrats and UKIP, we assessed and
analysed the websites for each party on their usability and overall user experience. At this
stage in the year, visitors to the site may be looking to connect with the party, or contribute
to the campaign; the tasks we tested the sites on included:
•
Signing up for news updates
•
Registering to volunteer with campaigns
•
Connecting on social media
•
Donating money to the party
•
Joining or becoming a party member
By utilising our leading Online Experience Index, we were able to score each site on multiple
facets of the user journey – including:
•
Homepage & Design
•
Navigation
•
Flow & Layout
•
Form & Errors
The Index allowed us to rate the site on various aspects, with points being awarded for
usability, and penalised where changes could be made to improve the experience. These
individual ratings were weighted to give more credit to more vital site requirements, thus
allowing us to quantify the overall usability of each facet of the site to compare between
the parties.
© SimpleUsability Ltd
1
Headline findings
Comparison of sites
Homepage
and Design
Social
Navigation
Conservatives
Email
Volunteer
Join and
Donate - Flow
and Layout
Labour
Lib Dems
UKIP
Join and
Donate - Form
and Errors
There was wide variation between overall scores, and no one
site was the clear winner; each party fell down in certain areas
relative to other sites.
The Liberal Democrats performed strongest in overall design
and site navigation, while the Conservatives site made it easiest
to complete details to join the party or donate. Labour provided
a relatively strong social media presence, while UKIP excelled
across other channels – such as email, and social media, while
also making it easy for users to understand and opt to volunteer
with the party.
Overall, we found that all party websites make it easy for users to
find where to donate, join and volunteer, with these sections
readily available from the main navigation menus.
However, none of the parties performed particularly well in
communicating the benefits of donating, joining or
volunteering.
Regarding the forms on the websites, all parties have room for
improvement, whilst some contain critical issues. These include
the inability to move through the Labour donation form by
tabbing though fields and the unhelpful error messaging on the
Lib Dems site.
The Conservatives provide the clearest way for users to sign up
for newsletters, whilst on the other sites, this option is hidden or
labelled ambiguously.
All parties have a social media presence, but vary in how well
this is communicated on the official party websites.
© SimpleUsability Ltd
2
The Index visualisations
Conservatives
Homepage and
Design
Social
Navigation
Join and Donate Flow and Layout
Email
Join and Donate Form and Errors
Volunteer
The Conservatives site performed most consistently of all the sites, providing an adequate
user experience across all the facets we explored. However, equally the site did not excel in
any particular areas, and improvements could be made throughout the website to deliver a
more engaging user journey.
Labour
Homepage and
Design
Social
Navigation
Join and Donate Flow and Layout
Email
Join and Donate Form and Errors
Volunteer
The Labour party’s website suffered as a result of the overall design and implementation,
and their attempts to cater for users on mobile devices backfired in some instances. The
entry forms were adequate, but inconsistencies across screen sizes caused some bugs and
issues when viewing the site on a computer screen.
For social media engagement, however, Labour was very strong, covering a number of
highly active social channels, and linking these effectively with the site content.
© SimpleUsability Ltd
3
Lib Dems
Homepage and
Design
Social
Navigation
Join and Donate Flow and Layout
Email
Join and Donate Form and Errors
Volunteer
The Liberal Democrats site facilitated a good user journey compared to the other parties. A
strong navigation helped the user quickly find and access various pages, and the simple
visual design made it easy to understand.
The site suffered however with a lack of information and communication about aspects
such as joining and volunteering, and was let down by a poor social media presence.
UKIP
Homepage and
Design
Social
Navigation
Join and Donate Flow and Layout
Email
Join and Donate Form and Errors
Volunteer
In addition to failing to cater for non-desktop users, the UKIP site was the lowest scoring
website overall. The usability of the forms when donating to or joining the party was found
to be difficult to complete and understand.
However, UKIP excelled at allowing users to volunteer with the party, as well as making it
easy for users to subscribe to the newsletter and connect via social channels.
© SimpleUsability Ltd
4
Party comparison - Homepage & design
In terms of the homepage and overall design, the Liberal Democrats site performed the
best, scoring 83%. UKIP scored the lowest overall with 39%.
Homepage & design
83%
61%
46%
39%
Liberal Democrats
Conservative
Labour
UKIP
While the Liberal Democrats, Conservatives and Labour instantly convey their political
identity on the homepage, UKIP’s branding is less upfront, and lacks the tagline summary
of political stance that is shown on the other party sites.
Regarding the use across multiple devices, UKIP is the only party not to use a responsive
website design. While Liberal Democrats, Labour and Conservative websites shrink and
resize to fit any screen size, UKIP serve one site for all desktop computers and separate site
for mobile users. At mobile sizes, the Conservatives site provides instant and accessible
content from the homepage, while the Liberal Democrats and Labour are image-heavy,
bumping relevant content further down the page out of view initially.
© SimpleUsability Ltd
5
The Conservatives website adapts based on the size of the screen, but jumps between
mobile, tablet and desktop optimised layouts. As a result, the site may be harder to use for
visitors with devices that have dimensions in between those standard screen resolutions.
Site at 750px width
Site at 749px width
The Liberal Democrats and Labour sites are more fluid, and change more readily to
changes in the size of the viewing screen. However on the Labour site, some functionality
is made unavailable on particular screen sizes, meaning that users may miss certain
opportunities. For example, on the Labour donations journey, there is a threshold screen
size above which the option to pay via PayPal is removed and the user can only opt to pay
by credit or debit card directly.
Site at 767px width
© SimpleUsability Ltd
Site at 768px width
6
In the visual design, the Labour site uses a basic colour scheme of red and greyscale, which
reinforces the party colours; however, the use of grey text on a grey background sacrifices
readability due to low colour contrast. The Conservatives site provides better contrast, but
the use of capital letters makes it harder to scan and read headings or copy.
The UKIP site uses many different fonts, weights and colours, making it visually
disconnected. While the Liberal Democrats site has a very basic dark and white colour
scheme, the sparing use of yellow on-brand colour and well-formatted layout make it
easier to read and gives the site visual consistancy.
© SimpleUsability Ltd
7
Party comparison - Navigation
Overall, the Liberal Democrats site performs best in site navigation, with a score of 69%.
Navigation
69%
66%
38%
31%
Liberal Democrats
Conservative
UKIP
Labour
The navigation bar on the Liberal Democrats site features key areas broken down into
further drop-down boxes. This instantly increases the number of pages available to the
user initially.
Unlike the Liberal Democrats, the navigation on the Conservatives site has a limited
number of options available in the navigation bar and does not provide adequate visual
differentiation between the sections.
In terms of labelling, the options in the navigation bar on the Conservatives site – such as
‘Securing a better future’ - does not provide useful information to help the user understand
what the page would return.
By contrast, the Labour site provides strong, direct language for the navigation options,
along with visual cues and icons.
© SimpleUsability Ltd
8
When opting to donate or join, the Liberal Democrats and UKIP site both redirect users
onto a separate server to process the application. It is not always clear that this has
happened, and the site navigation options are removed at this stage, causing difficulty in
returning to the site if it is not clear a new page has been opened.
The Labour site manages applications internally, but takes users to a separate server for
donations and membership. While there is a link to return to the main site, the user is kept
on the application server, which was found to cause some effects on loading times and
other site functions.
The Conservatives site performed strongest in this aspect, as the user is able to remain on
the main site throughout the journey, and can access the main navigation options at any
time.
© SimpleUsability Ltd
9
In terms of understanding location within the site, while most pages were descriptively
titled, Labour and UKIP sites both took users to ambiguously named pages – including ‘The
best way to kick David Cameron out of No. 10’ (volunteer page), and ‘Help elect UKIP MPs’
(donations page).
While the Conservatives site was more consistently descriptive e.g. – ‘Volunteer with
Team2015’, the Liberal Democrats site also highlighted the users’ location within the main
navigation, thereby helping the user to further understand their position on the site.
© SimpleUsability Ltd
10
Party comparison - Flow and Layout
Overall, the Conservative had the highest score for Flow and Layout through the Donate
and Join journeys.
Flow and Layout
64%
52%
30%
16%
Conservatives
Labour
Liberal Democrats
UKIP
All sites break down the donation and joining forms into smaller, more manageable stages.
However, there is an issue with tabbing through fields in the donation form on the Labour
party site. The user can only select a pre-defined donation amount by clicking, and
attempting to continue to the next page by tabbing to ‘Next’ and hitting enter reveals the
whole form on one page, with all fields shown as erroneous.
The forms on Conservatives.com include various time-saving features. If users first fill in the
joining form, their details are already populated when going to the donation form. There is
also an address finder which autocompletes as users type in the first line of their address.
© SimpleUsability Ltd
11
All sites lost points for opting users in to receive communications. However, the Lib Dems
and UKIP at least allow the user to opt out during the form. The Conservatives inform users
that by entering their email address, they are opting in, but that they can opt out by
following a link in any of the emails they receive. The Labour party, however, do not specify
anywhere on the forms that users will receive any communications, but say that donating
means the user agrees with the Privacy Policy. Clicking ‘Privacy Policy’ states that to not be
contacted, users must write to the party.
Users are taken to Sage Pay to complete their payment to join UKIP. From this page, users
cannot go back to the previous page to view or amend the details they entered on the
UKIP site. The call to action ‘Proceed’ on the card details page does not make it clear what
action this will have – whether the payment will go through or whether the user will have
an opportunity to review all their details before making the payment.
© SimpleUsability Ltd
12
Party comparison - Form Best Practice
Overall, the Conservatives website performed best in terms of form and errors.
Form and errors
64%
53%
51%
23%
Conservatives
Liberal Democrats
Labour
UKIP
The forms on the Conservatives site make it very clear what to input into each field. For
example, on the Payment screen, the name field is ‘Name as it appears on the card’, to
ensure users enter it in the right format to match the payment card. There is also a helpful
popup explaining what ‘CSC’ is, including an image to help users find it on their card.
Most sites have clean form pages without distraction from any non-form elements. The
UKIP forms are particularly good, as whilst other sites push the form to the left of the page
and include an image on the right, here the form occupies the centre of the page.
All sites performed well at ensuring the forms look secure. To donate to the Labour party,
users are directed to a secure site and a padlock image is present on the form at all stages,
not solely on the payment information page.
© SimpleUsability Ltd
13
None on the sites scored particularly well for their standard of error messaging. The most
issues were found on the Lib Dems site in the joining form. One issue was that for all
mandatory fields left blank, the messaging was ‘This value is required’ which is not userfriendly or goal-orientated because it does not help users understand and correct their
error. Also, on the card details page, the error messages are a long way away from the field
they refer to. Again, the language used in the messaging is not user-friendly, e.g. ‘The Card
Range not supported by the system.’ The erroneous field is also cleared, so the user cannot
see what they entered to spot their mistake.
© SimpleUsability Ltd
14
Key findings - Conservatives
Donate and Join
Conservatives.com is the only site allowing users to complete the donate and join
processes without being directed to an alternative site. This means that the main
navigation menu is available throughout. The inclusion of an auto-populate feature for the
address fields speeds up the process of joining the party. The pre-selection of ‘£20’ on the
initial ‘Donate’ page helps users with that amount in mind to move through the process
quicker, whilst subtly inferring a suggested contribution.
Volunteer
Whilst being easy to find, the volunteer page does not adequately explain what
volunteering for the Conservatives will involve. The only example of activities is within one
of the testimonials below the form.
© SimpleUsability Ltd
15
Email sign-up
The Conservatives provide the clearest email sign-up option, as the user is informed they
will receive ‘Regular email updates’ and only need to enter an email address to sign-up.
However, the only feedback is the messaging ‘THANK YOU FOR SIGNING UP FOR OUR
EMAIL UPDATES’ which reverts back to the sign-up form after the user navigates to another
page. Users also have the opportunity to sign up for updates when attempting to leave the
site, as they are prompted with a ‘Thank you’ message.
Social
The findability of social networking sites scores low, as it is not explained what the function
of the icons in the header is. These direct the user to the Conservatives’ pages on
Facebook, Twitter and YouTube, whilst elsewhere on the site, the same icons are used to
share content directly to Facebook and Twitter. Also, despite having a Google+ presence,
there is no link to this on Conservatives.com.
© SimpleUsability Ltd
16
Key findings - Labour
Donate
Clearly available from the main navigation, ‘Donate’ takes users to a dedicated sub-site.
The donation page is optimised to be used at different screen resolutions, allowing users
across devices to contribute money. Users are only required to input minimum
information, and on mobile they are able to bypass entering billing details and use PayPal
as an alternative to direct card payment. However, the option for PayPal is not available at
larger screen resolutions. Users can opt to use previously entered card details if they have
an existing account, however.
Join
While it is easy to access the page allowing the user to ‘Join’, users are taken onto a page
hosted on a sub-site, which prompts them to begin entering information. No explanation is
given to help the user understand the benefits of becoming a member, nor to differentiate
the types of membership shown initially.
Volunteer
The call to action and journey into the ‘Volunteer’ page is clear, with this being a prominent
option within the main navigation bar, and visible on larger screens instantly.
© SimpleUsability Ltd
17
On the ‘Volunteer’ page, users are faced with entry fields but with no explanation or
information provided about the nature of the voluntary work. Only after completing details
are users prompted to indicate their preferences for activities.
Despite use of the undefined (*) asterisk symbol, often to denote a mandatory field, it is
ambiguous whether all fields are necessary, as the site permits the user to proceed only
having entered a valid UK postcode.
After inputting details, users are prompted to indicate volunteer preferences, as well as
encouraged to share their interest over social media, and to donate money to the party.
Email sign-up
Finding how to keep informed of the latest news and updates is downplayed on the
Labour site, with the newsletter subscription fields concealed within the footer.
At initial glance, it is difficult to recognise as an email sign-up field, with the ambiguous call
to action ‘Stay up to date’ being a poor indicator of the purpose of the re-entry fields. Error
messaging is direct and informative, but the name and postcode fields are mandatory, with
no explanation or justification to this requirement.
Upon completing the fields, no confirmation email is sent to the user, and the user is
unexpectedly redirected through to a page containing a survey about the party services.
Social
Social media options are widely accessible and prominent on the Labour site, available
from individual widgets and pages as well as from the global footer and site navigation.
© SimpleUsability Ltd
18
The range of social media channels is excellent, spanning Facebook, Twitter, YouTube,
Instagram and Google+. However the site does not supply any additional labelling or
explanation of these, and relies on the users’ own knowledge to correctly interpret the
meaning of the icons.
© SimpleUsability Ltd
19
Key findings - Liberal democrats
Donate
The donation journey is easily found in the navigation menu and the form pages are nicely
presented. Users are told they can alternatively donate over the phone, which will reassure
users who prefer not to transact online. There is also a ‘Who’s donating’ feature, showing
users other people who have donated.
Join
The membership form does not make it clear which fields are mandatory – this seems to be
indicated by a vertical red line next to the fields. The error messaging is also unhelpful with
the wording ‘The value is required’.
On the payment details page, clicking the ‘Cancel’ button, which is much closer to the form
than the ‘Proceed’ call to action, takes the user to a page to enter more personal details,
but shows an error message explaining that the membership application has failed.
However, continuing from this page takes the user to a ‘Welcome to the family’ page,
making it unclear whether the application was successful or not.
Volunteer
The volunteer page is easy to find within the ‘Get involved’ section of the navigation menu,
but there are no examples of what volunteering will involve. There is a good example of
social proof, as users can see others who have signed up to volunteer in the ‘Reactions’
section below the form.
© SimpleUsability Ltd
20
Email
It is not clear how to sign up for an email newsletter on the Liberal Democrats site. There
are various different versions of an email sign-up form around the site, most positioned as
a question related to the page, such as ‘Will you help us create more jobs?’ with the call to
action ‘I will’. There is also a variation of the form on some pages, with no title and the call
to action ‘Sign up’. The only instance of the function of the form being explained is on the
‘About Nick’ page, where the title of the form is ‘Will you sign up for news from Nick?’
Social
The main social networking buttons can be found only in the page footer, accompanied by
a link to the search feature. The Lib Dems scored lower than the other parties for their
social presence. One reason for this is that they are the only party out of the found to not
have a ‘Sign up’ button on their official Facebook page.
© SimpleUsability Ltd
21
Key findings - UKIP
Donate
Prominently accessible from the header across the site, upon clicking to ‘Donate’, users are
taken to a sub-site with a reminder of UKIP’s main policies and promises. The subsequent
details form for donation doesn’t require too many details from the user, but has very poor
contrast visibility for in-field labelling.
Join
Upon clicking the option to ‘Become a member’, users are taken to a separate sub-site to
complete details. There is no explanation or information about what benefits or
responsibilities might be associated with membership. After filling in details, users are
taken to transact payment on the Sage Pay site.
Volunteer
Accessible easily from the main navigation, users can opt to ‘Get involved’ and ‘Volunteer’
with the party. Upon arriving at the page, options are provided to denote their availability
and preference regarding the type of volunteering.
© SimpleUsability Ltd
22
If the user has previously inputted their email details into the site, they are then presented
with a personalised page, which cross-references and take details such as their name from
an associated Twitter account.
Email sign-up
Upon arriving on the UKIP site, users are instantly prompted to sign up to the newsletter,
which is labelled clearly and presented in a simple format. However, if users do not wish to
supply an email at this stage it is less clear how to proceed without completing this
information.
On the site itself, users are presented with ample opportunities to sign up to receive
updates, with this available immediately from the top of the homepage and the footer.
Upon entering an email – postcode is optional despite the contradictory asterisk – the user
is promptly thanked with a confirmation email and sent to a follow-up page with links to
share their interest, volunteer or donate to the party.
Social
Social media options are available immediately from the homepage on UKIP, with live
feeds showing the latest posts and media. These are also accessible from side navigation
on most pages.
While only offering Facebook and Twitter, the UKIP pages provide a good social media
presence, with invitations to like/join and donate to the party straight from the Facebook
page.
© SimpleUsability Ltd
23
© SimpleUsability Ltd
24
Key findings - Greens
Excluded in this analysis were the Green Party of England and Wales, but there are many
features of greenparty.org.uk which outperform those of the other four parties. Some of
the most useful of these are highlighted below:
Volunteer form allows users to specify how they would like to help and what their skills are.
Donation amounts are put into context so users have an idea of where their donations are
going.
Users are told about the benefits of becoming a member.
The newsletter sign-up makes it clear what users are signing up for and the confirmation
screen tells users how often they will receive updates.
© SimpleUsability Ltd
25
From the Green Party Facebook page, users can sign up for email updates, make a
donation and go straight to the membership sign-up site.
© SimpleUsability Ltd
26
In Summary
Over the past few months, we’ve applied the Online
Experience Index to a number of ecommerce sites
drawn from a variety of sectors.
With just 55 days until the General Election, at time of
publication, we turned our attention to the websites
of the major political parties to understand the user
journeys.
Using best practice expert knowledge and the Index
we compared and assessed the user journey across
the sites of the Conservatives, Labour, Liberal
Democrats and UKIP.
The sites were scored on various facets when
performing the core user tasks of: donating to a
party, becoming a member, signing up to volunteer,
opting into news bulletins, and connecting via social
media channels.
We’re conscious that these tasks will be undertaken
by a politically engaged audience. With so many
undecided voters, we’re planning a follow-up piece
which looks at how effectively the parties
communicate their policies once the manifestos
have been published.
As a side note, we were massively encouraged that
the initial consideration that was applied to the
methodology and the structure of the Online
Experience Index has seriously paid off. The Index is
incredibly robust, even when applied to the nonecommerce world and we hope to address a
significant range of sectors in the future.
For further information around how we’ve
constructed the Index, and specifically these new
factors, please don’t hesitate to contact us –
[email protected] or on 0113 350 8155.
© SimpleUsability Ltd
27