Making standards work for everyone

A presentation at State Of The Browser in September 2019 in London, UK by Sally Lait

Slide 1

Slide 1

State of the Browser conference September 2019 Making standards work for everyone Sally Lait @sallylait sally.dev

Slide 2

Slide 2

@sallylait !

Slide 3

Slide 3

@sallylait

Slide 4

Slide 4

@sallylait 🧼/🏢

Slide 5

Slide 5

@sallylait $ Why standards are important % What weʼre up against & The practical example bit

Slide 6

Slide 6

@sallylait Sally Lait Senior Engineering Manager Monzo Bank @sallylait sally.dev

Slide 7

Slide 7

What are standards?

Slide 8

Slide 8

“Web standards are the formal, non-proprietary standards and other technical specifications that define and describe aspects of the World Wide Web. In recent years, the term has been more frequently associated with the trend of endorsing a set of standardized best practices for building web sites, and a philosophy of web design and development that includes those methods.” en.wikipedia.org/wiki/Web̲standards

Slide 9

Slide 9

“Considerations include the interoperability, accessibility and usability of web pages and web sites.” en.wikipedia.org/wiki/Web̲standards

Slide 10

Slide 10

Why standards are !important

Slide 11

Slide 11

@sallylait ’ (

Slide 12

Slide 12

@sallylait

<html lang=”en”>

Slide 13

Slide 13

@sallylait

<html lang=”en-GB”>

Slide 14

Slide 14

@sallylait codepen.io/greywillfade/pen/wvwqKJN

Slide 15

Slide 15

@sallylait codepen.io/greywillfade/pen/QWLqpgy w3.org/International/questions/qa-lang-why

Slide 16

Slide 16

@sallylait

<html lang=”en”>

Slide 17

Slide 17

Tools and technologies e.g. frameworks, dev tools 📃 🎶 🖼 @sallylait Tools and technologies e.g. browsers, assistive technologies ,

Developers Users Guidelines, specifications, standards

Slide 18

Slide 18

What weʼre up against

Slide 19

Slide 19

@sallylait

<!DOCTYPE html>

Slide 20

Slide 20

@sallylait . “I hate accessibility and believe if you canʼt see, youʼre not worthy of using my website.”

Slide 21

Slide 21

@sallylait Early Late majority majority Early adopters Innovators Laggards

Slide 22

Slide 22

@sallylait $ People who donʼt know about these topics at all % People who know itʼs a thing but donʼt care about it & People who know and care, but canʼt prioritise above other things

Slide 23

Slide 23

@sallylait $ People who donʼt know about these topics at all % People who know itʼs a thing but donʼt care about it & People who know and care, but canʼt prioritise above other things

Slide 24

Slide 24

People interpret standards differently

Slide 25

Slide 25

@sallylait xkcd.com/927/

Slide 26

Slide 26

@sallylait U+1F469 U+200D U+1F4BB

Slide 27

Slide 27

Even standards can be wrong

Slide 28

Slide 28

@sallylait ひらがな カタカナ 漢字

Slide 29

Slide 29

@sallylait

Slide 30

Slide 30

@sallylait

Slide 31

Slide 31

@sallylait 幽霊文字 👻 墸壥妛挧暃椦槞蟐袮閠駲彁

Slide 32

Slide 32

“In 1978 a series of small mistakes created some characters out of nothing. The errors went undiscovered just long enough to be set in stone, and now these ghosts are, at least in potential, a part of every computer on the planet, lurking in the dark corners of character tables.” Paul McCann, dampfkraft.com/ghost-characters.html

Slide 33

Slide 33

Making standards the standard

Slide 34

Slide 34

Slide 35

Slide 35

Slide 36

Slide 36

Slide 37

Slide 37

Slide 38

Slide 38

@sallylait Individuals Teams Discipline Industry-wide Company-wide

Slide 39

Slide 39

@sallylait $ Donʼt know % Donʼt care & Canʼt prioritise

Slide 40

Slide 40

When people donʼt know

Slide 41

Slide 41

@sallylait Tell people 1:1 🗣

Slide 42

Slide 42

@sallylait Knowledge sharing 🎤

Slide 43

Slide 43

@sallylait Make it easy to know Images taken from web.dev/accessibility-auditing-react

Slide 44

Slide 44

@sallylait Think about your structure 🕸🏗

Slide 45

Slide 45

@sallylait Grow your (and othersʼ) influence ✨

Slide 46

Slide 46

@sallylait github.com/UKHomeOffice/posters/ microsoft.com/design/inclusive/ Give i t visi bilit y

Slide 47

Slide 47

@sallylait t i e v i G y t i l i b i s i v 📈📉📊

Slide 48

Slide 48

When people donʼt care

Slide 49

Slide 49

@sallylait Tell stories From: twitter.com/type̲̲error/status/1154417188314505216

Slide 50

Slide 50

@sallylait Tell stories twitter.com/tony̲sutton/status/1131256182163812352

Slide 51

Slide 51

@sallylait Donʼt (overly) rely on documentation 📚

Slide 52

Slide 52

Help people understand how it relates to their career @sallylait testingisbelieving.blogs pot.com/2017/11/ wheel-of-testing-part-3applications.html

Slide 53

Slide 53

@sallylait e r u t l u c r u ) o y m a d e l t i u e s B r e iv d a d n (a 9 : < 🤷 ; >

Slide 54

Slide 54

Force people to care! progression.monzo.com @sallylait

Slide 55

Slide 55

@sallylait Level 2 web engineer

Slide 56

Slide 56

@sallylait Level 3 web engineer

Slide 57

Slide 57

@sallylait Level 4 web engineer

Slide 58

Slide 58

When people canʼt prioritise

Slide 59

Slide 59

@sallylait Logic & data 🤔

Slide 60

Slide 60

@sallylait Scare them! theguardian.com/music/2019/jan/04/beyonce-parkwood-entertainment-sued-over-website-accessibility

Slide 61

Slide 61

@sallylait Do it regardless

Slide 62

Slide 62

@sallylait @ State intent

Slide 63

Slide 63

@sallylait @ Use your platform for good

Slide 64

Slide 64

@sallylait @ Focus, and do something well

Slide 65

Slide 65

State of the Browser conference September 2019 Thanks! 💙 Sally Lait @sallylait sally.dev