GDS Joshua Marshall Joshua Marshall Developer & Accessibility Lead Government Digital Service @partiallyblind

Better living through empathy ...or “How to reach as many of your users as you can without ruining your products, losing your users and making your team hate your guts.”

GDS Joshua Marshall Hello ustwo™ Civil Servant, Developer, Platform Team, full-time Accessibility guy. Advocate across GDS, wider govt, British Gov representitive w/ other govs. Freelance developer. Started on Alpha in April 2011 “for six weeks”. Still here. Worked on everything from Publishing tools, UI, every tool and service, guidelines.

GDS Joshua Marshall Welcome to GOV.UK The best place to find government services and information Simpler, clearer, faster This website replaces Driving and transport Includes car tax, MOT and driving licences Benefits Includes tax credits, eligibility and appeals Businesses and self-employed Tools and guidance for businesses Employing people Includes pay, contracts and hiring Passports, travel and living abroad Includes renewing passports and travel advice by country Education and learning Includes student loans and admissions Working, jobs and pensions Includes holidays and finding a job Housing and local services Owning or renting and council services Crime, justice and the law Legal processes, courts and the police Money and tax Includes debt and Self Assessment Births, deaths, marriages and care Parenting, civil partnerships, divorce and Lasting Power of Attorney Disabled people Includes carers, your rights, benefits and the Equality Act Inside Government Government departments, policies and announcements Citizenship and living in the UK Voting, how government works, moving to the UK Ministerial departments all in one place Search Most active on GOV.UK Universal Jobmatch job search Workplace pensions Inside Government This is part of what I do for a living. Hired as a developer, these days I’m a combination of dev, tester, evangelist and therapist. Occasionally used as a big stick to make people think about a11y more, but mostly they get it.

GDS Joshua Marshall In the first six months 188m visits 547m page views 9.5m site searches Some background on GOV.UK... Approx 1m visits per day / highest was approx 6m ...that’s a lot of people to annoy if it’s not working

GDS Joshua Marshall How many of them need help? Using analytics tells you about how many users you have, what they’re using. No idea how many are using assistive technology. Only people having direct problems (or their advocates) tend to complain, the rest is up to you + PR to detect issues.

How do you make it work for everyone? where by “everyone” we mean “as many people as possible” or, how do we not deliberately exclude anyone by doing dumb stuff

GDS Joshua Marshall You can’t, but you can come pretty close Aim to please the majority without excluding anyone and you’ll reach everyone more. Sane HTML, progressively enhance but don’t annoy. Users come first.

GDS Joshua Marshall useit.com: usable information technology Search useit.com: Jakob Nielsen's Website Permanent Content Alertbox Jakob's column on Web usability Beyond the Buy Button in E-Commerce (July 6) The best way for ecommerce sites to increase subsequent orders is to treat customers well after they place their initial order. Government Intranets (June 21) Remote Controls (June 7) Thirty Years With Computers (May 24) All Alertbox columns from 1995 to 2004 Sign up for short newsletter by email when a new Alertbox is published Reports Intranet usability > Government intranets > Intranet design annual > Intranet portals Return on investment from usability (ROI) Email newsletters Confirmation email E-commerce: 207 design guidelines Corporate sites: "About Us", PR, IR areas More reports and usability guidelines News Get a free usability test of your intranet if you will allow us to publish the findings and screenshots. User Experience 2004 Conference > Las Vegas and Amsterdam Our biggest conference ever with 33 full-day tutorials: > 16 brand-new seminars, including advanced content usability and Web-based applications > 17 best-selling classics like information architecture and e-commerce usability Sydney Morning Herald RSS Feeding frenzy eWeek Mac OS X's Spotlight Puts Search Center Stage ZDNet UK Two UK intranets make global top 10 Line56 The Best Government Intranets Sydney Morning Herald The key to email: a two-second grab CIO Insight Time for a Redesign BusinessWeek Big Bang! Digital convergence is finally happening Sydney Morning Herald Seek but you won't always find 2003 2004 2005 27 Dec 96 - 12 Jun 13 Help Accessibility doesn’t have to mean producing something like this. It’s not 2004. We build Minimum Viable Products. Should aim for Mininum Designed Products too - what can we remove to make it better?

