La descarga está en progreso. Por favor, espere

La descarga está en progreso. Por favor, espere

Tema 7: XML y la Internet móvil: WML Ricardo Eíto Brun Sevilla, 23 - 25 de octubre, 2002.

Presentaciones similares


Presentación del tema: "Tema 7: XML y la Internet móvil: WML Ricardo Eíto Brun Sevilla, 23 - 25 de octubre, 2002."— Transcripción de la presentación:

1 Tema 7: XML y la Internet móvil: WML Ricardo Eíto Brun Sevilla, de octubre, 2002

2 Guíon del tema Internet… móvil Internet… móvil WAP WAP El lenguaje WML El lenguaje WML CaracterísticasCaracterísticas MarcasMarcas WMLScriptWMLScript Crear páginas WML Emuladores WML xHTML, cHTML y WML PALM

3 Qué es WAP Wireless Application Protocol Wireless Application Protocol Estandar de facto cuyo objetivo es acceder a contenidos Internet desde dispositivos móviles – sin cable -.Estandar de facto cuyo objetivo es acceder a contenidos Internet desde dispositivos móviles – sin cable -. Define un protocolo para el diseño de aplicaciones web que permitan acceder a servicios y contenidos desde dispositivos móvilesDefine un protocolo para el diseño de aplicaciones web que permitan acceder a servicios y contenidos desde dispositivos móviles Un protocolo más en la familia de protocolos InternetUn protocolo más en la familia de protocolos Internet Está diseñado para micro-browsers con las limitaciones:Está diseñado para micro-browsers con las limitaciones: Presentación de información en pantalla Presentación de información en pantalla Ancho de banda Ancho de banda Límites en memoria y capacidad de computación de los dispositivos clientes Límites en memoria y capacidad de computación de los dispositivos clientes

4 Qué es WAP El estándar WAP incluye las especificaciones: El estándar WAP incluye las especificaciones: WTAI – Wireless Telephony Application InterfaceWTAI – Wireless Telephony Application Interface WML – Wireless Markup Language -, que define el lenguaje que se tiene que utilizar para crear contenidos y su DTDWML – Wireless Markup Language -, que define el lenguaje que se tiene que utilizar para crear contenidos y su DTD WBXML – WAP Binary XML Format -, que describe cómo codificar y transferir documentos WMLWBXML – WAP Binary XML Format -, que describe cómo codificar y transferir documentos WML WMLScript – versión simplificada de JavaScript, para interactuar con los contenidos WMLWMLScript – versión simplificada de JavaScript, para interactuar con los contenidos WML Estas especificaciones se agrupan en una especificación WAE – Wireless Application Environment -.Estas especificaciones se agrupan en una especificación WAE – Wireless Application Environment -.

5 Origen de WAP WAP Forum se encarga de su desarrollo WAP Forum se encarga de su desarrollo Formado por Ericsson, Nokia, Motorola y Unwired Planet en 1998 Formado por Ericsson, Nokia, Motorola y Unwired Planet en 1998 La versión 2.0 supuso importantes cambios en la creación y marcado de contenidos para dispositivos WAP La versión 2.0 supuso importantes cambios en la creación y marcado de contenidos para dispositivos WAP Aplicaciones WAP: Aplicaciones WAP: Compra de billetes, entradas, etc. (mCommerce)Compra de billetes, entradas, etc. (mCommerce) Servicios de directorio, direcciones, números de teléfono, etc.Servicios de directorio, direcciones, números de teléfono, etc. Consultas de información específicasConsultas de información específicas

6 Arquitectura WAP

7 El proceso de comunicación entre el dispositivo WAP y el servidor Web que ofrece los contenidos se puede resumir de la siguiente forma: El proceso de comunicación entre el dispositivo WAP y el servidor Web que ofrece los contenidos se puede resumir de la siguiente forma: El dispositivo móvil establece una conexión con la estación base, e inicia la conexión a una pasarela WAP preestablecidad en la configuración del teléfono. El dispositivo móvil establece una conexión con la estación base, e inicia la conexión a una pasarela WAP preestablecidad en la configuración del teléfono. El microbrowser solicita una URL a la pasarela WAP, mediante una petición codificada y comprimida en un formato binario WTP. El microbrowser solicita una URL a la pasarela WAP, mediante una petición codificada y comprimida en un formato binario WTP. La pasarela WAP recibe la petición, y la traduce a una petición HTTP, que envía a través de Internet al servidor adecuado. La pasarela WAP recibe la petición, y la traduce a una petición HTTP, que envía a través de Internet al servidor adecuado. El servidor web recibe la petición y como resultado envía una página con datos WML a la pasarela WAP mediante HTTP El servidor web recibe la petición y como resultado envía una página con datos WML a la pasarela WAP mediante HTTP La pasarela WAP recibe la página WML, la comprime a un formato binario optimizado, que reenvía al dispositivo móvil mediante el protocolo WTP. La pasarela WAP recibe la página WML, la comprime a un formato binario optimizado, que reenvía al dispositivo móvil mediante el protocolo WTP. El microbrowser decodifica la señal recibida, y muestra la página. El microbrowser decodifica la señal recibida, y muestra la página.

