The Friction of Web Standards

A presentation at CSS Day + UX Special in June 2018 in Amsterdam, Netherlands by Eric A. Meyer

Slide 1

Slide 1

T h e Fr i c t i o n

o f

W e b

S t a n d a r d s #ux-special + .css-day h2

{ content: "Amsterdam, NL" ;} #ux-special + .css-day time

{ content: "June 14 & 15, 2018" ;}

Slide 2

Slide 2

The Friction of Web Standards

Slide 3

Slide 3

The Friction of Web Standards

Slide 4

Slide 4

The Friction of Web Standards

Slide 5

Slide 5

The Friction of Web Standards

Slide 6

Slide 6

The Friction of Web Standards The Web is the most hostile software engineering environment imaginable.” –D ougla s C ro u ck f ord “

Slide 7

Slide 7

The Friction of Web Standards –E ric M eyer The Web is the most hostile environment to developer assumptions imaginable.” “

Slide 8

Slide 8

The Friction of Web Standards

Slide 9

Slide 9

The Friction of Web Standards

Slide 10

Slide 10

The Friction of Web Standards /* 3 deep (or more) unordered lists use a square */ ol ol ul, ol ul ul, ol menu ul, ol dir ul, ol ol menu, ol ul menu, ol menu menu, ol dir menu, ol ol dir, ol ul dir, ol menu dir, ol dir dir, ul ol ul, ul ul ul, ul menu ul, ul dir ul, ul ol menu, ul ul menu, ul menu menu, ul dir menu, ul ol dir, ul ul dir, ul menu dir, ul dir dir, menu ol ul, menu ul ul, menu menu ul, menu dir ul, menu ol menu, menu ul menu, menu menu menu, menu dir menu, menu ol dir, menu ul dir, menu menu dir, menu dir dir, dir ol ul, dir ul ul, dir menu ul, dir dir ul, dir ol menu, dir ul menu, dir menu menu, dir dir menu, dir ol dir, dir ul dir, dir menu dir, dir dir dir { list-style-type: square; }

Slide 11

Slide 11

The Friction of Web Standards /* 3 deep (or more) unordered lists use a square */ :-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) ul, :-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) menu, :-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) dir { list-style-type: square; }

Slide 12

Slide 12

The Friction of Web Standards

Slide 13

Slide 13

The Friction of Web Standards

Slide 14

Slide 14

The Friction of Web Standards

Slide 15

Slide 15

The Friction of Web Standards

Slide 16

Slide 16

The Friction of Web Standards

Slide 17

Slide 17

The Friction of Web Standards

Slide 18

Slide 18

The Friction of Web Standards

Slide 19

Slide 19

The Friction of Web Standards

Slide 20

Slide 20

The Friction of Web Standards

Slide 21

Slide 21

The Friction of Web Standards

Slide 22

Slide 22

The Friction of Web Standards

Slide 23

Slide 23

The Friction of Web Standards

Slide 24

Slide 24

The Friction of Web Standards

Slide 25

Slide 25

The Friction of Web Standards

Slide 26

Slide 26

The Friction of Web Standards

Slide 27

Slide 27

The Friction of Web Standards

Slide 28

Slide 28

The Friction of Web Standards

Slide 29

Slide 29

The Friction of Web Standards

Slide 30

Slide 30

The Friction of Web Standards

Slide 31

Slide 31

The Friction of Web Standards

Slide 32

Slide 32

The Friction of Web Standards

Slide 33

Slide 33

The Friction of Web Standards

Slide 34

Slide 34

The Friction of Web Standards

Slide 35

Slide 35

The Friction of Web Standards

Slide 36

Slide 36

The Friction of Web Standards

Slide 37

Slide 37

The Friction of Web Standards

Slide 38

Slide 38

The Friction of Web Standards

Slide 39

Slide 39

The Friction of Web Standards

Slide 40

Slide 40

The Friction of Web Standards

Slide 41

Slide 41

The Friction of Web Standards

Slide 42

Slide 42

The Friction of Web Standards

Slide 43

Slide 43

The Friction of Web Standards

Slide 44

Slide 44

The Friction of Web Standards ? ! * @ %

Slide 45

Slide 45

The Friction of Web Standards

Slide 46

Slide 46

The Friction of Web Standards

Slide 47

Slide 47

The Friction of Web Standards

Slide 48

Slide 48

The Friction of Web Standards

Slide 49

Slide 49

The Friction of Web Standards

Slide 50

Slide 50

The Friction of Web Standards

Slide 51

Slide 51

The Friction of Web Standards

Slide 52

Slide 52

The Friction of Web Standards

Slide 53

Slide 53

The Friction of Web Standards

Slide 54

Slide 54

The Friction of Web Standards

Slide 55

Slide 55

The Friction of Web Standards

Slide 56

Slide 56

The Friction of Web Standards

Slide 57

Slide 57

The Friction of Web Standards

Slide 58

Slide 58

The Friction of Web Standards

Slide 59

Slide 59

The Friction of Web Standards

Slide 60

Slide 60

T h e Fr i c t i o n

o f

W e b

S t a n d a r d s /* -------------------------
| Web: https://meyerweb.com | | Email: eric@meyerweb.com | | Twitter: @meyerweb | ------------------------- */ address::after

{ content: "Dank u wel!" ;

text-transform:

uppercase ;

font-size:

xx-large ;

font-weight:

999 ;}