HTML5, CSS3 + JQuery

Transcripción

1 HTML5, CSS3 + JQuery Descripción Es necesario que los desarrolladores y diseñadores web, a la hora de crear sitios web, dominen los lenguajes fundamentales que son el HTML (HyperText Markup Language) y el CSS (Cascading Style Sheets). Esos dos pilares de la concepción de sitios web han llegado en la actualidad a dos versiones excepcionales, HTML5 y CSS3, que en definitiva, están revolucionando la forma de crear sitios web. Objetivo Con este curso descubrirá las nuevas funcionalidades de HTML 5 y las últimas propiedades de CSS 3 para realizar sitios Web multiplataforma. Utilizando las técnicas de última generación como animaciones con javascript, utilización del CANVAS, manejo de audio y video, nuevos componentes y etiquetas, formularios avanzados, visualización en dispositivos móviles (iphone, Androids, ipads), etc. A quien está dirigido Dirigido a diseñadores y desarrolladores web con unos mínimos conocimientos sobre HTML y CSS. Requisitos Conocimientos básicos en informática, es recomendable tener conocimientos previos de HTML y CSS. Duración: 30 horas

2 TEMARIO 1. La creación de sitios Web Los lenguajes La evolución del HTML La evolución del CSS 2. La nueva sintaxis HTML5 El doctype El documento HTML La codificación de caracteres Los scripts Los estilos CSS La sintaxis de los elementos Los elementos obsoletos Los elementos redefinidos Los atributos obsoletos Nuevos elementos Tipos de contenido de los elementos La visualización de los elementos 3. Los elementos de la estructura en HTML5 Los elementos de la estructura en HTML 4 Los elementos de la estructura en HTML5 El atributo semántico role Ejemplos de estructura en HTML5 Técnicas de formato 4. Plantillas web en HTML5 Plantillas para sitios web en HTML5 WordPress y las plantillas HTML5 Joomla y las plantillas HTML5 5. El camino hacia el CSS3 Análisis de la situación Los prefijos para los navegadores Cómo interpretan los navegadores el CSS3 6. Los nuevos sectores de CSS3 Los selectores Los nuevos selectores CSS3 El selector general de elementos adyacentes El selector de atributo La pseudo-clase de vínculo Las pseudo-clases estructurales

3 7. Los estilos de caja en CSS3 Las nuevas propiedades CSS3 El tamaño de las cajas El desbordamiento de contenido Los colores de fondo Situación actual de fondos y bordes Los bordes redondeados Los bordes imaginativos Las sombras Los degradados Los fondos múltiples Otras propiedades del fondo Los generadores CSS3 en línea Ejemplo de una tabla con bordes redondeados Ejemplo de sombra para una página 8. HTML5 y CSS3 aplicado al texto Los elementos de texto obsoletos Los elementos de texto redefinidos Nuevos formatos para el texto Las fuentes tipográficas El tamaño de las tipografías Textos con sombra La tipografía avanzada 9. HTML5 y CSS3 para los formularios Funcionalidad Los métodos de envío El elemento <form> Los nuevos campos La validación de los formularios Las expresiones regulares Las ayudas para los usuarios de un formulario Las pseudo-clases para los formularios La validación de los datos introducidos Crear botones con símbolos Los generadores de botones en línea 10. Las transformaciones CSS3 Situación actual y objetivos La transformación El desplazamiento El cambio de escala La rotación La deformación Aplicar todas las transformaciones Los generadores en línea 11. Las transiciones con CSS3 Situación actual y objetivos Aplicar transiciones Aplicar una transición de desplazamiento Otras propiedades de las transiciones Los generadores en línea

4 12. Las animaciones en CSS3 La creación de una animación Un desplazamiento simple Rotación y transparencia Un formulario que parpadee Una ventana modal 13. Los elementos multimedia: audio y video Insertar audio Insertar video 14. El elemento de diseño Canvas La creación de imágenes bitmap con JavaScript Las técnicas propuestas Dibujar un rectángulo Dibujar un círculo Trazar rayas Trazar bordes Añadir texto Aplicar un degradado Las transformaciones La manipulación de objetos 15. Primeros pasos con jquery El regreso de JavaScript Presentación de jquery Los puntos fuertes de jquery Aplicación de jquery Iniciar un script jquery La primera aplicación jquery La documentación de jquery Herramientas de desarrollo y de depuración 16. Los sectores en jquery Los selectores básicos Los selectores jerárquicos Los filtros jquery básicos Los filtros hijos Los filtros de contenido Los filtros de visibilidad Los filtros de atributo Los selectores y filtros de formularios Los selectores y los caracteres especiales

5 17. Trabajar con los atributos Añadir o eliminar una clase Comprobar la presencia de una clase Cambiar entre dos clases Conocer el valor de un atributo Añadir un atributo y su valor Añadir varios atributos y sus valores Eliminar un atributo Conocer el atributo value Modificar el atributo value 18. Trabajar con las hojas de estilo CSS Acceder a una propiedad de estilo Modificar las propiedades de estilo Asignar las propiedades de estilo El dimensionamiento El posicionamiento 19. Los eventos Los administradores de eventos Métodos o administradores de eventos avanzados Métodos propios de jquery 20. Los efectos Mostrar y ocultar Desplazar verticalmente Hacer un efecto de fundido Cambiar de un efecto a otro Retrasar un efecto Crear una animación 21. Recorrer el DOM Encontrar los hijos Encontrar los padres directos Encontrar todos los padres Encontrar los padres hasta Encontrar los hermanos Encontrar el hermano anterior Encontrar los hermanos anteriores Encontrar los hermanos anteriores hasta Encontrar el hermano siguiente Encontrar los hermanos siguientes Encontrar los hermanos siguientes hasta

6 Encontrar el contenido Encontrar determinados padres Encontrar determinados descendientes Añadir elementos a la selección Una lupa para agrandar las viñetas 22. Trabajar con el DOM Modificar el contenido Insertar en el interior Insertar en el exterior Rodear un elemento Sustituir un elemento Eliminar un elemento Copiar un elemento Algunas aplicaciones 23. Filtrar el DOM El filtrado de los elementos del DOM Encontrar un elemento concreto Encontrar una secuencia de elementos Encontrar un elemento según un criterio Reducir al primer elemento Reducir al último elemento Reducir a un elemento concreto Eliminar un elemento Formar una tabla (Array) de elementos 24. AJAX en jquery Las consultas AJAX abreviadas La consulta AJAX completa Definir una consulta por defecto Los eventos asociados a la consulta Las funciones diferidas Serializar los datos 25. Algunas utilidades Detectar el navegador Evitar los conflictos Iteraciones en jquery 26. Los formularios Los selectores de formularios Los filtros de selección

7 27. Los plug-ins jquery Diseñar un plug-in jquery Usar un plug-in jquery Algunos plug-ins a. Mensajes de alerta b. Bordes redondeados y variados c. Añadir un sombreado d. Arrastrar/soltar (drag and drop) e. Redimensionar las capas f. Un carrusel de imagines g. Un menú de tipo Mac h. La validación de formularios i. Gráficos a partir de una tabla j. Ordenar una tabla de datos 28. jquery con HTML5 y CSS3 jquery y HTML 5 Cuándo utilizar jquery Cuándo utilizar HTML 5 Cuándo utilizar jquery con HTML 5