Home Education and learning School admissions and transport to school Guide Types of school Apply for a primary school place Apply for a secondary school place Children with special educational needs (SEN) Home education School term and holiday dates The national curriculum More from the Education and learning category Other relevant links Search You are at the beginning of this guide Part 2 Faith schools All children in England between the ages of 5 and 16 are entitled to a free place at a state school. Most state schools have to follow the national curriculum. The most common ones are: community schools: controlled by the local council and not influenced by business or religious groups foundation schools: more freedom to change the way they do things than community schools academies: run by a governing body, independent from the local council - they can follow a different curriculum grammar schools: run by the council, a foundation body or a trust - they select all or most of their pupils based on academic ability and there is often an exam to get in Special schools Special schools with pupils aged 11 and older can specialise in 1 of the 4 areas of special educational needs (SEN): communication and interaction cognition and learning behaviour, emotional and social development sensory and physical needs Part 1 Overview Printer friendly page Part 1 Overview Part 2 Faith schools Part 3 Free schools Part 4 Academies Part 5 City technology colleges Part 6 Private schools Old guide format vs new. Better heirarchy and better typography leads to WAY clearer navigation. Some type crimes allowed - hanging bullets tested poorly so we changed them back. Can’t be precious. No room for ego.

Home Education and learning School admissions and transport to school Guide Types of school 1. Overview 2. Faith schools 3. Free schools 4. Academies 5. City technology colleges 6. Private schools Apply for a primary school place Apply for a secondary school place Children with special educational needs (SEN) Home education School term and holiday dates The national curriculum More Education and learning Search All children in England between the ages of 5 and 16 are entitled to a free place at a state school. Most state schools have to follow the national curriculum. The most common ones are: community schools: controlled by the local council and not influenced by business or religious groups foundation schools: more freedom to change the way they do things than community schools academies: run by a governing body, independent from the local council - they can follow a different curriculum grammar schools: run by the council, a foundation body or a trust - they select all or most of their pupils based on academic ability and there is often an exam to get in Special schools Special schools with pupils aged 11 and older can specialise in 1 of the 4 areas of special educational needs (SEN): communication and interaction cognition and learning behaviour, emotional and social development sensory and physical needs 1. Overview Old guide format vs new. Better heirarchy and better typography leads to WAY clearer navigation. Some type crimes allowed - hanging bullets tested poorly so we changed them back. Can’t be precious. No room for ego.

Home Education and learning School admissions and transport to school Driving and transport Benefits Businesses and self-employed Employing people Passports, travel and living abroad Education and learning Working, jobs and pensions Housing and local services Crime, justice and the law Money and tax Births, deaths, marriages and care Disabled people Citizenship and life in the UK Explore GOV.UK How government works Worldwide Policies Announcements Inside Government Departments Topics Publications Support Cookies Feedback Cymraeg Built by the Government Digital Service All content is available under the Open Government Licence, except where otherwise stated © Crown Copyright Is there anything wrong with this page? Last updated: 30 May 2013 Guide Types of school 1. Overview 2. Faith schools 3. Free schools 4. Academies 5. City technology colleges 6. Private schools Apply for a primary school place Apply for a secondary school place Children with special educational needs (SEN) Home education School term and holiday dates The national curriculum More Education and learning Search Next Faith schools All children in England between the ages of 5 and 16 are entitled to a free place at a state school. Most state schools have to follow the national curriculum. The most common ones are: community schools: controlled by the local council and not influenced by business or religious groups foundation schools: more freedom to change the way they do things than community schools academies: run by a governing body, independent from the local council - they can follow a different curriculum grammar schools: run by the council, a foundation body or a trust - they select all or most of their pupils based on academic ability and there is often an exam to get in Special schools Special schools with pupils aged 11 and older can specialise in 1 of the 4 areas of special educational needs (SEN): communication and interaction cognition and learning behaviour, emotional and social development sensory and physical needs Print entire guide 1. Overview Home Education and learning School admissions and transport to school Driving and transport Benefits Businesses and self-employed Employing people Passports, travel and living abroad Education and learning Working, jobs and pensions Housing and local services Crime, justice and the law Money and tax Births, deaths, marriages and care Disabled people Citizenship and life in the UK Explore GOV.UK How government works Worldwide Policies Announcements Inside Government Departments Topics Publications Support Cookies Feedback Cymraeg Built by the Government Digital Service All content is available under the Open Government Licence, except where otherwise stated © Crown Copyright Is there anything wrong with this page? Guide Types of school Last updated: 30 May 2013 Apply for a primary school place Apply for a secondary school place Children with special educational needs (SEN) Home education School term and holiday dates The national curriculum More from the Education and learning category Other relevant links Search You are at the beginning of this guide Part 2 Faith schools All children in England between the ages of 5 and 16 are entitled to a free place at a state school. Most state schools have to follow the national curriculum. The most common ones are: community schools: controlled by the local council and not influenced by business or religious groups foundation schools: more freedom to change the way they do things than community schools academies: run by a governing body, independent from the local council - they can follow a different curriculum grammar schools: run by the council, a foundation body or a trust - they select all or most of their pupils based on academic ability and there is often an exam to get in Special schools Special schools with pupils aged 11 and older can specialise in 1 of the 4 areas of special educational needs (SEN): communication and interaction cognition and learning behaviour, emotional and social development sensory and physical needs Part 1 Overview Printer friendly page Part 1 Overview Part 2 Faith schools Part 3 Free schools Part 4 Academies Part 5 City technology colleges Part 6 Private schools Old guide format vs new. Side by side, we think the heirarchy is clearer now, navigation is more obvious. New format tested lots better with users. Be open to constant iteration based on feedback.

