96
How to destroy the Web Bruce Lawson

How to destroy the web - Lawson

Embed Size (px)

DESCRIPTION

Slides from Bruce Lawson talk @Codemotion Roma 2014

Citation preview

Page 1: How to destroy the web - Lawson

How to destroy the WebBruce Lawson

Page 2: How to destroy the web - Lawson
Page 3: How to destroy the web - Lawson

Tigger Warning

Page 4: How to destroy the web - Lawson
Page 5: How to destroy the web - Lawson

The principles of universality of access irrespective of hardware or software platform, network infrastructure, language, culture, geographical location, or physical or mental impairment are core values

Tim Berners-Lee

Page 6: How to destroy the web - Lawson
Page 7: How to destroy the web - Lawson
Page 8: How to destroy the web - Lawson
Page 9: How to destroy the web - Lawson
Page 10: How to destroy the web - Lawson
Page 11: How to destroy the web - Lawson

"There is a problem called Twitter right now and you can find every kind of lie there. The thing that is called social media is the biggest trouble for society right now."

- Tayyip Erdoğan, PM of Turkey

Page 12: How to destroy the web - Lawson
Page 13: How to destroy the web - Lawson
Page 14: How to destroy the web - Lawson
Page 15: How to destroy the web - Lawson

The web

● Damages trade● Promotes social unrest● Encourages mistrust of authority

Therefore ...

Page 16: How to destroy the web - Lawson

The Web must be destroyed.

Page 17: How to destroy the web - Lawson
Page 18: How to destroy the web - Lawson

32% developers want monoculture

http://urtak.is/vOtBLj

Page 19: How to destroy the web - Lawson
Page 20: How to destroy the web - Lawson

http://en.wikipedia.org/wiki/Browser_wars#The_first_browser_war

Page 21: How to destroy the web - Lawson

Only allow users with the right devices in

Page 22: How to destroy the web - Lawson

Ipad pic, tweet "ipad = IE4"

Page 23: How to destroy the web - Lawson
Page 24: How to destroy the web - Lawson
Page 25: How to destroy the web - Lawson

do browser sniffing

Page 26: How to destroy the web - Lawson
Page 27: How to destroy the web - Lawson

A short sad history of browser sniffing (http://webaim.org/blog/user-agent-string-history/)

Mosaic NCSA_Mosaic/2.0 (Windows 3.1)Netscape Mozilla/1.0 (Win3.1)IE: Mozilla/1.22 (compatible; MSIE 2.0; Windows 95)Firefox: Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.1) Gecko/20020826Konqueror: Mozilla/5.0 (compatible; Konqueror/3.2; FreeBSD) (KHTML, like Gecko) Opera: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; en) Opera 9.51, or Mozilla/5.0 (Windows NT 6.0; U; en; rv:1.8.1) Gecko/20061208 Firefox/2.0.0 Opera 9.51, or Opera/9.51 (Windows NT 5.1; U; en)Safari: Mozilla/5.0 (Macintosh; U; PPC Mac OS X; de-de) AppleWebKit/85.7 (KHTML, like Gecko) Safari/85.5Chrome: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13

Page 28: How to destroy the web - Lawson

New kids on the block ...

● Opera 15 Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.32 (KHTML, like Gecko) Chrome/27.0.1423.0 Safari/537.32 OPR/15.0.1089.0

● IE11 Mozilla/5.0 (IE 11.0; Windows NT 6.3 ; Trident 7.0; .NET 4.0E; .NET 4.0C; rv:11.0) like Gecko

Page 29: How to destroy the web - Lawson

Script: https://github.com/404 (27 Jan 2011)

// Detect if the browser is IE or not. // If it is not IE, we assume that the browser is NS.

var IE = document.all?true:false; // If NS -- that is, !IE -- then set up for mouse capture if (!IE) document.captureEvents(Event.MOUSEMOVE);

