Slide 1

Slide 1 text

@brucel §

Slide 2

Slide 2 text

@brucel

Slide 3

Slide 3 text

@brucel

Slide 4

Slide 4 text

@brucel • Picture of TBL “web developer”

Slide 5

Slide 5 text

Seren

Slide 6

Slide 6 text

@brucel http://info.cern.ch/hypertext/WWW/TheProject.html

Slide 7

Slide 7 text

@brucel

Slide 8

Slide 8 text

@brucel

Slide 9

Slide 9 text

@brucel

Slide 10

Slide 10 text

@brucel We broke it • fixed width • bad contrast, fonts, colours • pixel-perfect layout • lack of captions for videos • lack of keyboard accessibility • removing focus indicator

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

@brucel

Slide 13

Slide 13 text

@brucel

Slide 14

Slide 14 text

@brucel

Slide 15

Slide 15 text

@brucel

Slide 16

Slide 16 text

@brucel The Raw Materials

Slide 17

Slide 17 text

@brucel b • web comping

Slide 18

Slide 18 text

@brucel

Slide 19

Slide 19 text

@brucel Top four 1. Have a fundamental understanding of JavaScript “Of course you can’t do full-stack JavaScript development (or full-stack any web development for that matter), without learning JavaScript itself.” 2. Front-End framework 3. Bootstrap 4 4. HTML/CSS

Slide 20

Slide 20 text

@brucel As for HTML, there’s not much to learn right away and you can kind of learn as you go, but before making your first templates, know the difference between in-line elements like and how they differ from block ones like
. This will save you a huge amount of headache when fiddling with your CSS code.

Slide 21

Slide 21 text

@brucel • semantics !

Slide 22

Slide 22 text

@brucel

Slide 23

Slide 23 text

@brucel

Slide 24

Slide 24 text

@brucel

Slide 25

Slide 25 text

@brucel Screen reader users http://webaim.org/projects/screenreadersurvey5/ - used by kind permission

Slide 26

Slide 26 text

@brucel

Slide 27

Slide 27 text

@brucel

Reading List

SOME STUFF

Posted in accessibility web standards, reading list . Edit. Leave a comment

Slide 28

Slide 28 text

@brucel

Slide 29

Slide 29 text

@brucel

Slide 30

Slide 30 text

@brucel

Slide 31

Slide 31 text

@brucel

Slide 32

Slide 32 text

@brucel

Slide 33

Slide 33 text

@brucel Accessibility is part of Usability “high conformance with web accessibility guidelines may provide benefits to users without disabilities.”


Slide 34

Slide 34 text

@brucel Schmutza, Sondereggera and Sauera
 • Sixty-one participants without disabilities used one of three websites differing in levels of accessibility • A high level of web accessibility led to better performance (i.e., task completion time and task completion rate) than low or very low accessibility. • Likewise, high web accessibility improved user ratings (i.e., perceived usability, aesthetics, workload and trustworthiness) compared to low or very low web accessibility. Department of Psychology, University of Fribourg, Fribourg, Switzerland www.unifr.ch/psycho/assets/files/KogErg/SchmutzSondereggerSauer2016.pdf

Slide 35

Slide 35 text

@brucel

Slide 36

Slide 36 text

No content

Slide 37

Slide 37 text

No content

Slide 38

Slide 38 text

https://kryogenix.org/code/browser/everyonehasjs.html

Slide 39

Slide 39 text

@brucel https://www.reddit.com/r/webdev/comments/a7ydt9/the_practical_value_of_semantic_html/

Slide 40

Slide 40 text

@brucel

Slide 41

Slide 41 text

@brucel “Developer Experience” Bait-and-Switch We cannot continue to use as much JavaScript as is now “normal” and expect the web to flourish. To get this fixed, we need to confront the “developer experience” bait-and-switch. Tools that cost the poorest users to pay wealthy developers are bunk. Alex Russell https://infrequently.org/2018/09/the-developer-experience-bait-and-switch/ “

Slide 42

Slide 42 text

Rise of The Smartphones

Slide 43

Slide 43 text

No content

Slide 44

Slide 44 text

Smartphones ▪ overwhelmingly Android ▪ low cost, low spec ▪ very little RAM, very limited storage ▪ dual SIM

