ÿþ<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="en"> <head> <title>Nuevos APIs y formatos</title> <link rel="stylesheet" media="screen,print,projection" href="style.css"> <style> li {list-style-type: none} @media handheld { * { margin: 2px; padding: 2px } .slide {margin-bottom:1em; border: 1px black solid; background:url('operalittle.png')} #first,#FOMS,#op {display:none} head,title {display:block} .fd {display:none}} </style> </head> <body> <div class="slide" id="first"> <h1>Nuevos APIs y Formatos</h1> <h3>Charles McCathieNevile (Chaals)</h3> <p>Chief Standards Officer</p> <p>chaals@opera.com</p> <h3>Opera</h3> <p>La mejora experiencia Internet<br/>Cualquier dispositivo, cualquier lugar</p> <p><a href="http://w3c.es"><img id="FOMS" alt="W3C España" src="w3c.png"/></a> <a href="http://www.opera.com"><img id="op" alt="Opera Software" src="operalittle.png"/></a></p> </div> <div class="slide"> <h1>Opera hace Navegadores</h1> <ul> <li>La Web en todos dispositivos</li> <li>Opera Mobile/Mini, Ordenador, Wii, ...</li> <li>Toda la Web en cualquier aparato</li> <li>Inovación y Estandares</li> </ul> </div> <div class="slide"> <h1>Temas</h1> <ul> <li>Los APIs: ¿Qué y para qué?</li> <li>¿Qué APIs y formatos<br /> - Y cómo <strong>me</strong> ayudan?</li> <li>¿Qué hago ahora?</li> </ul> </div> <div class="slide"> <h1>Los APIs</h1> <p>Interfaz de Programación para Aplicaciones</p> <ul> <li>Aplicaciones están desarollado para la Web</li> <li>Librerias de código Javascript</li> <li>¿Cómo aprovechar del dispositivo?</li> <li>Reduce los recursos usadas (pilas, CPU, etc)</li> </ul> </div> <div class="slide"> <h1>XMLHttpRequest</h1> <p>(La 'X' de 'Ajax')</p> <ul> <li>Una pagína puede usar la red</li> <li>Ahorra consumo al reducir el tráfico</li> <li>En versión borreador del W3C</li> <li>Funciona en los móviles</li> <li>Version 2: Acceso a través de los dominios</li> </ul> </div> <div class="slide"> <h1>APIs Coleccionadas</h1> <dl> <dt>Eventos Progreso</dt> <dd>¿Qué pasa en la red?</dd> <dt>Clipboard APIs</dt> <dd>Copia/Pega, Arrastra/Suelta</dd> <dd>Utilizadas en interfaces reales</dd> <dt>Selectors, ElementTraversal</dt> <dd>Simplificar manipulación del DOM</dd> </dl> </div> <div class="slide"> <h1>Acceso al dispositivo</h1> <dl> <dt>Localización</dt> <dd>¿Dónde está el usuario?</dd> <dd>Seguridad: ¿Quién quiere saber?</dd> <dt>Ficheros reales, Agenda, etc</dt> <dd>Usar tu información</dd> <dt>Cámara, llamadas, SMS, ...</dt> <dd>Usar capacidades del dispositivo</dd> </dl> </div> <div class="slide"> <h1>ARIA</h1> <ul> <li>Hacer aplicaciones más accesibles</li> <li>Hacer interfaces reales y potentes</li> <li>En desarollo en el W3C</li> <li>Funciona ya en Opera 9.5, IE8, FF3</li> <li>Permite remplazar elementos de la interfaz</li> </ul> </div> <div class="slide"> <h1>SVG</h1> <h2>Scalable Vector Graphics</h2> <p>Riqueza visual con interactividad</p> <object data="clock.svg" class="right"></object> <ul> <li>Usado 7 años en "plugins"</li> <li>Ahora en navegadores (y 250.000.000 móviles)</li> <li>Desarollo rápido y fácil</li> <li>Interfaces que se adaptan mejor</li> </ul> </div> <div class="slide"> <h1>Widgets</h1> <ul> <li>Aplicaciones reales en la Web</li> <li>Ahorra tiempo - está instalado</li> <li>El usuario guarda sus datos</li> <li>Desarollo barato con tecnología Web</li> <li>¡Haz un fondo de pantalla útil!</li> </ul> </div> <div class="slide"> <h1>HTML5</h1> <ul> <li><code>input type="date"</code> para <input type="date"></li> <li>Mejorando accesibilidad con ARIA</li> <li>Documentos con MathML, SVG</li> <li>Explica lo que realmente funciona<br> - (pero es un trabajo difícil)</li> </ul> </div> <div class="slide"> <h1>Javascript</h1> <ul> <li><Strong>El Lenguaje</strong> de la Web</li> <li>ECMAScript 4 lo mejorará<br /> - optimizado, más potente...</li> <li>Mini pone javascript en aparatos baratos</li> </ul> </div> <div class="slide"> <h1><a href="torture.xhtml">Ejemplo - MathML</a></h1> <ul> <li>Matemática en la Web</li> <li>Un perfil que sirve al 80%</li> <li>Implantarlo con CSS, SVG, XML</li> <li>Funcionara en todos dispositivos Opera</li> <li>Aprovecha la arquitectura del W3C</li> </ul> </div> <div class="slide" id="last"> <h1>Gracias</h1> <h3>chaals@opera.com</h3> <p>&nbsp;</p> <h3>No hay preguntas tontas<br/>Hay tontos que no preguntan</h3> </div> </body></html>