8 Lenguajes de marcas Internet móvil WML WML cHTML o Compact HTML, utilizado en el servicio i- Mode de NTT DoCoMo. Subconjunto de HTML que se distribuye desde servidores web convencionales. cHTML o Compact HTML, utilizado en el servicio i- Mode de NTT DoCoMo. Subconjunto de HTML que se distribuye desde servidores web convencionales. Web Clipping – este lenguage se utiliza con PDA Palm OS. Subconjunto de la versión 3.2 de HTML. Se distribuye compilado en un formato binario propietario de Palm. Web Clipping – este lenguage se utiliza con PDA Palm OS. Subconjunto de la versión 3.2 de HTML. Se distribuye compilado en un formato binario propietario de Palm. HDML –es el predecesor de WML, y fue diseñado por Openwave. Desde que Openwave se unión al WAP Forum, el lenguaje HDML ha sido reemplazado progresivamente por WML, si bien hoy en día un número elevado de teléfonos móviles en los Estados Unidos utilizan este lenguaje. HDML –es el predecesor de WML, y fue diseñado por Openwave. Desde que Openwave se unión al WAP Forum, el lenguaje HDML ha sido reemplazado progresivamente por WML, si bien hoy en día un número elevado de teléfonos móviles en los Estados Unidos utilizan este lenguaje.

9 El lenguaje WML Es un lenguaje de marcas basado en XML Es un lenguaje de marcas basado en XML Especifica cómo crear contenidos para dispositivos WAP Especifica cómo crear contenidos para dispositivos WAP WAP Forum lo diseñó y se encarga de su mantenimiento WAP Forum lo diseñó y se encarga de su mantenimiento Similar a HTML Similar a HTML Futuro incierto ¿wml, xhtml, chtml? Futuro incierto ¿wml, xhtml, chtml?

10 Decks y cards Una página WML es similar a un documento HTML. Una página WML es similar a un documento HTML. Son archivos con extensión.wml, a los que se llama decks. Son archivos con extensión.wml, a los que se llama decks. Cada deck puede contener una o más cards, unidas entre sí mediante enlaces Cada deck puede contener una o más cards, unidas entre sí mediante enlaces Un card es lo que se ve en la pantalla del dispositivo WAP Un card es lo que se ve en la pantalla del dispositivo WAP Los decks se distribuyen en un formato comprimido Los decks se distribuyen en un formato comprimido Balance entre el número de cards en cada deck Balance entre el número de cards en cada deck Se pueden introducir comentarios con Se pueden introducir comentarios con

11 Estructura decks WML ……………………………………………………

12 El elemento card Identifica lo que se ve en cada pantalla del micro-browser Identifica lo que se ve en cada pantalla del micro-browser Tiene dos atributos: Tiene dos atributos: id – identificador único para cada cardid – identificador único para cada card title – título que se muestra en la pantalla del dispositivo WAPtitle – título que se muestra en la pantalla del dispositivo WAP Un card puede contener: Un card puede contener: TextoTexto Imágenes en formato WBMPImágenes en formato WBMP EnlacesEnlaces Elementos de formulariosElementos de formularios TareasTareas

13 Elemento card Reserva Reserva Consulta OPAC Consulta OPAC

14 WML - Elementos básicos

...

Párrafos Saltos de línea ...Negrita ...Subrayado ...Cursiva ...Cursiva Negrita ... Letra grande ... Letra pequeña

15 WML – Elementos básicos

Reserva

Consulta OPAC Consulta OPAC

Dirección

Telefono

Personal


16 WML - Tablas El modelo de tablas es similar al que HTML El modelo de tablas es similar al que HTML El elemento table determina la aparición de una tabla.El elemento table determina la aparición de una tabla. El elemento table no puede ser hijo directo del elemento cardEl elemento table no puede ser hijo directo del elemento card El elemento table tiene un atributo obligatorio, columnsEl elemento table tiene un atributo obligatorio, columns El atributo columns determina el número de columnas en la tabla.El atributo columns determina el número de columnas en la tabla. Para cada fila, el elemento table contendrá un elemento trPara cada fila, el elemento table contendrá un elemento tr Para cada celda en cada fila, el elemento tr contendrá un elemento tdPara cada celda en cada fila, el elemento tr contendrá un elemento td

17 WML – Tablas