Slide 45

Slide 45 text

No content

Slide 46

Slide 46 text

@brucel 500MB data: hours worked https://360.here.com/2015/06/03/offline-navigation-really-matters-500mb-data-costs-week-wages/

Slide 47

Slide 47 text

@brucel How To Make Internet Affordable Even with more phones than ever before, the cost of Internet is a major obstacle. In Nigeria, the data needed to watch just 2 minutes of online video a day can cost more than sending a child to school for a month. https://webwewant.org/news/how-to-make-internet-affordable/ “

Slide 48

Slide 48 text

@brucel The Baseline Costs of JavaScript Frameworks Your React application will never load faster than about 1.1 seconds on an average phone in India, no matter how much you optimize it. Your Angular app will always take at least 2.7 seconds to boot up. Ankur Sethi, Nov 2018 https://blog.uncommon.is/the-baseline-costs-of-javascript-frameworks-f768e2865d4a “

Slide 49

Slide 49 text

ICT access by population Total 
 global population ~7.4 billion High-speed
 internet 1.1 billion Total 
 internet users 3.2 billion Mobile phones 5.2 billion Within mobile coverage 7 billion World Bank: Digital Dividends 2016

Slide 50

Slide 50 text

The world’s offline population Total 
 internet users 3.2 billion High-speed
 internet 1.1 billion India 1.063 billion Countries outside of the top 20 China 755 million Indonesia 213 million Pakistan 165 million Bangladesh 148 million Nigeria 111 million Brazil 98 million Ethiopia 95 million Mexico 70 million Congo, Dem. Rep. 68 million Philippines 63 million Russian Federation 55 million Iran, Islamic Rep. 54 million Myanmar 53 million Vietnam 52 million United States 51 million Tanzania 49 million Thailand 48 million Egypt, Arab Rep. 42 million Turkey 41 million

Slide 51

Slide 51 text

No content

Slide 52

Slide 52 text

No content

Slide 53

Slide 53 text

No content

Slide 54

Slide 54 text

In India, only 96k of the 736k cell towers are 3G enabled, but more critically, only 35k of those towers have a fiber optic connection to the backbone, which results in inconsistent connection. “ Flaky connection - India's mobile Internet: The revolution has begun Avdendus (2013)

Slide 55

Slide 55 text

Making the internet universally accessible and affordable should be a global priority. “ World Bank

Slide 56

Slide 56 text

Developing countries are home to 94% of the global offline population. “ - State of Connectivity 2014, internet.org

Slide 57

Slide 57 text

Courtesy of Hesperian

Slide 58

Slide 58 text

No content

Slide 59

Slide 59 text

No content

Slide 60

Slide 60 text

If you want to liberate a country, give them the internet. “ - Wael Ghonim, Egyptian internet activist

Slide 61

Slide 61 text

No content

Slide 62

Slide 62 text

an increase in Internet maturity similar to the one experienced in mature countries over the past 5 years creates an increase in real GDP per capita of $500 on average during this period. “ Internet matters - The Net’s sweeping impact on growth, jobs, and prosperity (McKinsey Global Institute)

Slide 63

Slide 63 text

It took the Industrial Revolution of the 19th century 50 years to produce the same result. “ Internet matters - The Net’s sweeping impact on growth, jobs, and prosperity (McKinsey Global Institute)

Slide 64

Slide 64 text

No content

Slide 65

Slide 65 text

No content

Slide 66

Slide 66 text

No content

Slide 67

Slide 67 text

No content

Slide 68

Slide 68 text

No content

Slide 69

Slide 69 text

See people not problems

Slide 70

Slide 70 text

No content

Slide 71

Slide 71 text

No content

Slide 72

Slide 72 text

No content

Slide 73

Slide 73 text

@brucel • [image of a crowd of people - terrible stock photo?]

Slide 74

Slide 74 text

@brucel

Slide 75

Slide 75 text

@brucel

Slide 76

Slide 76 text

@brucel

Slide 77

Slide 77 text

@brucel

Slide 78

Slide 78 text

@brucel

Slide 79

Slide 79 text

@brucel

Slide 80

Slide 80 text

@brucel

Slide 81

Slide 81 text

No content

Slide 82

Slide 82 text

@brucel Thank you!