ff-herdict-preso

view ff-herdict-preso.html @ 14:26e0ce205a8f

Show more information if the CC license image is hovered-over.
author Atul Varma <varmaa@toolness.com>
date Wed Feb 10 14:51:07 2010 -0800 (2 years ago)
parents ca63f0dd6b0e
children 851edaba4c87
line source
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
2 "http://www.w3.org/TR/html4/DTD/strict.dtd">
3 <html>
4 <head>
5 <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
6 <base target="_blank"/>
7 <link rel="stylesheet" type="text/css" media="all"
8 href="css/ff-herdict-preso.css" />
9 <title>Mozilla Labs: Firefox-Herdict Integration Pitch</title>
10 </head>
11 <body>
12 <div id="container">
13 <div id="slides">
14 <div data-at="0.0">
15 <a href="http://www.mozillalabs.com"><img id="logo" src="images/labs-logo.png"/></a>
16 <h1>Firefox-Herdict Integration Pitch</h1>
17 </div>
18 <div data-at="4.0">
19 <img src="images/server-not-found.png"/>
20 </div>
21 <div data-at="18.0">
22 &ldquo;Is there something <em>I</em> can do to fix this?&rdquo;
23 </div>
24 <div data-at="28.0">
25 <a href="http://www.theatlantic.com/doc/200803/chinese-firewall"><img src="images/fallows-article.png"/></a>
26 </div>
27 <div data-at="49.0">
28 <a href="http://www.flickr.com/photos/pfly/130659908/"><img src="images/ethernet.jpg"/></a>
29 </div>
30 <div data-at="53.5">
31 <a href="http://www.flickr.com/photos/laughingsquid/176520418/"><img src="images/router.jpg"/></a>
32 </div>
33 <div data-at="56.0">
34 <img src="images/comcast.gif"/>
35 </div>
36 <div data-at="59.5">
37 <a href="http://www.flickr.com/photos/giantginkgo/69237905/"><img src="images/cubicles.jpg"/></a>
38 </div>
39 <div data-at="63.0">
40 <a href="http://en.wikipedia.org/wiki/People%27s_Republic_of_China"><img src="images/china-flag.png"/></a>
41 </div>
42 <div data-at="68.0">
43 bleh.
44 </div>
45 <div data-at="74.0">
46 &ldquo;Is there something <em>I</em> can do to fix this?&rdquo;
47 </div>
48 <div data-at="79.0">
49 <a href="http://www.herdict.org/web"><img src="images/herdict-logo.gif"/></a>
50 </div>
51 <div data-at="82.0">
52 <a href="http://cyber.law.harvard.edu"><img src="images/berkman-logo.png"/></a>
53 </div>
54 <div data-at="89.0">
55 <a href="http://www.herdict.org/web"><img src="images/herdict-map-2.png"/></a>
56 </div>
57 <div data-at="100.0">
58 &ldquo;Can other people on the internet see this site?&rdquo;
59 </div>
60 <div data-at="112.0">
61 &ldquo;Is there something <em>I</em> can do to fix this?&rdquo;
62 </div>
63 <div data-at="120.0">
64 <a href="http://jboriss.wordpress.com/2010/01/04/herdict-and-its-tasty-anonymized-aggregated-data/"><img src="images/mockup-firewall.png"/></a>
65 </div>
66 <div data-at="125.0">
67 <a href="http://jboriss.wordpress.com/2010/01/04/herdict-and-its-tasty-anonymized-aggregated-data/"><img src="images/mockup-china.png"/></a>
68 </div>
69 <div data-at="130.0">
70 <a href="http://jboriss.wordpress.com/2010/01/04/herdict-and-its-tasty-anonymized-aggregated-data/"><img src="images/mockup-everyone.png"/></a>
71 </div>
72 <div data-at="144.5">
73 <p><img src="images/dino-head.png"/></p>
74 <p>For more information, visit the <a href="https://wiki.mozilla.org/Firefox/Projects/Herdict">project wiki page</a>.</p>
75 </div>
76 </div>
77 <div id="subtitles">
78 <p data-at="0.0" class="visible">Firefox's network error pages are
79 familiar to everyone.</p>
80 <p data-at="4.0">But they're not very useful. Most people, if
81 they're like me, see this wall of text and interpret it to mean
82 "the internet broke and we have no idea why."</p>
83 <p data-at="14.0">The fundamental question users want answered
84 when they see this is: is there something <em>I</em> can do to fix
85 this?</p>
86 <p data-at="22.0">Now, the architecture of the internet makes it
87 fairly hard to actually pinpoint why a network is down.</p>
88 <p data-at="28.0">As James Fallows explains in his article "The
89 Connection Has Been Reset" from The Atlantic's March 2008
90 issue...</p>
91 <p data-at="34.5">some national governments
92 even exploit this to prevent their people from seeing things that the
93 government doesn't want them to see.</p>
94 <p data-at="42.0">All this means that a "server not found" error
95 page could have been raised because...</p>
96 <p data-at="49.0">the user's network connection got unplugged...</p>
97 <p data-at="53.5">or it could be because their local router is
98 down...</p>
99 <p data-at="56.0">or it could be because their ISP is having
100 problems...</p>
101 <p data-at="59.5">or because their corporation is blocking access
102 to the site...</p>
103 <p data-at="63.0">or because their government is...</p>
104 <p data-at="68.0">or it could be because the site is actually down.</p>
105 <p data-at="70.0">Firefox should do its best to answer that
106 fundamental question: is there something <em>I</em> can do to fix
107 this and get where I want to go?</p>
108 <p data-at="79.0">Enter Herdict.</p>
109 <p data-at="82.0">Herdict is a project of the Berkman Center for
110 Internet & Society at Harvard University, a brainchild of
111 Professor Jonathan Zittrain, that attempts to use crowdsourcing to
112 generate a global picture of internet connectivity.</p>
113 <p data-at="95.0">Put simply, it uses the power of the internet
114 itself to ask the question: <em>can other people on the internet
115 see this site? If so, who?</em></p>
116 <p data-at="106.0">Firefox can use the answers to these questions
117 to help answer the user's fundamental question: is there something
118 <em>I</em> can do to fix this?</p>
119 <p data-at="116.0">This Labs Experiment is an attempt at picturing what
120 Firefox-Herdict integration might look like.</p>
121 <p data-at="122.0">It's intended to be as
122 unintrusive as possible to the user experience, so it only aims to
123 improve upon the already notoriously unhelpful network error
124 pages.</p>
125 <p data-at="133.0">Rather than being a final solution, this Labs
126 Experiment is intended to build mindshare and catalyze discussion
127 about what a better network error page might look like...</p>
128 <p data-at="143.0">in keeping with Mozilla's tradition of creating
129 things that do stuff to make the internet better.</p>
130 </div>
131 <audio id="main" controls="indeed" autobuffer="indeed">
132 <source src="audio/ff-herdict-preso.ogg"
133 type="audio/ogg">
134 <source src="audio/ff-herdict-preso.mp3"
135 type="audio/mpeg">
136 Alas, this presentation requires <a
137 href="http://getfirefox.com">Firefox</a> or another
138 standards-compliant browser that
139 supports the <code>audio</code> element.
140 </audio>
141 <p class="button" id="show-subtitles">Click to show subtitles.</p>
142 <p class="button" id="hide-subtitles">Click to hide subtitles.</p>
143 <div><a id="license" rel="license" href="http://creativecommons.org/licenses/by/3.0/us/"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by/3.0/us/80x15.png" /></a>
144 <div id="more-info"><span xmlns:dc="http://purl.org/dc/elements/1.1/" href="http://purl.org/dc/dcmitype/MovingImage" property="dc:title" rel="dc:type">Firefox-Herdict Integration Pitch</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://toolness.com/" property="cc:attributionName" rel="cc:attributionURL">Atul Varma</a> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/3.0/us/">Creative Commons Attribution 3.0 United States License</a>.</div></div>
145 </div>
146 </body>
147 <script src="js/jquery.js"></script>
148 <script src="js/ff-herdict-preso.js"></script>
149 </html>