GDS Joshua Marshall Government Digital Service Listed below are our design principles and examples of how we’ve used them so far. These build on, and add to, our original 7 digital principles. Start with needs* Do less Design with data Do the hard work to make it simple Iterate. Then iterate again. Build for inclusion Understand context Build digital services, not websites Be consistent, not uniform Make things open: it makes things better Last updated 2 July 2012 ALPHA Design Principles 1 2 3 4 5 6 7 8 9 10 Start with needs* *user needs not government needs The design process must start with identifying and thinking about real user needs. We should design around those — not around the way the ‘official process’ is at the moment. We must understand those needs thoroughly — interrogating data, not just making assumptions — and we should remember that what users ask for is not always what they need. 1 Search To help us stay on track we have a set of design principles. Starting with shared principles is good. Focus everyone on the same goals. Principles #4 and #6 are especially helpful.

GDS Joshua Marshall Digital by Default Service Standard Start using the manual Feedback Government Service Design Manual From April 2014, digital services from the government must meet the new Digital by Default Service Standard. Read the standard » Think differently about digital delivery Discover what it means to be part of an agile, user- focused and multidisciplinary team, delivering digital services in government. Start building digital by default services Making a service Learn about the different phases of service design and get guidance for the phase you're in now. Discovery A short phase, in which you start researching the needs of your service’s users, find out what you should be measuring, and explore technological or policy-related constraints. Learn about the discovery phase Service managers Designers Guides and resources for… Government Service Design Manual Build services so good that people prefer to use them Search Same goes for the Service Manual. A collection of guidance for external teams who want to build services like we built GOV.UK. Everyone from managers, designers, writers, developers, devops, up to CTO’s. Never finished, just like GOV.UK.

So back to this “empathy” thing Put yourself in other people’s shoes. How would you use it if...? Eg: you’re a recent parent, screaming baby under your arm, haven’t slept well in months, trying to pay tax on a phone. How can we help ease the burden of that with web design? My accident: broken wrist == reduced motor skills. For SIX MONTHS. How do we make that easier?

GDS Joshua Marshall Why even bother? It’s the law, sure, but it’s the right thing to do. “Disabled users” are still human beings with needs. Not about disability, it’s about fairness. Our population is ageing: we have more pensioners in the UK than teenagers. Excluding them is unlawful as well as bad business.

GDS Joshua Marshall POUR - Perceivable, Operable, Understandable, Robust As Gov we’re supposed to hit WCAG 2.0 AA at minimum or we can have our domain revoked. Hasn’t happened much in the past but we’re working on it. Already closed 1700+ domains. We should do better, tax payers are why we’re here so it’d better work for them.

GDS Joshua Marshall The good news? You guys get it. Including it in PPP v2 was huge, so congratulations. Educating devs and designers why they should care is brilliant. Documentation for this stuff is generally crap. We need to do better.

GDS Joshua Marshall So how do we do it? Start small. No silos for anything, HTML-appropriate for the task. Responsive. MVP, iterate, then test it. Back it up with data. Agile == weekly sprints, test alpha, beta, major functionality changes, test with real users before launch.

Not just about web accessibility Multiple strands: GOV.UK Platform (core content publishing for citizens and government depts) + Digital Strategy (how the departments engage with our users) + Assisted Digital (encouraging use of digital over other channels) + Digital by Default Service Standard (providing guidance on service building best practices) + Exemplar projects (helping depts to build best of breed transactions). Not an afterthought. Runs through everything from start to finish.

GDS Joshua Marshall Be clear Writing is THE most important thing. Microcopy, tone of voice, simple direct language, all contribute to better understanding. Great typography will solve a lot of these for you. We won D&AD Yellow and Black Pencils for our writing. Get that right and you’re golden.

µµµµ iA Web Design is 95% Typography by oliver reichenstein 95% of the information on the web is written language. It is only logical to say that a web designer should get good training in the main discipline of shaping written information, in other words: Typography. Back in 1969, Emil Ruder, a famous Swiss typographer, wrote on behalf of his contemporary print materials what we could easily say about our contemporary websites: Today we are inundated with such an immense flood of printed matter that the value of the individual work has depreciated, for our harassed contemporaries simply older ◊ newer þ 19. october 2006 Writing is THE most important thing. Microcopy, tone of voice, simple direct language, all contribute to better understanding. Great typography will solve a lot of these for you. We won D&AD Yellow and Black Pencils for our writing. Get that right and you’re golden.

