Curso de HTML5 Accesible con Sublime Text (UF1302) (Programa detallado)

Objetivo

HTML5 constituye la más reciente actualización del lenguaje de marcas HTML, base de la creación de toda página Web. Supone más que una actualización de la tecnología. Establece un nuevo concepto para la creación de portales y aplicaciones Web que combina dispositivos móviles, computación en la nube y trabajo en red, añadiendo mayores y mejores características multimedia y de creación de formularios.

Separar la creación de sitios Web de la posibilidad de que todos podamos utilizarlos y hacerlo de la forma más fácil e intuitiva, es el objetivo de este curso: aprender la tecnología fundamental para crear páginas Web de forma accesible y usable, con uno de los editores más potentes y flexibles, Sublime Text.

El contenido de este curso se ha estructurado siguiendo el programa establecido en la UF1302 "Creación de páginas web con el lenguaje de marcas", perteneciente al Certificado de Profesionalidad: "Confección y Publicación de Páginas Web".

Dirigido a:

Este curso va dirigido a cualquier persona que desee actualizar sus conocimientos sobre la creación de páginas Web con la última versión del estándar HTML, con conocimientos básicos de informática. Este curso afianzará y actualizará los conocimientos de tanto desarrolladores como diseñadores de páginas Web.

Requisitos:

Para poder realizar este curso es recomendable tener conocimientos informáticos básicos, por ejemplo: manejo de archivos y carpetas e instalación de programas, en cualquier sistema operativo: Windows, Linux o Mac OS.

PROGRAMA DEL CURSO

1.- Los lenguajes de marcas: Tipos y características

Objetivo

Conocer qué es un lenguaje de marcas, ejemplos y aplicaciones de lenguajes existentes, y qué software podemos utilizar para editar documentos creados con dichos lenguajes.

Contenido

  1. UA1 - Los lenguajes de marcas: Tipos y características
    1. Introducción
    2. Mapa conceptual
    3. Características de los lenguajes de marcas
    4. Hemos aprendido
  2. Ejercicios
    1. Ejercicio. Definición de etiquetas.

2.- Los lenguajes de marcas: Estructura de una Web y navegadores

Objetivo

  • Aprender qué etiquetas y propiedades tiene HTML5 y confeccionar páginas Web teniendo en cuenta sus especificaciones técnicas.
  • Saber crear la estructura de una página Web creada con HTML5 a través de sus secciones más importantes: cabecera y cuerpo del documento.
  • Identificar las etiquetas necesarias para crear o incorporar estilos CSS y programas JavaScript.
  • Conocer qué navegadores Web tenemos a nuestra disposición, sus características más importantes y ejemplos de navegadores en modo texto.

Contenido

  1. UA2 - Los lenguajes de marcas: Estructura de una Web y navegadores
    1. Introducción
    2. Mapa conceptual
    3. Estructura de un documento creado con lenguaje de marcas
    4. Navegadores Web
    5. Hemos aprendido
  2. Ejercicios
    1. Ejercicio. Estructura de una página Web.

3.- Los lenguajes de marcas: Formateo del texto y enlaces

Objetivo

  • Describir las etiquetas y atributos que se utilizan para dar formato al documento, aplicar tipografía y definir colores, así como para presentar información de listas.
  • Conocer las etiquetas y atributos que se utilizan para insertar enlaces y direccionamientos, tanto dentro de la página Web como a otros documentos y páginas ubicados en cualquier destino.

Contenido

  1. UA3 - Los lenguajes de marcas: Formateo del texto y enlaces
    1. Introducción
    2. Mapa conceptual
    3. Marcas para dar formato al documento
    4. Enlaces y direccionamientos
    5. Hemos aprendido
  2. Ejercicios
    1. Ejercicio 1. Estilos de texto y listas.
    2. Ejercicio 2. Etiquetas de  formateo de texto.

4.- Los lenguajes de marcas: Divisiones de una página Web

Objetivo

  • Crear una página Web que incluya varios marcos para la presentación de otras páginas, siguiendo unas especificaciones de diseño recibidas.
  • Definir diferentes divisiones o capas través de las etiquetas semánticas de HTML5

Contenido

  1. UA4 - Los lenguajes de marcas: Divisiones de una página Web
    1. Introducción
    2. Mapa conceptual
    3. Marcos y capas
    4. Hemos aprendido
  2. Ejercicios
    1. Ejercicio 1. Código en HTML5.
    2. Ejercicio 2. Estructura y enlaces.
    3. Ejercicio 3. Creación de una página Web.
    4. Ejercicio 4. Marcos.

5.- Imágenes y elementos multimedia - (1)

Objetivo

  • Identificar los diferentes formatos de contenidos multimedia para imágenes que podemos incluir en forma de ficheros en una página Web.
  • También, conoceremos qué etiquetas y atributos hemos de utilizar para aportar imágenes, además cómo crear mapas de imágenes, creando varias zonas activas dentro de cada imagen.

Contenido

  1. UA5 - Imágenes y elementos multimedia - (1)
    1. Introducción
    2. Mapa conceptual
    3. Inserción de imágenes: formatos y atributos
    4. Mapas de imágenes
    5. Figure
    6. Canvas
    7. Hemos aprendido
  2. Ejercicios
    1. Ejercicio 1. Galería de imágenes.
    2.  Ejercicio 2. Mapa de imágenes.
    3.  Ejercicio 3. Article y figure.

