RESILIENCE lo Deli v er the bits, stupid. David Isenberg Rise of - - PowerPoint PPT Presentation

▶
resilience lo deli v er the bits stupid
SMART_READER_LITE
LIVE PREVIEW

RESILIENCE lo Deli v er the bits, stupid. David Isenberg Rise of - - PowerPoint PPT Presentation

Jun 19, 2023 329 likes •1k views

RESILIENCE lo Deli v er the bits, stupid. David Isenberg Rise of the Stupid Network HTTP email ftp telnet gopher TCP/IP HTTP URLs HTML WWW Ti e trick... is to make sure that each limited mechanical part of the web,

slide-1
SLIDE 1
slide-2
SLIDE 2

RESILIENCE

slide-3
SLIDE 3
slide-4
SLIDE 4
slide-5
SLIDE 5

lo

slide-6
SLIDE 6
slide-7
SLIDE 7
slide-8
SLIDE 8
slide-9
SLIDE 9
slide-10
SLIDE 10

“Deliver the bits, stupid.”

—David Isenberg “Rise of the Stupid Network”

slide-11
SLIDE 11

email gopher ftp HTTP telnet

TCP/IP

slide-12
SLIDE 12

HTTP

WWW

URLs HTML

slide-13
SLIDE 13
slide-14
SLIDE 14
slide-15
SLIDE 15
slide-16
SLIDE 16
slide-17
SLIDE 17
slide-18
SLIDE 18

Tie trick... is to make sure that each limited mechanical part of the web, each application, is within itself composed of simple parts that will never get too powerful.” “

—Tim Berners-Lee

slide-19
SLIDE 19

HTTP

WWW

URLs HTML

slide-20
SLIDE 20

HTML

slide-21
SLIDE 21

HTML tags 21 elements

<ul>

slide-22
SLIDE 22

HTML 5 121 elements

slide-23
SLIDE 23

<div> show me </div>

slide-24
SLIDE 24

<foo> show me </foo>

slide-25
SLIDE 25

<main> show me </main>

slide-26
SLIDE 26

<canvas> hide me </canvas>

slide-27
SLIDE 27

<img src alt>

slide-28
SLIDE 28

<img src alt srcset>

slide-29
SLIDE 29

<picture> <source srcset> <source srcset> <img src alt srcset> </picture>

slide-30
SLIDE 30

CSS

slide-31
SLIDE 31

selector { property: value; } OOCSS SMACSS BEM

slide-32
SLIDE 32

HTML CSS

slide-33
SLIDE 33

Be conservative in what you send, be liberal in what you accept.” “

—Jon Postel

slide-34
SLIDE 34
slide-35
SLIDE 35

HTML CSS JavaScript declarative imperative resilient fragile

slide-36
SLIDE 36

XHTML 2 fragile

slide-37
SLIDE 37

fragile JavaScript

slide-38
SLIDE 38

<a href="javascript:void(0)"> Download Chrome </a>

slide-39
SLIDE 39

Anything that can possibly go wrong, will go wrong.” “

—Edward Aloysius Murphy, Jr.

slide-40
SLIDE 40
slide-41
SLIDE 41
slide-42
SLIDE 42
  • 1. Identify core functionality.
  • 2. Make that functionality

available using the simplest technology.

  • 3. Enhance!
slide-43
SLIDE 43
  • 1. Identify core functionality.
  • 2. Make that functionality

available using the simplest technology.

  • 3. Enhance!
slide-44
SLIDE 44
slide-45
SLIDE 45
  • 1. Identify core functionality.
  • 2. Make that functionality

available using the simplest technology.

  • 3. Enhance!
slide-46
SLIDE 46

<nav> <main> <h1> <p> <article> <header> <footer>

slide-47
SLIDE 47

<ol> <li> <li> <li> </ol> <input type="text">

slide-48
SLIDE 48

<input type="file"> <img> <img> <img>

slide-49
SLIDE 49

<textarea>

slide-50
SLIDE 50
  • 1. Identify core functionality.
  • 2. Make that functionality

available using the simplest technology.

  • 3. Enhance!
slide-51
SLIDE 51

layout @font-face

slide-52
SLIDE 52

ajax websocket

slide-53
SLIDE 53

CSS filters file API

slide-54
SLIDE 54

local storage service worker

slide-55
SLIDE 55
  • 1. Identify core functionality.
  • 2. Make that functionality

available using the simplest technology.

  • 3. Enhance!
slide-56
SLIDE 56

“Tiis is too easy.”

slide-57
SLIDE 57

“Tiis is too hard.”

slide-58
SLIDE 58
  • 1. Identify core functionality.
  • 2. Make that functionality

available using the simplest technology.

  • 3. Enhance!
slide-59
SLIDE 59

developer convenience user needs

slide-60
SLIDE 60

216 colours

Times New Roman Arial Verdana

Netscape 4 IE 6 Windows XP Android 2.x

slide-61
SLIDE 61
slide-62
SLIDE 62
slide-63
SLIDE 63

HTTP

WWW

URLs HTML

slide-64
SLIDE 64

URLs

slide-65
SLIDE 65

RESILIENCE

slide-66
SLIDE 66