Índice Capítulo 1. Documentos HTML5... 1 1.1 Componentes básicos... 1 1.2 Estructura global... 2 <!DOCTYPE>... 2 <html>... 2 <head>... 3 <body>... 4 <meta>... 5 <title>... 6 <link>... 7 1.3 Estructura del cuerpo... 8 Organización... 9 <header>... 12 <nav>... 13 <section>... 14 <aside>... 15 <footer>... 17 1.4 Dentro del cuerpo... 18 <article>... 18 <hgroup>... 22 <figure> y <figcaption>... 24 1.5 Nuevos y viejos elementos... 26 <mark>... 26 <small>... 27 <cite>... 27 <address>... 27 <time>... 28 1.6 Referencia rápida... 28 Capítulo 2. Estilos CSS y modelos de caja... 31 2.1 CSS y HTML... 31 2.2 Estilos y estructura... 32 Elementos Block... 32 Modelos de caja... 33 2.3 Conceptos básicos sobre estilos... 34 Estilos en línea... 34 Estilos embebidos... 35 Archivos externos... 36
Referencias... 37 Referenciando con palabra clave... 37 Referenciando con el atributo id... 38 Referenciando con el atributo class... 39 Referenciando con cualquier atributo... 40 Referenciando con pseudo clases... 41 Nuevos selectores... 45 2.4 Aplicando CSS a nuestra plantilla... 46 2.5 Modelo de caja tradicional... 46 Plantilla... 47 Selector universal *... 49 Nueva jerarquía para cabeceras... 50 Declarando nuevos elementos HTML5... 51 Centrando el cuerpo... 51 Creando la caja principal... 52 La cabecera... 53 Barra de navegación... 54 Section y aside... 55 Footer... 56 Últimos toques... 58 Box-sizing... 59 2.6 Referencia rápida... 60 Selector de atributo y pseudo clases... 61 Selectores... 61 Capítulo 3. Propiedades CSS3... 63 3.1 Las nuevas reglas... 63 CSS3 se vuelve loco... 63 Plantilla... 64 Border-radius... 65 Box-shadow... 67 Text-shadow... 70 @font-face... 71 Gradiente lineal... 72 Gradiente radial... 74 RGBA... 74 HSLA... 75 Outline... 76 Border-image... 76 Transform y transition... 78 Transform: scale... 78 Transform: rotate... 79 Transform: skew... 80
Transform: translate... 81 Transformando todo al mismo tiempo... 81 Transformaciones dinámicas... 82 Transiciones... 83 3.2 Referencia rápida... 84 Capítulo 4. Javascript... 87 4.1 La relevancia de Javascript... 87 4.2 Incorporando Javascript... 88 En línea... 88 Embebido... 89 Archivos externos... 91 4.3 Nuevos selectores... 92 queryselector()... 92 queryselectorall()... 93 4.4 Manejadores de eventos... 95 Manejadores de eventos en línea... 95 Manejadores de eventos como propiedades... 95 El método addeventlistener()... 96 4.5 APIs... 97 Canvas... 98 Drag and Drop... 98 Geolocation... 98 Storage... 98 File... 99 Communication... 99 Web Workers... 100 History... 100 Offline... 100 4.6 Librerías externas... 101 jquery... 101 Google Maps... 101 4.7 Referencia rápida... 102 Elementos... 102 Selectores... 102 Eventos... 102 APIs... 103 Capítulo 5. Video y audio... 105 5.1 Reproduciendo video con HTML5... 105 El elemento <video>... 106 Atributos para <video>... 107
5.2 Programando un reproductor de video... 108 El diseño... 108 El código... 110 Los eventos... 111 Los métodos... 112 Las propiedades... 113 El código en operación... 113 5.3 Formatos de video... 116 5.4 Reproduciendo audio con HTML5... 117 El elemento <audio>... 118 5.5 Programando un reproductor de audio... 119 5.6 Referencia rápida... 120 Elementos... 120 Atributos... 120 Atributos de video... 121 Eventos... 121 Métodos... 121 Propiedades... 122 Capítulo 6. Formularios y API Forms... 123 6.1 Formularios Web... 123 El elemento <form>... 123 El elemento <input>... 124 Tipo email... 124 Tipo search... 125 Tipo url... 125 Tipo tel... 125 Tipo number... 126 Tipo range... 126 Tipo date... 127 Tipo week... 127 Tipo month... 127 Tipo time... 128 Tipo datetime... 128 Tipo datetime-local... 128 Tipo color... 128 6.2 Nuevos atributos... 129 Atributo placeholder... 129 Atributo required... 129 Atributo multiple... 130 Atributo autofocus... 130 Atributo pattern... 130 Atributo form... 131
6.3 Nuevos elementos para formularios... 131 El elemento <datalist>... 132 El elemento <progress>... 132 El elemento <meter>... 132 El elemento <output>... 133 6.4 API Forms... 133 setcustomvalidity()... 133 El evento invalid... 135 Validación en tiempo real... 137 Propiedades de validación... 139 willvalidate... 140 6.5 Referencia rápida... 141 Tipos... 141 Atributos... 141 Elementos... 142 Métodos... 142 Eventos... 143 Estado... 143 Capítulo 7. API Canvas... 145 7.1 Preparando el lienzo... 145 El elemento <canvas>... 145 getcontext()... 146 7.2 Dibujando en el lienzo... 147 Dibujando rectángulos... 147 Colores... 148 Gradientes... 149 Creando trazados... 150 Estilos de línea... 156 Texto... 157 Sombras... 159 Transformaciones... 160 Restaurando el estado... 162 globalcompositeoperation... 163 7.3 Procesando imágenes... 164 drawimage()... 164 Datos de imágenes... 166 Patrones... 169 7.4 Animaciones en el lienzo... 170 7.5 Procesando video en el lienzo... 172 7.6 Referencia rápida... 174 Métodos... 175 Propiedades... 177
Capítulo 8. API Drag and Drop... 179 8.1 Arrastrar y soltar en la web... 179 Nuevos eventos... 179 datatransfer... 182 dragenter, dragleave y dragend... 184 Seleccionando un origen válido... 185 setdragimage()... 187 Archivos... 189 8.2 Referencia rápida... 191 Eventos... 191 Métodos... 192 Propiedades... 192 Capítulo 9. API Geolocation... 193 9.1 Encontrando su lugar... 193 getcurrentposition(ubicación)... 193 getcurrentposition(ubicación, error)... 195 getcurrentposition(ubicación, error, configuración)... 197 watchposition(ubicación, error, configuración)... 199 Usos prácticos con Google Maps... 200 9.2 Referencia rápida... 201 Métodos... 201 Objetos... 202 Capítulo 10. API Web Storage... 203 10.1 Dos sistemas de almacenamiento... 203 10.2 La sessionstorage... 204 Implementación de un sistema de almacenamiento de datos... 204 Creando datos... 206 Leyendo datos... 207 Eliminando datos... 208 10.3 La localstorage... 210 Evento storage... 211 Espacio de almacenamiento... 212 10.4 Referencia rápida... 213 Tipo de almacenamiento... 213 Métodos... 213 Propiedades... 214 Eventos... 214
Capítulo 11. API IndexedDB... 215 11.1 Una API de bajo nivel... 215 Base de datos... 215 Objetos y Almacenes de Objetos... 216 Índices... 217 Transacciones... 218 Métodos de Almacenes de Objetos... 218 11.2 Implementando IndexedDB... 219 Plantilla... 219 Abriendo la base de datos... 220 Versión de la base de datos... 222 Almacenes de Objetos e índices... 223 Agregando Objetos... 223 Leyendo Objetos... 225 Finalizando el código... 225 11.3 Listando datos... 226 Cursores... 226 Cambio de orden... 229 11.4 Eliminando datos... 230 11.5 Buscando datos... 231 11.6 Referencia rápida... 234 Interface Environment (IDBEnvironment y IDBFactory)... 235 Interface Database (IDBDatabase)... 235 Interface Object Store (IDBObjectStore)... 236 Interface Cursors (IDBCursor)... 236 Interface Transactions (IDBTransaction)... 237 Interface Range (IDBKeyRangeConstructors)... 238 Interface Error (IDBDatabaseException)... 238 Capítulo 12. API File... 239 12.1 Almacenamiento de archivos... 239 12.2 Procesando archivos de usuario... 240 Plantilla... 240 Leyendo archivos... 241 Propiedades de archivos... 243 Blobs... 245 Eventos... 246 12.3 Creando archivos... 248 Plantilla... 248 El disco duro... 249 Creando archivos... 251 Creando directorios... 252
Listando archivos... 252 Manejando archivos... 256 Moviendo... 257 Copiando... 259 Eliminando... 260 12.4 Contenido de archivos... 261 Escribiendo contenido... 261 Agregando contenido... 265 Leyendo contenido... 265 12.5 Sistema de archivos de la vida real... 267 12.6 Referencia rápida... 271 Interface Blob (API File)... 272 Interface File (API File)... 272 Interface FileReader (API File)... 272 Interface LocalFileSystem (API File: Directories and System)... 272 Interface FileSystem (API File: Directories and System)... 273 Interface Entry (API File: Directories and System)... 273 Interface DirectoryEntry (API File: Directories and System)... 273 Interface DirectoryReader (API File: Directories and System)... 274 Interface FileEntry (API File: Directories and System)... 274 Interface BlobBuilder (API File: Writer)... 274 Interface FileWriter (API File: Writer)... 274 Interface FileError (API File y extensions)... 275 Capítulo 13.API Communication... 277 13.1 Ajax nivel 2... 277 Obteniendo datos... 278 Propiedades response... 280 Eventos... 280 Enviando datos... 282 Solicitudes de diferente origen... 284 Subiendo archivos... 285 Aplicación de la vida real... 287 13.2 Cross Document Messaging... 291 Constructor... 291 Evento message y propiedades... 291 Enviando mensajes... 292 Filtros y múltiples orígenes... 295 13.3 Web Sockets... 297 Configuración del servidor WS... 298 Constructor... 299 Métodos... 299 Propiedades... 299
Eventos... 300 Plantilla... 300 Iniciar la comunicación... 301 Aplicación completa... 302 13.4 Referencia rápida... 304 XMLHttpRequest Level 2... 304 API Web Messaging... 305 API WebSocket... 306 Capítulo 14. API Web Workers... 307 14.1 Haciendo el trabajo duro... 307 Creando un trabajador... 307 Enviando y recibiendo mensajes... 308 Detectando errores... 311 Deteniendo trabajadores... 312 APIs síncronas... 314 Importando códigos... 315 Trabajadores compartidos... 315 14.2 Referencia rápida... 320 Trabajadores... 320 Trabajadores dedicados (Dedicated Workers)... 321 Trabajadores compartidos (Shared Workers)... 321 Capítulo 15. API History... 323 15.1 Interface History... 323 Navegando la Web... 323 Nuevos métodos... 324 URLs falsas... 325 Siguiendo la pista... 327 Ejemplo real... 329 15.2 Referencia rápida... 332 Capítulo 16. API Offline... 333 16.1 Caché... 333 El archivo manifiesto... 333 Categorías... 334 Comentarios... 335 Usando el archivo manifiesto... 336 16.2 API Offline... 337 Errores... 338 Online y offline... 339 Procesando el caché... 340
Progreso... 342 Actualizando el caché... 344 16.3 Referencia rápida... 346 Archivo manifiesto... 347 Propiedades... 347 Eventos... 347 Métodos... 348 Conclusión... 349 Trabajando para el mundo... 349 Las alternativas... 349 Modernizr... 350 Librerías... 351 Google Chrome Frame... 352 Trabajando para la nube... 352 Recomendaciones finales... 354