Curso de creación de webApps con HTML5, CSS3 y JavaScript (para diseñadores)

¿Qué voy a aprender?

Construir aplicaciones web de trabajo para el iPhone, utilizando HTML y CSS Web
Aprender lo que es una aplicación web móvil es y cómo se diferencia de una aplicación nativa para el iPhone
Crear gestos y animación usando JavaScript y las bibliotecas de la IIU y jQTouch
Integrar tu aplicación web con las funciones del iPhone varias
Crear sencillas aplicaciones para el iPhone nativo utilizando el TapLynx biblioteca sin necesidad de programación!
Aprenda a construir en su nuevas habilidades de desarrollo de aplicaciones web para el iPhone

¿Quién debe asistir?

Los diseñadores Web y desarrolladores que quieran crear aplicaciones para el iPhone

Conocimientos previos:

No son necesarios tener conceptos de programación aunque si requerimos que el alumno tenga conocimientos de  HTML y CSS .  Si necesitas primero este curso visita el siguiente enlace : Curso de Dreamweaver CS5.5 (HTML5 y CSS3)

Introducción: webApps para dispositivos iOS

Dispositivos iOS
WebApps vs. aplicaciones nativas
Safari-mobile
Lenguajes soportados
Importación de archivos y hyperlink soportados para dispositivos iOS

Testeo y emulación (probar tu webApp desde):
tu mac: Simulador iOS
dispositivos iOS (iPad, iPhone…)

Viewport
WebClip: icono de la webApp, personalizado en la pantalla de inicio
Ocultar interficie mobile-Safari
Smart-image (imagen de apertura)

HTML5:
Audio: Herramientas de conversión y formatos soportados. Interactividad con javaScript.
Video: Herramientas de conversión y formatos soportados. Edición básica. Medias condicionales para dispositivos de distintos anchos de pantalla
Etiquetas semánticas
Importación de archivos vectoriales .svg
Geolocalización
Almacenamiento local Manifest cache(trabajo offline)
Formularios (tags y protocolos) teclados virtuales

CSS3 -webkit:
Opacidad, degradados, cantos redondeados, sombras (para objetos y texto)
Imágenes con máscaras y reflexiones (sólo para safari)
Medias condicionales CSS3: detección de anchos de pantalla

Tipografía:
Fuentes para dispositivos iOS: nativas + importación de archivos de fuentes
Tamaño fuentes: relativo vs. absoluto, problema de dispositivos con distintas resoluciones.
Efectos con texto: puntos suspensivo dinámicos en texto desbordado
Multi-columnas de texto (medianil, corondel)

Animación:
Transformaciones, transiciones, y animación 2D y 3D (sin y con interactividad javaScript)
Adobe Edge (introducción): Permite generar animaciones, (html5, css3, y javaScript) soportadas nativamente por dispositivos iOS, sin picar código, con una interficie gráfica similar a After Effects.
-Instalación, requerimientos, interficie
-Animación
-Animación con interactividad simple
-Animar contenido web ya existente


Eventos javaScript: de toque y de gesto
Herramientas online:
Librerias online
Convertir webApp en una aplicación nativa

jQuery Mobile


Definición. Requerimientos. Compatibilidad.

Descarga (documentación). CDN vs. local

Plantillas de DreamWeaver

Sintaxis de atributos (data-role). Soportado por sugerencias de código DreamWeaver cs5.5

Temas de color

Navagación
botones básicos
páginas internas del mismo archivo
hipervínculos absolutos
hipervínculos relativos
transiciones: tipos de animaciones al hacer un link entre páginas
páginas en modo cuadros de diálogo


Eventos jQuery Mobile

Barras cabecera y pie
botones dentro de la cabecera
botones dentro del pie
fijar cabecera y pie
pie persistente


Elementos de interficie
iconos para botones y posición
panel expandir-contraer (acordeón)
cuadrículas y columnas

Formularios
campos de texto
deslizador-rango
deslizador-conmutador
menús agrupados: selección simple y múltiple
cuadros de verificación y botones de radio
modos de envio

Listas (con hipervínculos)
listas agrupadas
listas anidadas
divisores de lista
botones dobles
elementos dentro de lista:
imágenes miniatura
burbuja de contenido
contenido relacionado
iconos de imagen
campo de texto buscar