Creación, programación y diseño de páginas web con HTML5 y CSS3

Contenidos

• Introducción a la programación web
• Introducción.
• Introducción a la programación web:
• Acceder a un sitio web.
• La evolución de la web.
• Estándares web:
• La World Wide Web (www) antes de los estándares.
• Por qué debemos seguir contribuyendo a la mejora y el uso de los estándares web.
• Quién crea los estándares web.
• El proyecto de estándares web.
• Cómo se establecen los estándares web en la actualidad.
• Cómo utilizar los estándares web.
• HTML5:
• La historia de HTML.
• Funcionamiento de HTML.
• Evolución y versiones de HTML.
• Características de HTML.
• Ventajas y desventajas de HTML.
• CSS3:
• Versiones del CSS.
• JavaScript:
• Historia.
• Qué puede hacer JavaScript en el navegador.
• Qué no puede realizar JavaScript en el navegador.
• Resumen.

• Fundamentos de JavaScript. Introducción a JavaScript
• Introducción.
• La etiqueta (script):
• Atributos de la etiqueta (script).
• Incluir la etiqueta script en un documento HTML.
• Contenido alternativo.
• Variables:
• Ámbito de las variables.
• Tipos de datos.
• Operadores.
• Cuadros de diálogo.
• Resumen.

• Fundamentos de la programación
• Introducción.
• Estructuras de decisión:
• Condicional simple, condicional if.
• Condicional con alternativa, condicional if/else.
• Condicional múltiple.
• Condicional ternario.
• Condicional Switch.
• Expresiones lógicas:
• AND
• OR
• NOT
• Estructuras de repetición:
• for.
• while.
• do… while.
• Definir funciones:
• Declarar una función.
• Llamar funciones.
• Parámetros.
• Devolución de valores.
• Ámbito de las variables.
• Resumen.

• Objetos y arrays en JavaScript
• Introducción.
• Los objetos:
• Declarar un objeto.
• La jerarquía de objetos.
• Propiedades:
• Acceder a las propiedades.
• Función constructora.
• Métodos:
• Llamar a un método.
• Captadores (getters) y establecedores (setters).
• Arrays:
• Asignar valores a un array.
• Acceder a los elementos de un array.
• Iterar un array.
• Métodos de array.
• Array multidimensional.
• Resumen.

• Los objetos location e history
• Introducción.
• ¿Qué es una URL?
• Estructura de una URL.
• URL absoluta, URL relativa.
• El objeto location:
• Propiedades.
• Métodos.
• El objeto history:
• Actualizando la dirección.
• State y popstate.
• Resumen.

• El objeto document
• Introducción.
• La propiedad title.
• El método write:
• El método writeIn.
• El conjunto imágenes.
• Propiedades del objeto document.
• Resumen.

• El objeto form
• Introducción.
• Formularios HTML.
• El conjunto de forms.
• La propiedad elements.
• Validar la información:
• ¿Cuándo realizar la validación?
• Tipos de validación.
• Validación JavaScript.
• Otras propiedades y métodos.
• Resumen.

• Modelo de objetos del documento (dom)
• Introducción.
• El árbol del documento.
• Tipos de nodos y relaciones.
• Obtener elementos.
• Obtener y establecer atributos.
• Resumen.

• Manipulación del dom
• Introducción.
• Recorrer el árbol del documento.
• Modificar el valor de los nodos.
• Crear, eliminar y reemplazar nodos:
• Crear nodo.
• Eliminar nodo.
• Reemplazar un nodo.
• El método innerHTML.
• Modificar el formato dinámicamente.
• Resumen.

HTML

• Introducción.
• HTML5 Y CSS3:
• La estructura de las etiquetas.
• Los atributos de una etiqueta.
• Estructura HTML.
• HTML5.
• CSS3.
• Elementos estructurales HTML5:
• El esquema del documento.
• Descripción de los elementos estructurales HTML5.
• Elementos de contenido.
• El atributo role.
• Tipos de atributos.
• Los comentarios.
• Doctype de HTML5.
• Resumen.