6.- Imágenes y elementos multimedia - (2)

Objetivo

  • Identificar los diferentes formatos de contenidos multimedia que podemos incluir en forma de ficheros en una página Web, tanto en audio como en vídeo.
  • Conocer qué etiquetas y atributos hemos de utilizar para aportar contenido multimedia, compatible con navegadores antiguos.
  • Insertar marcas para presentar sonidos y vídeos, aportando subtítulos.
  • Insertar las marcas que permitan la ejecución de programas.

Contenido

  1. UA6 - Imágenes y elementos multimedia - (2)
    1. Introducción
    2. Mapa conceptual
    3. Inserción de elementos multimedia: audio, vídeo y programas
    4. Formatos de audio y vídeo
    5. Marquesinas
    6. Hemos aprendido
  2. Ejercicios
    1. Ejercicio 1. Audio para todos.
    2. Ejercicio 2. Vídeo para todos.
    3.  Ejercicio 3. Vídeo con subtítulos.
    4. Ejercicio 4. Detectar JavaScript en el navegador.
    5. Ejercicio 5. Marquesina.

7.- Técnicas de accesibilidad y usabilidad - (1)

Objetivo

  • Definir qué es accesibilidad Web y sus técnicas y principios fundamentales, así como destacar las principales ventajas de trabajar con accesibilidad.
  • Explicar los criterios de usabilidad con contenidos Web, para permitir una mejor calidad de navegación y comprensión de los usuarios, teniendo en cuenta criterios definidos y normativa estándar de accesibilidad y usabilidad.

Contenido

  1. UA7 - Técnicas de accesibilidad y usabilidad - (1)
    1. Introducción
    2. Mapa conceptual
    3. Accesibilidad Web, ventajas de la accesibilidad
    4. Usabilidad Web, importancia de la usabilidad
    5. Hemos aprendido
  2. Ejercicios
    1. Ejercicio 1. Comprobación de la accesibilidad de un sitio Web.
    2. Ejercicio 2. Comprobación de la Usabilidad de un sitio Web
    3. Ejercicio 3. Optimizar la velocidad de carga de un sitio Web
    4. Ejercicio 4. Comprobar el contraste de un sitio Web

8.- Técnicas de accesibilidad y usabilidad - (2)

Objetivo

  • Utilizar herramientas de validación de accesibilidad y usabilidad Web.
  • Identificar varios navegadores y probar la funcionalidad de la página, utilizando varios criterios de usabilidad y accesibilidad.
  • Probar la página Web realizada en varios navegadores Web para comprobar si se cumplen las funcionalidades especificadas en el diseño, además de los criterios de accesibilidad y usabilidad que se hayan definido.

Contenido

  1. UA8 - Técnicas de accesibilidad y usabilidad - (2)
    1. Introducción
    2. Mapa conceptual
    3. Aplicaciones para verificar la accesibilidad de sitios Web (estándares)
    4. Diseño de sitios Web usables
    5. Adaptación de sitios Web usables
    6. Hemos aprendido
  2. Ejercicios
    1. Ejercicio. Validación de una página Web.

9.- Herramientas de edición Web - (1)

Objetivo

  • Conocer las características y funcionalidades del editor Sublime Text para la creación de páginas Web, teniendo en cuenta las especificaciones técnicas de las mismas. Aprenderemos a instalarlo, configurarlo y extender sus funcionalidades mediante paquetes.
  • Describiremos su interfaz y secciones más importantes.
  • Aprender la gestión de archivos con Sublime Text, su característica multi cursor, cuáles son las teclas de edición de texto, conocer qué son las marcas y los marcadores para qué se utilizan, las operaciones de buscar y reemplazar y la gestión de proyectos.

Contenido

  1. UA9 - Herramientas de edición Web - (1)
    1. Introducción
    2. Mapa conceptual
    3. Instalación y configuración de herramientas de edición Web
    4. Funciones y características
    5. Hemos aprendido
  2. Ejercicios
    1. Ejercicio 1. Configurando Sublime Text.
    2. Ejercicio 2. Búsqueda y reemplazo con expresiones regulares.

10.- Herramientas de edición Web - (2)

Objetivo

  • Conocer cómo ampliar funcionalidades en Sublime Text a partir de la instalación y configuración de diferentes paquetes. Aprenderemos a usar los más interesantes, entre los muchos disponibles: por ejemplo Emmet, Trailing Spaces o programas tipo Linter.
  • Conocer  cómo personalizar Sublime Text: apariencia, combinaciones de teclas, colores y temas.
  • Aprender a crear y gestionar macros y snippets.
  • Conocer otras alternativas de editores Web disponibles y  de entornos de programación en la nube.

Contenido

  1. UA10 - Herramientas de edición Web - (2)
    1. Introducción
    2. Mapa conceptual
    3.  Funciones y características
    4. Hemos aprendido
  2. Ejercicios
    1. Ejercicio 1. Paquete para FTP.
    2. Ejercicio 2. Practicando con Emmet.
    3. Ejercicio 3. Creación de un snippet.
Copyright 2018© D&S CAP | gestion-online@dscap.es