How
Mozilla
t a k e s back
the Web Cyber Liberties Conference 2009, Vienna Eric Eggert, yatil.de
Slide 1
Slide 2
Eric Eggert Webentwickler/-designer User Interfaces Accessibility Web 2.0 Webseite: yatil.de Twitter: @yatil
Slide 3
Mission Statement
Slide 4
We believe…
Slide 5
We believe… that the Internet
Slide 6
We believe… that the Internet should be
Slide 7
We believe… that the Internet should be public,
Slide 8
We believe… that the Internet should be public, open
Slide 9
We believe… that the Internet should be public, open &
Slide 10
We believe… that the Internet should be public, open & accessible
Slide 11
We believe… that the Internet should be public, open & accessible
Slide 12
open
Slide 13
Open Source
Slide 14
Open Standards
Slide 15
Open Source
Slide 16
Slide 17
Slide 18
Slide 19
Slide 20
Slide 21
Slide 22
Mozilla Technologies
Slide 23
Mozilla Labs
Slide 24
Mozilla Fennec
Slide 25
75.000.000 US-$ Einnahmen lt. Wikipedia
Slide 26
Freedom Scientific JAWS Screen Reader Closed Source 895–1095,— US-$
Slide 27
NonVisual Desktop Access (NVDA) Screen Reader Open Source Frei erhältlich Von 2 blinden Entwicklern programmiert
Slide 28
It’s freedom, but not Scientific.
Slide 29
Open Standards
Slide 30
XML Lingua Franca des Webs. <lesbar durch="Klartext" />
Slide 31
XML !
XUL + XBL XML User Interface Language XML Binding Language Fließen zurück ins W3C.
Slide 32
JavaScript industry standard called ECMAScript
Slide 33
AJAX eigentlich: XMLHttpRequest Erfunden von Microsoft Implementiert von Mozilla und anderen Später standardisiert im W3C
Slide 34
Markup-Standards
Slide 35
W3C
Slide 36
XHTML 2.0
Slide 37
WHAT WG Web HyperText Application Technology Working Group “The WHATWG was founded by individuals of Apple, the Mozilla Foundation, and Opera Software in 2004, after a W3C workshop. Apple, Mozilla and Opera were becoming increasingly concerned about the W3C’s direction with XHTML, lack of interest in HTML and apparent disregard for the needs of real- world authors. So, in response, these organisations set out with a mission to address these concerns and the Web Hypertext Application Technology Working Group was born.”
Slide 38
Web Applications 1.0
Slide 39
HTML5
Slide 40
http://yatil.posterous.com/1092829
Slide 41
Canvas Kann was. Entwickelt von Apple/Webkit Implementiert von Mozilla
Slide 42
HTML5 Audio/Video No Flash! Bessere Barrierefreiheit.
Slide 43
Format?
Slide 44
Apple: H.264 Hardwareunterstützung Effizient Lizenzgebühren ab 2010
Slide 45
Mozilla: Ogg/Theora Frei
Slide 46
Resolution: Kein festes Format definiert. Da Flash aber H.264 kann, benötigt man lediglich 2 Formate: <video width="640" height="360" poster="poster.jpg" controls="controls" autoplay="autoplay"> <source src=" http://tinyvid.tv/vfe/big_buck_bunny.ogv " type="video/ogg" /> <source src=" http://tinyvid.tv/vfe/big_buck_bunny.mp4 " type="video/mp4" /> <!--[if gt IE 6]> <object width="640" height="375" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"><! [endif]--><!--[if !IE]><!--> <object width="640" height="375" type="video/quicktime" data=" http://tinyvid.tv/vfe/big_buck_bunny.mp4 "> <!--<![endif]--> <param name="src" value=" http://tinyvid.tv/vfe/big_buck_bunny.mp4 " /> <param name="autoplay" value="true" /> <param name="showlogo" value="false" /> <object width="640" height="380" type="application/x-shockwave-flash" data="player.swf?autostart=true&image=poster.jpg&file= http://tinyvid.tv/vfe/ big_buck_bunny.mp4 "> <param name="movie" value="player.swf?autostart=true&image=poster.jpg&file= http:// tinyvid.tv/vfe/big_buck_bunny.mp4 " /> <!-- fallback message --> <img src="poster.jpg" width="640" height="360" /> <p> <strong>No video playback capabilities detected.</strong> Why not try to download the file instead?<br /> <a href=" http://tinyvid.tv/vfe/big_buck_bunny.mp4 ">MPEG4 / H.264 “.mp4” (Windows / Mac)</a> | <a href=" http://tinyvid.tv/vfe/big_buck_bunny.ogv ">Ogg Theora & Vorbis “.ogv” (Linux)</ a> </p><p> To play the video here in the webpage, please do one of the following: </p><ul> <li>Upgrade to <a href=" http://getfirefox.com ">Firefox v3.5</a>, or <a href=" http://apple.com/safari ">Safari v4</a></li> <li>Install <a href=" http://get.adobe.com/flashplayer/ ">Adobe Flash Player</a></li> <li>Install <a href=" http://apple.com/quicktime/download/ ">Apple QuickTime</a></li> </ul> </object><!--[if gt IE 6]><!--> </object><!--<![endif]--> </video>
Slide 47
Resolution: Kein festes Format definiert. Da Flash aber H.264 kann, benötigt man lediglich 2 Formate: <video width="640" height="360" poster="poster.jpg" controls="controls" autoplay="autoplay">
<source src=" http://tinyvid.tv/vfe/big_buck_bunny.ogv " type="video/ogg" /> <source src=" http://tinyvid.tv/vfe/big_buck_bunny.mp4 " type="video/mp4" /> <!--[if gt IE 6]> <object width="640" height="375" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"><! [endif]--><!--[if !IE]><!--><object width="640" height="375" type="video/quicktime" data=" http://tinyvid.tv/vfe/big_buck_bunny.mp4 ">
<!--<![endif]--> <param name="src" value=" http://tinyvid.tv/vfe/big_buck_bunny.mp4 " /> <param name="autoplay" value="true" /> <param name="showlogo" value="false" /><object width="640" height="380" type="application/x-shockwave-flash"
data="player.swf?autostart=true&image=poster.jpg&file= http://tinyvid.tv/vfe/ big_buck_bunny.mp4 ">
<param name="movie" value="player.swf?autostart=true&image=poster.jpg&file= http:// tinyvid.tv/vfe/big_buck_bunny.mp4 " /> <!-- fallback message --> <img src="poster.jpg" width="640" height="360" /> <p><strong>No video playback capabilities detected.</strong>
Why not try to download the file instead?<br />
<a href=" http://tinyvid.tv/vfe/big_buck_bunny.mp4 ">MPEG4 / H.264 “.mp4” (Windows / Mac)</a> |
<a href=" http://tinyvid.tv/vfe/big_buck_bunny.ogv ">Ogg Theora & Vorbis “.ogv” (Linux)</ a>
</p><p>To play the video here in the webpage, please do one of the following:
</p><ul> <li>Upgrade to <a href=" http://getfirefox.com ">Firefox v3.5</a>,or <a href=" http://apple.com/safari ">Safari v4</a></li>
<li>Install <a href=" http://get.adobe.com/flashplayer/ ">Adobe Flash Player</a></li> <li>Install <a href=" http://apple.com/quicktime/download/ ">Apple QuickTime</a></li> </ul></object><!--[if gt IE 6]><!-->
</object><!--<![endif]--> </video>
Slide 48
Geo Location
Slide 49
Style Standards CSS FTW!
Slide 50
CSS2.1 @Font-Face
Slide 51
CSS3 Boxes & Borders
Slide 52
CSS3 Transitions
Slide 53
Innovation
Slide 54
Add-Ons
Slide 55
Slide 56
Slide 57
Slide 58
Danke! Eric Eggert yatil.de @yatil