(Lots more fun at https://github.com/miketaylr/Snort/blob/master/snort.yml)

Page 30: How to destroy the web - Lawson
Page 31: How to destroy the web - Lawson
Page 32: How to destroy the web - Lawson
Page 33: How to destroy the web - Lawson

China

“The proportion of [people] accessing the Internet by mobile increased enormously from 39.5% in late 2008 to 46% in June 2009, while the proportion of using desktops and laptops decreased”. (close to 150 million people).Statistical Report on Internet Development in China, p25-26, July 2009, www.ccnic.cn

Page 34: How to destroy the web - Lawson

There is one bank branch for every 14,000 people, one ATM for every 5000 people but a mobile for every 2.3 people in India (563.73 million) .

India has more mobile phones than toilets.

Page 35: How to destroy the web - Lawson
Page 36: How to destroy the web - Lawson

“One Web means making, as far as is reasonable, the same information and services available to users irrespective of the device they are using. However, it does not mean that exactly the same information is available in exactly the same representation across all devices.”W3C Mobile Web Best Practices http://www.w3.org/TR/mobile-bp/#OneWeb

Page 37: How to destroy the web - Lawson
Page 38: How to destroy the web - Lawson
Page 39: How to destroy the web - Lawson

Require script support or specific plugins

Page 40: How to destroy the web - Lawson
Page 41: How to destroy the web - Lawson
Page 42: How to destroy the web - Lawson
Page 43: How to destroy the web - Lawson

http://www.koreatimes.co.kr/www/news/biz/2010/05/123_52401.html

Page 44: How to destroy the web - Lawson

Ahn Cheol-soo

Active X has “led to international isolation of Korean IT” and “inconvenience for users.”

Quoted in Wall St Journal(Image by Jinho Junghttp://en.wikipedia.org/wiki/File:Ahn_Cheol-Soo.jpg)

Page 45: How to destroy the web - Lawson
Page 46: How to destroy the web - Lawson

Make the Web country-specific

Page 47: How to destroy the web - Lawson

USA October 2012 (see www.opera.com/smw)

Top 10 sites (unique users)

1. google.com

2. facebook.com

3. youtube.com

4. yahoo.com

5. wikipedia.org

5. blogspot.com

6. twitter.com

7. amazon.com

8. tumblr.com

9. go.com

Top 10 handsets

1. Apple iPod

2. Apple iPhone

3. LG LGE-VM510 NetFront

4. Android SCH-R720

5. Android VM670

6. Huawei unknown

7. BlackBerry 8520

8. Samsung SPH-M910

9. Samsung SPH-M820-BST

10.Android M860

Page 48: How to destroy the web - Lawson

Bangladesh

Top 10 sites 1. facebook.com

2. google.com

3. youtube.com

4. waptrick.com

5. Getjar.com

6. espncricinfo.com

7. wikipedia.org

8. badnews24.com

9. Wap.in

10.Prothom-alo.com

Top handsets

1. Nokia 2700C

2. Nokia 5130

3. Maui E800

4. Nokia 2690

5. Nokia X2 00

6. Nokia X2 01

7. Nokia C1

8. Nokia C3

9. Nokia 6120C

10.Nokia N73 http://www.opera.com/smw/2012/07/

Page 49: How to destroy the web - Lawson

UK

Top 10 sites 1. google.com

2. facebook.com

3. youtube.com

4. wikipedia.org

5. bbc.co.uk

6. twitter.com

7. yahoo.com

8. goal.com

9. live.com

10.dailymail.co.uk

Top handsets

1. BlackBerry_BlackBerry8520

2. BlackBerry_BlackBerry9300

3. Nokia_Nokia C3-00

4. BlackBerry_BlackBerry9700

5. BlackBerry_BlackBerry9800

6. Apple_iPhone

7. Android_HTC

8. BlackBerry_BlackBerry9780

9. Maui_E800

10.BlackBerry_BlackBerry9900

Page 50: How to destroy the web - Lawson
Page 51: How to destroy the web - Lawson
Page 52: How to destroy the web - Lawson
Page 53: How to destroy the web - Lawson

Require specific types of hardware

Page 54: How to destroy the web - Lawson

Assume a mouse

foo:hover bar { display:block;}

Page 55: How to destroy the web - Lawson

Hippy BS Way

foo:hover bar,foo:focus bar {display:block;}

Page 56: How to destroy the web - Lawson
Page 57: How to destroy the web - Lawson

*:focus { outline:none;}

Page 58: How to destroy the web - Lawson

Assume a visual display

Page 59: How to destroy the web - Lawson

Assume a visual display

<SPAN id=:rg class=toxOdd role=link tabIndex=0 closure_hashCode_l16mgm="177"> Create a filter</SPAN>

Page 60: How to destroy the web - Lawson

Assume a visual display

<SPAN id=:rg class=toxOdd role=link tabIndex=0 closure_hashCode_l16mgm="177"> Create a filter</SPAN>

Page 61: How to destroy the web - Lawson

Assume a visual display

<SPAN id=:rg class=toxOdd role=link tabIndex=0 closure_hashCode_l16mgm="177"> Create a filter</SPAN>

Page 62: How to destroy the web - Lawson

Hippy BS Way

<a href=...>Create a filter</a>

(Enhance with Ajax for JS users if you want)

Page 63: How to destroy the web - Lawson

Semantics are wasteful

Page 64: How to destroy the web - Lawson

Semantics are wasteful

<DIV id=:rk class="J-K-I J-J5-Ji L3 J-K-I-JO" tabIndex=0unselectable="on" closure_hashCode_l16mgm="182" act=""><DIV class="J-J5-Ji J-K-I-Kv-H" unselectable="on"><DIV class="J-J5-Ji J-K-I-J6-H" unselectable="on"><DIV class=J-K-I-KC unselectable="on"><DIV class=J-K-I-K9-KP unselectable="on">&nbsp;</DIV><DIV class=J-K-I-Jz unselectable="on">Search Mail</DIV></DIV></DIV></DIV></DIV>

Page 65: How to destroy the web - Lawson

Semantics are wasteful

<DIV role=button id=:rk class="J-K-I J-J5-Ji L3 J-K-I-JO" tabIndex=0 unselectable="on" closure_hashCode_l16mgm="182" act=""><DIV class="J-J5-Ji J-K-I-Kv-H" unselectable="on"><DIV class="J-J5-Ji J-K-I-J6-H" unselectable="on"><DIV class=J-K-I-KC unselectable="on"><DIV class=J-K-I-K9-KP unselectable="on">&nbsp;</DIV><DIV class=J-K-I-Jz unselectable="on">Search Mail</DIV></DIV></DIV></DIV></DIV>

Page 66: How to destroy the web - Lawson

Hippie BS Web Components way

<button is=kewl-button>Search Mail<button>

document.register('kewl-button', {extends: 'button'});

Use Shadow DOM to add markup for styling reasons.

Page 67: How to destroy the web - Lawson

<body></body>

Page 68: How to destroy the web - Lawson

Break the URL addressing system

Page 69: How to destroy the web - Lawson

The reason the web is so powerful is that it is a web of information. One piece of data is linked with another piece of data is via a URL.

Directly addressable content is what makes web apps better than desktop apps. danwebb.net/2011/5/28/it-is-about-the-hashbangs

Page 70: How to destroy the web - Lawson

#!

See http://isolani.co.uk/blog/javascript/BreakingTheWebWithHashBangs

Page 71: How to destroy the web - Lawson

NYSE Euronext prohibits ... unauthorized hypertext links by others to the NYSE Euronext Web-site. NYSE Euronext reserves the right to disable any unauthorized links.

Page 72: How to destroy the web - Lawson

http://www.nyse.com/

Page 73: How to destroy the web - Lawson

Use of any Web browsers (other than generally available third-party browsers), engines, software, spiders, robots, avatars, agents, tools or other devices or mechanisms to navigate, search or determine the NYSE Web-site is strictly prohibited.

Page 74: How to destroy the web - Lawson

You agree you will not, and will not permit any third party to obstruct, receive, modify or otherwise interfere with the display or delivery of advertisements on the NYSE Web-site.

Page 75: How to destroy the web - Lawson

You may print or download a single, unaltered, permanent copy or one temporary copy in a single computer’s memory of any Content for your personal, non-commercial use only

Page 76: How to destroy the web - Lawson

You agree to review this Agreement each time you access the NYSE Euronext Web-site so that you are aware of any and all modifications made to this Agreement since your last visit

Page 77: How to destroy the web - Lawson

www.cybertriallawyer.com/user-agreement

Page 78: How to destroy the web - Lawson

Censor the Web

Page 79: How to destroy the web - Lawson
Page 80: How to destroy the web - Lawson
Page 81: How to destroy the web - Lawson
Page 82: How to destroy the web - Lawson
Page 83: How to destroy the web - Lawson
Page 84: How to destroy the web - Lawson
Page 85: How to destroy the web - Lawson

Clitheroe LightwaterPenistone

Page 86: How to destroy the web - Lawson

Clitheroe LightwaterPenistone

Page 87: How to destroy the web - Lawson

Scunthorpe

Page 88: How to destroy the web - Lawson
Page 89: How to destroy the web - Lawson

“We believe that if access to the Web increases dramatically, there will be significant social development and greater political representation among the billions of people who currently have no voice.”

Page 90: How to destroy the web - Lawson

● The Internet contributes 3.4 percent to Gross Domestic Product (GDP) averaged over the 13 countries covered by the report (21% of GDP growth for the most developed countries)

● The Internet creates 2.6 jobs for each lost to technology-related efficiencies

(See What good is the web? Some numbers

http://www.brucelawson.co.uk/2012/what-good-is-the-web-some-numbers/)

Page 91: How to destroy the web - Lawson

● Most of the economic value created by the Internet falls outside of the technology sector, with 75 percent of the benefits captured by companies in more traditional industries

● There’s a 10% increase in productivity for Small and medium enterprises (SMEs) from Internet use

● SMEs heavily using Web technology grow and export twice as much as others

Page 92: How to destroy the web - Lawson

“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.

It took the Industrial Revolution of the 19th century 50 years to produce the same result.”

Page 93: How to destroy the web - Lawson

WWW

Page 94: How to destroy the web - Lawson
Page 95: How to destroy the web - Lawson

www.opera.com/[email protected]

twitter.com/brucel

Page 96: How to destroy the web - Lawson

Image/ screenshot credits● http://iranian-girl.blogspot.com, http://iraniandoughter.blogspot.com/2010/08/my-haven.html

● http://bbwob.blogspot.com/2008/05/atrocities-by-military-regime.html

● Erdoğan photo http://en.wikipedia.org/wiki/File:Tayyip_Erdoğan.JPG

● http://twitter.com/#!/dhh/status/32471503853322241

● ZX81 http://www.flickr.com/photos/austinevan/3368452115/sizes/o/in/photostream/

● xkcd app catoon http://xkcd.com/1174/

● Quora being stupid http://www.flickr.com/photos/41894155216@N01/8750997471

● Address book photo http://www.flickr.com/photos/anderspee/5243086788/

● Sharks with lasers http://www.flickr.com/photos/starstreak007/3416655056/sizes/l/in/faves-24374884@N08/

● Browser sniffing http://www.flickr.com/photos/timdorr/2096272747/

● Indian mobile phones http://www.flickr.com/photos/worldbank/3492673512/

● Telegraph report (Indian mobile subscribers) 15 April 2010, http://www.telegraph.co.uk/news/worldnews/asia/india/7593567/India-has-more-mobile-phones-than-toilets-UN-report.html

● Country stats and handset breakdown on free monthly State of the Mobile Web report http://opera.com/smw

● Lightwater map, © OpenStreetMap contributors