Presentation at WordCamp Seattle 2016 promotes the value of user-centered design, good content, following web design standards, and ADA accessibility.

1. Usability Schmoozability
5 tips to make your website work for customers
Kristin Kinnamon
WordCamp Seattle 2016

2. Definition of Usability
can figure out how to use the thing
to accomplish some desired goal
without it being more trouble than it’s worth
Something is usable if a person:
Steve Krug, “Don’t Make Me Think”

3. How Changing a Button
Increased a Site’s Annual
Revenues by $300 Million
- Jared Spool

4. Technology keeps changing
Business phone Business website

5. A good website is not about
technology.
Sorry
A good website
is about people

6. Schmooze Rule #1:
Put people first
1.Get to know your customers
2.Identify their needs & wants
3.Satisfy them
4.Keep paying attention

8. Google Analytics: Top sections

9. Incoming phone calls
Bridge staff tracked calls for one week:
 Equipment availability 17
 Equipment accepted 4
 Equipment donation pickup/process 5
 Directions to Mobility Center 2

10. Bridge user needs and wants
 I want to donate equipment. Where are you?
 I need medical equipment. What do you have?
 I want to find out about upcoming events.
What’s new?

11. Bridge business goals for site
Increase financial
donations through website
Attract more volunteers
Make it easier to donate
medical equipment
Increase visibility of Bridge
programs and partnerships

12. Most
popular
page of
the site

13. Results
 43% increase
in equipment
revenue
 66% increase
in donations
 10% decrease
in bounce rate

14. People first: Do user research
 Website data shows popular pages
 Search shows topics and terms
 Phone calls and customer service requests
 Listen, observe – interviews, research

15. Usability Schmoozability
1. Put people first
2.Content matters
3. Don’t force it
4. Be like the 99%
5. Make it accessible

16. Start with content, not layout

17. Plan for content
 Contact information, hours, directions.
Don’t forget this.
 What will be updated frequently?
How will people know?
 How will it display on different devices?
What is most important?
Remember, not everyone sees the home page

18. Re-purposing
designs is
possible …
But it takes extra
money and time
Anderson
School in
Bothell is now
a McMenamin’s
Gas station restaurant

19. Write your content as a
conversation with the customer
 Answer their questions - directly
 Talk to them directly – “you”
 Use everyday language – not legalese

20. Our Vision
Whether it's recyclables that
we can use again, yard waste
that we can turn into mulch,
or items we haul to the
landfill, we are always looking
for ways to keep the Bluegrass
beautiful. Our work is not just
about getting rid of things, it's
about Lexington's quality of
life, its health, and the look
of our community.
Waste Management page

21. User-focused content
Not flashy, but focused
on exactly what citizens
actually want to know
Examples from the National Assoc.
of Government Webmasters

22. Usable content = readable text
 LIMIT ALL CAPS, red text
 Centered text slows reading
 Size matters – small text makes me leave
 Use headings – they provide structure, support
scanning, improve SEO, add accessibility

23. What content matters here?

24. Usability Schmoozability
1. Put people first
2. Content matters
3.Don’t force it
4. Be like the 99%
5. Make it accessible

25. Don’t force users to:
 Register first (see $300 billion button)
 Open a new window
 Download a full document when a summary will do
Scrolling is OK (within limits)

26. Usability Schmoozability
1. Put people first
2. Content matters
3. Don’t force it
4.Be like the 99%
5. Make it accessible

28. Website design recommendations
 Logo top left – links to Home
 Main menu across the top
 Search, shopping cart top right
 Describe what you do – above the fold
 Link style, visited links
 Footer – contact info, social media

29. Usability Schmoozability
1. Put people first
2. Content matters
3. Don’t force it
4. Be like the 99%
5.Make it accessible

30. Basic accessibility
1. Images – with “alt text”
2. Use appropriate format
3. Color – contrast, not sole means of communicating
4. Keep It Simple – avoid clutter, fancy features

31. A picture is worth a 1,000 words
When you can see it

32. Alt Text
Text is read by assistive
technology and
displayed in browsers
when loading.
Good text describes
content, function.
Don’t duplicate “alt” and
“title” text

33. Right format
 Don’t use images
for text
 Be purposeful
with PDFs
 Use tables for
data, not design

34. Using color
Minimum
contrast?
Don’t use
color as the
sole means
of conveying
information.
WebAIM.org color checker

35. K.I.S.S. Hoquiam
http://cityofhoquiam.com/residents/forms
-bill-pay/
Cool WordPress features
and plug-ins could make
your users feel out of
control, and may not be
ADA accessible

36. Your website visitors
are like cats
https://www.youtube.com/watch?v=dln9xDsmCoY

37. Usability Schmoozability
1. Put people first
2. Content matters
3. Don’t force it
4. Be like the 99%
5. Make it accessible

38. Usability Resources
 Nielsen Norman Group – research-based articles
 The $300 Million Button – User Interface Engineering
 Writing for the Web – Usability.gov
 What Does Usability Mean – Whitney Quesenbery
 Don’t Make Me Think – Steve Krug

39. Accessibility Resources
 WordPress Accessibility Plugin
 “WordPress Accessibility for Devs” – Mark Root Wiley
 WP Devsigners presentation – Mark Root Wiley
 http://a11yproject.com/
 WP Theme developer handbook

40. Kinnamon Communications
Kristin Kinnamon
KinnaComm@gmail.com
425-923-7868
Website consulting, content & usability
for local government & nonprofits
Good Government, Good Websites

41. Schmooze:
Making ingratiating small talk – talk that is
business oriented, designed to both provide
and solicit personal information but avoids
overt pitching.
- Urban Dictionary
To chat in a friendly and persuasive manner
especially so as to gain favor, business, or
connections.
- - Merriam Webster