GDS Joshua Marshall Be consistent navigation, link behaviour, heading structure, form layout, buttons... Typography helps. Not too many weights, one typeface - New Transport. Consistent is good. Behaviour learned once and reapplied is better for users.

GDS Joshua Marshall Be stubborn Don’t be afraid to say no if it makes the product better. If it doesn’t improve the product - measurably - it gets killed. Play to each platform’s strengths. For us that’s the web. More open, less work for us, less cost for taxpayers.

GDS Joshua Marshall Be ready to test Screen magnifiers + screen readers, colour contrast, colour blindness simulators Major ones first: JAWS / VoiceOver / NVDA / Dragon Naturally Speaking Minor: ChromeVox / Supernova / WindowEyes Sim Daltonism. NoCoffee Chrome extension. Contrast check. AChecker to read the Accessibility tree.

Have a checklist, but don’t be a slave to the spec Mine for products is: Compile initial audit, Check with JAWS/NVDA/VO/ZoomText, check contrast and colour, give feedback, retest and repeat as required. Break it into managable chunks with a definite owner, but empower devs to own the accessibility of their own products. Checklist accessibility isn’t the be all and end all, use it as a guide.

GDS Joshua Marshall Common problems

GDS Joshua Marshall •Heading structure Skipping between headings is a massive no-no HTML5 headings gotcha with JAWS Less of a problem on mobile but you still need to consider correct elements

GDS Joshua Marshall • Heading structure •Reading order Structure your pages so that you don’t expect users to wade through tons of stuff before getting to the content. Skip links are great - use them.

GDS Joshua Marshall • Heading structure • Reading order •Readability & legibility Sort out your type. Appropriate typeface, good text size, true text not images or good image replacement Contrast, visually different link styles

GDS Joshua Marshall • Heading structure • Reading order • Readability & legibility •Clean code It should validate. Helps. validator.nu does HTML5 + ARIA - use it. Sane HTML makes your life easier and it’ll cause less of a headache for the assistive tech.

GDS Joshua Marshall • Heading structure • Reading order • Readability & legibility • Clean code •Using correct semantics Using appropriate elements helps. nav, header, ARIA roles to help with structure and meaning for interactive stuff.

Things we’ve screwed up We get stuff wrong. A lot. Incorrect assumptions are fine, just be willing to change based on feedback Good thing is its the web, not set in stone. Pull request, move on.

port MOT and driving Benefits Includes tax credits, eligibility and appeals elf-employed ce for businesses Employing people Includes pay, contracts and hiring and living abroad g passports and travel Education and learning Includes student loans and admissions d pensions Housing and local services Search Doing too much... initial code read: “search role search, search label search GOV.UK, text input type search, search, input type button search, search role end” Annoying as hell. Don’t go overboard.

GDS Joshua Marshall BSL content (or lack thereof) BSL most often deaf users first language, not English. A few examples of us using BSL but nowhere near enough. We definitely need to do more for our BSL speaking users.

GDS Joshua Marshall Not paying enough attention to colour Colour blindness is difficult to design around. Getting colour palettes that work for everyone is a nightmare.

How government works Get involved Departments Worldwide Topics Announcements Consultations Policies Publications Statistics Inside Government Ministerial departments 24 All live on GOV.UK Works with 4 agencies and public bodies view all ▼ Works with 20 agencies and public bodies view all ▼ Works with 46 agencies and public bodies view all ▼ Works with 12 agencies and public bodies view all ▼ Works with 44 agencies and public bodies view all ▼ Departments, agencies & public bodies What’s the latest from ? Example: Home Office Prime Minister's Office, 10 Downing Street Deputy Prime Minister's Office Attorney General's Office Cabinet Office Department for Business, Innovation & Skills Department for Communities and Local Government Department for Culture, Media & Sport Search As an example, we have: 24 ministerial departments 20 non-ministerial departments 332 agencies and public bodies 12 public corporations Designing consistent, works-for-everyone colour palettes for all those..?

As an example, we have: 24 ministerial departments 20 non-ministerial departments 332 agencies and public bodies 12 public corporations Designing consistent, works-for-everyone colour palettes for all those..?

GDS Joshua Marshall #lolgov 388 different brands and colour schemes? Not a chance. Find a decent constrasting scheme and work within that. Make sure the contrast is strong enough to avoid major problems.

Thanks Joshua Marshall Developer & Accessibility Lead Government Digital Service @partiallyblind Happy to help where we can. Next steps for us is better docs, more “how-to” guides... How can we help you guys more?