Madrid
Barcelona


18 WML – Enlaces hipertexto Se incluyen dos posibilidades: Se incluyen dos posibilidades: Elemento anchorElemento anchor Elemento aElemento a Elemento anchor Elemento anchor Elemento no vacíoElemento no vacío Incluirá un elemento vacío: go – ir a cualquier URL -, prev – ir a la card anterior -, o refresh – refrescar la card actual.Incluirá un elemento vacío: go – ir a cualquier URL -, prev – ir a la card anterior -, o refresh – refrescar la card actual. Elemento a Elemento a Elemento no vacíoElemento no vacío Contiene el texto origen del hiperenlaceContiene el texto origen del hiperenlace Tiene un atributo href que toma como valor la URL del documento WML destinoTiene un atributo href que toma como valor la URL del documento WML destino

19 WML – Enlaces Madrid Madrid Barcelona Barcelona

20 WML – Enlaces

Madrid

Barcelona Barcelona

21 WML - Imágenes Únicamente se acepta un formato de imagen: WBMP Únicamente se acepta un formato de imagen: WBMP Son imágenes en b/n Son imágenes en b/n Se utiliza el elemento vacío img Se utiliza el elemento vacío img El elemento img va acompañado de los atributos obligatorios: El elemento img va acompañado de los atributos obligatorios: src – URL del archivo wbmp con la imagensrc – URL del archivo wbmp con la imagen alt – texto alternativo, para dispositivos WAP que no pueden mostrar imágenesalt – texto alternativo, para dispositivos WAP que no pueden mostrar imágenes

22 WML – Cajas de texto o campos En un card se pueden incluir campos o cajas de texto para la recogida de datos En un card se pueden incluir campos o cajas de texto para la recogida de datos Se utiliza el elemento vacío input. Se utiliza el elemento vacío input. El elemento input tiene dos atributos: El elemento input tiene dos atributos: name – nombre del control o campo. Es obligatorioname – nombre del control o campo. Es obligatorio size – tamaño de la caja de texto o camposize – tamaño de la caja de texto o campo ISBN: ISBN:

23 WML – Cajas de texto o campos ISBN: ISBN: Titulo: Titulo:

24 WML – fieldsets Los campos de un card se pueden agrupar en un elemento fieldset Los campos de un card se pueden agrupar en un elemento fieldset El elemento fieldset tendrá un atributo title, que recogerá un nombre para el grupo de campos. El elemento fieldset tendrá un atributo title, que recogerá un nombre para el grupo de campos.

ISBN: ISBN: Autor: Autor:


25 WML – Opciones (radio button) Se utilizan para que el usuario puede elegir una opción entre varias Se utilizan para que el usuario puede elegir una opción entre varias Se utiliza el elemento select Se utiliza el elemento select El elemento select contendrá un elemento option para cada opción disponible El elemento select contendrá un elemento option para cada opción disponible El elemento option un atributo value, que recoge como valor el valor que habrá seleccionado el usuario si elige esa opción. El elemento option un atributo value, que recoge como valor el valor que habrá seleccionado el usuario si elige esa opción. El elemento option contiene además el texto que se verá a la derecha del botón de opción. El elemento option contiene además el texto que se verá a la derecha del botón de opción.

26 WML – Optiones (radio button)


27 WML – Opciones (check boxes) Se utilizan para que el usuario puede elegir más de una opción entre varias Se utilizan para que el usuario puede elegir más de una opción entre varias Se utiliza el elemento select, con el atributo multiple=true Se utiliza el elemento select, con el atributo multiple=true El elemento select contendrá un elemento option para cada opción disponible El elemento select contendrá un elemento option para cada opción disponible El elemento option un atributo value, que recoge como valor el valor que habrá seleccionado el usuario si elige esa opción. El elemento option un atributo value, que recoge como valor el valor que habrá seleccionado el usuario si elige esa opción. El elemento option contiene además el texto que se verá a la derecha de la casilla de validación El elemento option contiene además el texto que se verá a la derecha de la casilla de validación

28 WML – Optiones (check boxes)

Barcelona Barcelona Madrid-Barajas Madrid-Barajas Granada Granada


29 WML - Timer El elemento vacío timer se utiliza para dejar transcurrir un periodo de tiempo. El elemento vacío timer se utiliza para dejar transcurrir un periodo de tiempo. El elemento timer tiene un atributo value que toma como valor el tiempo que debe transcurrir, expresado en décimas de segundo. El elemento timer tiene un atributo value que toma como valor el tiempo que debe transcurrir, expresado en décimas de segundo. Este elemento está asociado al evento o atributo ontimer del elemento card, que indica qué acción se debe realizar cuando transcurra el tiempo. Este elemento está asociado al evento o atributo ontimer del elemento card, que indica qué acción se debe realizar cuando transcurra el tiempo. La acción consiste, generalmente, en abrir una nueva página o card La acción consiste, generalmente, en abrir una nueva página o card

