Mozilla y el desarrollo del web para todos. Percy Cabello percy@mozilla.pe

Transcripción

1 Mozilla y el desarrollo del web para todos Percy Cabello percy@mozilla.pe

2 La web Breve historia 1990: Tim Berners-Lee une por primera vez Internet y el hipertexto: HTML, HTTP. 1993: Mosaic : Netscape : Java para la web, con HotJava 1995: Apache Server 1995: PHP

3 La web Breve historia 1995: Microsoft lanza Internet Explorer, basado en la versión de Mosaic de Spyglass. Inician las Browser Wars I 1995: Brendan Eich inventa JavaScript (ECMAScript) 1999: RSS 2000: XMLHttpRequest (XHR, base de AJAX) 2010: aproximadamente 120 millones de sitios web en operación, 1800 millones de usuarios

4 La misión de Mozilla Fomentar la innovación y capacidad de elección en Internet.

5 La misión de Mozilla Eliminar barreras de acceso: Impedimentos fisicos Dispositivos idioma

6 La misión de Mozilla Firefox Un navegador web concebido para el usuario Más seguro: Código abierto Rápida solución a vulnerabilidades Plugins actualizados Extensible: más de extensiones y personas Para Linux, Windows y Mac OS X en más de 70 idiomas Actualmente entre 25-30% de usuarios

7

8 La misión de Mozilla Firefox Soporta los estándares web

9 Estándares web SVG Scalable Vector Graphics Language Lenguaje XML para vectores 2D: polígonos, textos, colores, patrones, gradientes, filtros y +.

10 Estándares web: SVG <radialgradient id="svgid_1_" cx=" " cy=" " r=" " gradienttransform="matrix( )" gradientunits="userspaceonuse"> <stop offset="0" stop-color="#000000" stop-opacity="0.502"/> <stop offset="1" stop-color="#000000" stop-opacity="0"/> </radialgradient> <path fill="url(#svgid_1_)" d="m , c0, , ,46.893c51.795, s , c , , , , , z"/> <radialgradient id="svgid_2_" cx=" " cy=" " r=" " gradienttransform="matrix( )" gradientunits="userspaceonuse"> <stop offset="0" stop-color="#000000" stop-opacity="0.502"/> <stop offset="1" stop-color="#000000" stop-opacity="0"/> </radialgradient> <path fill="url(#svgid_2_)" d="m , c0, , ,46.892c53.188, c , , c151.51, , , , , z"/> <g> <path d="m , c-4.752, , ,78.48c , , , c c , ,6.12c-15.12, c , c , , c , , c , c , , c3.744,2.016,11.376,5.904,17.064, c5.688,6.696,10.8,16.848,13.68,29.664c5.904, ,17.208,4.248,46.656c6.624,29.375,20.088,43.775,36.504, C , , ,224.43, , z"/> <g> <path fill="#666666" d="m148.47,94.049c , , c , , c c c-1.872, , ,6.192 c-1.08, , ,8.568c0.216,8.496,0.505,11.736,2.448,17.496c ,92.178, ,95.706,148.47,94.049z"/> <g>

11 Estándares Web ARIA Accessible Rich Internet Applications Permite normalizar widgets para que sean accesibles por software de asistencia.

12 Estándares Web <ul role="group" class="expanded"> <li role="treeitem" tabindex="-1"> <a tabindex="-1" href="javascript:show('show1', 'Fruit: Oranges')" aria-controls="show1">oranges</a> </li> <li role="treeitem" tabindex="-1"> <a tabindex="-1" href="javascript:show('show1', 'Fruit: Pineapples')" aria-controls="show1">pineapples</a> </li> <li role="treeitem" tabindex="-1" aria-expanded="false" arialabelledby="fruit300">

13 Estándares Web HTML5 DOM Storage <audio> y <video> nativo Geolocalización <canvas> Web workers (JavaScript) XForms

14 Estándares Web Geolocalización Permite acceder a la ubicación física del usuario. function showposition(position) { alert(position.coords.latitude + + position.coords.longitude); } navigator.geolocation.getcurrentposition(showposition);

15 Estándares Web Video nativo + Theora Theora: Firefox, Chrome, Opera H.264: Safari, Chrome

16 Integrando la web y el navegador Jetpack Provee una API y una arquitectura poderosas que permiten extender la funcionalidad de Firefox con código muy compacto, fácilmente editable y que no requiere reiniciar Firefox.

17 Integrando la web y el navegador Ubiquity Incorpora una línea de comando en Firefox para realizar tareas complejas en una sola instrucción.

18 Integrando la web y el navegador Bespin Es un editor de texto basado en el web orientado a la colaboración. Extensible para soportar diferentes lenguajes de programación.

19 Integrando la web y el navegador Weave Plataforma para cloud computing: Weave Server Weave Sync

20 Integrando la web y el navegador Prism Permite escritorizar aplicaciones web: Aplicaciones por defecto Accesos directos Minimizar en la bandeja de sistema etc.

21 Integrando la web y el navegador

22 Extensiones para desarrolladores Firebug Depuración avanzada JavaScript Revisión y edición de CSS Monitoreo de tráfico de red Navegación del DOM Extensible

23

24 Extensiones para desarrolladores Selenium Automatización de pruebas de aplicaciones web. Exporta código como unit tests en PHP, Java, C, C++, Ruby, Python, Perl y otros. Pruebas pueden ser reproducidas automáticamente en Firefox, Chrome e Internet Explorer.

25 Extensiones para desarrolladores

26 Extensiones para desarrolladores Web Developer Toolbar Una barra de herramientas con docenas de pequeñas utilidades para validar código, mostrar detalles de imágenes y formularios, jugar con CSSs, entre otros.

27 Extensiones para desarrolladores ColorZilla permite identificar cualquier color de una página web y generar paletas automáticamente.

28 Extensiones para desarrolladores FirePHP

29 addons.mozilla.org

30 Preguntas