• Trabajando con esquemas HTML5
• Introducción.
• Aplicar elementos estructurales HTML5:
• El encabezado.
• La barra de navegación.
• El contenido principal.
• La barra lateral.
• El pie de página.
• Estructura completa.
• Evitando elementos div:
• La divitis.
• Razones para no utilizar el elemento div.
• Cómo evitar el uso del elemento div.
• Nuevos elementos HTML5 para evitar el elemento div.
• Elementos article anidados:
• Qué es la anidación.
• Anidando la etiqueta article.
• Modificar las hojas de estilos en cascada:
• Inicios del CSS.
• Incluir estilos CSS.
• Sintaxis del documento CSS
• Aplicar estilos a los elementos estructurales HTML5:
• Selectores.
• Unidades de medida.
• Colores y fondo.
• Texto.
• Listas.
• Tablas.
• Modelos de cajas.
• Pseudoclases y pseudoelementos.
• Posicionamiento del contenido.
• Otros.
• Resumen.

• Formularios HTML5
• Introducción.
• Funcionamiento de los formularios:
• Envío de información a los servidores.
• Funcionamiento de los formularios en el navegador.
• Controles de formulario:
• Definición de un formulario y sus controles.
• Definición de los controles de formulario.
• Atributos de formulario:
• Checkbox.
• Radiobutton.
• Botón de envío.
• Botón de reseteo.
• Ficheros adjuntos.
• Campos ocultos.
• Botón de imagen.
• Botón.
• Campos de texto.
• Listas desplegables.
• Eventos de formulario.
• Nuevos controles de formulario:
• Email
• Search
• Url
• Tel
• Number
• Range
• Date
• Month
• Week
• Time
• Datetime-local
• Color
• Nuevos atributos:
• Placeholder.
• Autocomplete.
• Autofocus.
• Form.
• Formaction.
• Formentype.
• Formmethod.
• Formnovalidate.
• Formtarget.
• Height y width.
• List.
• Min y max.
• Multiple.
• Novalidate.
• Pattern.
• Required.
• Step.
• Compatibilidad con navegadores antiguos.
• Resumen.

• Vídeo y audio en HTML5
• Introducción.
• Reproducción sin plugin.
• La etiqueta (vídeo):
• Atributo src.
• Atributo width y height.
• Atributo controls.
• Atributo loop.
• Atributo poster.
• Atributo preload.
• Atributo mediagroup.
• Atributo autoplay.
• Atributo muted.
• Vídeo avanzado.
• Formatos y códecs de vídeo:
• Formatos de vídeo.
• La etiqueta (audio):
• Atributo src.
• Atributo autoplay.
• Atributo preload.
• Atributo controls.
• Atributo loop.
• Atributo muted.
• Atributo mediagroup.
• Etiqueta source.
• Códecs de audio.
• API multimedia:
• Propiedades del objeto multimedia.
• Métodos del objeto multimedia.
• Eventos para el objeto multimedia.
• Ejemplo de un reproductor de vídeo utilizando la API multimedia.
• Ejemplo de un reproductor de audio utilizando la API multimedia.
• Resumen.

• Dibujar con el elemento canvas
• Introducción.
• La etiqueta canvas.
• Una interfaz de dibujo 2D.
• Dibujar trazados.
• Estilos de línea.
• Dibujar rectángulos.
• Dibujar texto.
• Dibujar imágenes.
• Colores de trazo y relleno.
• Gradientes.
• Patrones.
• Resumen.

• Introducción a CSS3
• Introducción.
• La evolución que representa CSS3.
• Nuevos selectores CSS3:
• Prefijos para navegadores.
• Esquinas redondeadas y sombras.
• Colores:
• Propiedad opacity.
• Propiedad rgba.
• Propiedad hsla.
• Gradientes de colores:
• Tipos de degradado.
• Incrustación de fuentes.
• Dónde obtener fuentes.
• Múltiples imágenes de fondo.
• Transiciones.
• Transformaciones.
• Resumen.

• Buenas prácticas
• Introducción.
• Separar la estructura del contenido.
• Añadir los manejadores de eventos:
• Como atributo de elementos HTML.
• Como función externa.
• De forma semántica.
• El objeto event.
• Detectar características de los navegadores.
• Ejemplo: la estructura de una página.
• Ejemplo: una galería fotográfica.
• Ejemplo: el código JavaScript.
• Resumen.

Otros cursos de informática

Ver todos los cursos de informática