30 WML – Timer Aconseja un libro… Aconseja un libro…


31 WML - Variables Es posible declarar variables y asignarles valor: Es posible declarar variables y asignarles valor: Mediante el elemento vacío setvarMediante el elemento vacío setvar Mediante el atributo name en listas de opcionesMediante el atributo name en listas de opciones El elemento vacío setvar tiene dos atributos: El elemento vacío setvar tiene dos atributos: name – nombre de la variablename – nombre de la variable value – valor que se le asignavalue – valor que se le asigna Para mostrar el valor de una variable en un card, se utilizará la sintáxis $(nombreVariable) Para mostrar el valor de una variable en un card, se utilizará la sintáxis $(nombreVariable)

32 WML – Variables

Madrid Madrid Barcelona Barcelona

Ha elegido el destino: $(strnombre) Ha elegido el destino: $(strnombre)

33 Ejemplo navegación cards El formulario presenta una lista de opciones con vuelos. El formulario presenta una lista de opciones con vuelos. El usuario selecciona una de ellas, y se salta a otro card que muestra información detallada del vuelo. El usuario selecciona una de ellas, y se salta a otro card que muestra información detallada del vuelo. Alternativa: Alternativa:

34 WML – Ejemplo card 1

Madrid-Barajas Madrid-Barajas Barcelona Barcelona Granada Granada

Aceptar Aceptar

……………

35 WML – Ejemplo card 2 ………… Origen:SevillaDestino:BarcelonaHorarios: LXJV - 09:10 LXJV - 09:10 Precio: pts pts


36 Otros elementos WML Do – ejecuta una acción cuando el usuario selecciona una opción o literal Do – ejecuta una acción cuando el usuario selecciona una opción o literal Postfield – envía información al servidor Postfield – envía información al servidor

37 WMLScript Lenguaje de script que se ejecuta en el dispositivo cliente. Lenguaje de script que se ejecuta en el dispositivo cliente. Versión simplificada de JavaScript Versión simplificada de JavaScript Sirve para validar datos introducidos por el usuario, cálculos, etc. Sirve para validar datos introducidos por el usuario, cálculos, etc. El código es compilado por el WAP Gateway y enviado al cliente El código es compilado por el WAP Gateway y enviado al cliente El código WMLScript no se guarda en los archivos wml, sino en archivos wmls El código WMLScript no se guarda en los archivos wml, sino en archivos wmls En la página wml se incluyen llamadas a las funciones declaradas en el archivo wmls: En la página wml se incluyen llamadas a las funciones declaradas en el archivo wmls:

38 Herramientas WAP Nokia WAP SDK Nokia WAP SDK WinWAP WinWAP MobileDev MobileDev Nokia WML Studio for Macromedia Dreamweaver Nokia WML Studio for Macromedia Dreamweaver Ericsson WAPIDE Ericsson WAPIDE IBM WAPSody IBM WAPSody

39 WML vs XHTML La versión 2.0 de WAP se basa en XHTML Basic en lugar de WML La versión 2.0 de WAP se basa en XHTML Basic en lugar de WML XHTML Basic en la versión de XHTML para dispositivos móviles. XHTML Basic en la versión de XHTML para dispositivos móviles. Así se garantiza: Así se garantiza: la compatibilidad entre dispositivosla compatibilidad entre dispositivos La reutilización de contenidosLa reutilización de contenidos Mejores opciones de presentación - CSSMejores opciones de presentación - CSS I-Mode utilizaba el lenguaje cHTML (HTML compacto), en lugar de WML I-Mode utilizaba el lenguaje cHTML (HTML compacto), en lugar de WML

40 XHTML vs cHTML cHTML no es un estándar del W3C, XHTML sí lo es cHTML no es un estándar del W3C, XHTML sí lo es cHTML no soporta hojas de estilo CSS, XHTML sí. cHTML no soporta hojas de estilo CSS, XHTML sí. cHTML no obliga a que los documentos estén bien formados, XHTML sí. cHTML no obliga a que los documentos estén bien formados, XHTML sí. Elementos en cHTML que no están en XHTML: Elementos en cHTML que no están en XHTML: Tel:Tel:

41 XHTML vs cHTML Elementos en XHTML que no están en cHTML: Elementos en XHTML que no están en cHTML: Atributo styleAtributo style,, y,, y Etc.Etc.

42 Emuladores WAP


Descargar ppt "Tema 7: XML y la Internet móvil: WML Ricardo Eíto Brun Sevilla, 23 - 25 de octubre, 2002."

Presentaciones similares


Anuncios Google