Diseño de páginas web con HTML y CSS.

Al finalizar el curso, el alumno será capaz de planificar y diseñar correctamente desde sencillas páginas web hasta completos sitios web. Para ello, se le proporciona primero los conocimientos necesarios del lenguaje HTML y de las hojas de estilo en cascada (CSS); y, posteriormente, se estudia una aplicación de desarrollo profesional de sitios web, como es Adobe Dreamweaver.

Curso Diseño de páginas web con HTML y CSS.

$2,790.00Precio
  • Fundamentos del HTML y CSS.
    Se estudia el lenguaje HTML para construir las páginas web y las hojas de estilo en cascada CSS para aplicarles formato y conseguir el aspecto deseado. El alumno adquiere los conocimientos necesarios para escribir e interpretar correctamente el código correspondiente, siguiendo los estándares web.

    Introducción y objetivos.
    Descripción general del curso, incluyendo:
    * El objetivo general del curso.
    * Los objetivos específicos identificados.
    * Los contenidos formativos.

    Introducción.
    Proporciona ejemplos de páginas web reales, disponibles en Internet; se presenta el lenguaje HTML y las hojas de estilo en cascada (CSS), enfatizando la utilización correcta de cada uno de estos lenguajes. Finalmente, se indican las aplicaciones informáticas que requiere un diseñador de páginas web y cuáles se utilizarán a lo largo del curso. Contenido:
    1. Un paseo por la Web.
    2. ¿Qué es el HTML?
    3. Hojas de estilo en cascada (CSS).
    4. ¿Qué herramientas necesitamos?

    Estructura del código HTML.
    Se describe la sintaxis de las etiquetas HTML y la posibilidad de que presenten atributos para establecer propiedades o características adicionales. Se introducen las etiquetas HTML fundamentales que describen una página web, como html, head y body y la etiqueta de párrafo de texto p. Además, se indica cómo guardar una página web y establecer el título de la misma. Contenido:
    1. Las etiquetas HTML.
    2. Guardar la página web.
    3. Introducir párrafos de texto.
    4. Las etiquetas tienen atributos.
    5. El título de la página.

    Texto.
    Se describen las características del texto de una página web utilizando el lenguaje HTML. Se estudia la distribución en párrafos y títulos de la página y se indica la posibilidad de escribir texto predefinido (aquel que se muestra en la página web tal como lo hemos escrito en el código). También se estudia la incorporación de líneas separadoras y los llamados elementos de frase, que sirven para describir el texto de una forma semántica (por ejemplo, para representar una cita, una abreviatura, aplicar énfasis, etc.). Contenido:
    1. Títulos.
    2. Texto predefinido.
    3. Líneas separadoras.
    4. Elementos de frase.

    Incorporar imágenes en la página web.
    Se estudia la etiqueta img del lenguaje HTML, utilizada para incorporar imágenes en el contenido de una página web, describiendo los formatos gráficos adecuados para este propósito. Se describe cómo optimizar una imagen para la Web (resolución, modo de color y compresión). Finalmente, se presenta la posibilidad de incluir imágenes como fondo de la página o de otros elementos, para lo que se utiliza las hojas de estilo en cascada (CSS). Contenido:
    1. Introducción.
    2. Resolución y modo de color.
    3. Formatos gráficos.
    4. La etiqueta img.
    5. Especificar las dimensiones de la imagen.
    6. Imágenes como fondo.

    Hipervínculos o enlaces.
    Se introduce el concepto de hipervínculo, fundamental para poder navegar entre páginas web, y cómo podemos representarlo en el código HTML. Se estudian los distintos tipos de hipervínculos: vínculos a otras páginas del sitio web, vínculos a páginas externas al sitio web, vínculos a lugares concretos de una página web o vínculos que apuntan a direcciones de correo electrónico. Finalmente, se comprueba que las imágenes también pueden funcionar como hipervínculos. Contenido:
    1. Introducción.
    2. Vínculos a otras páginas web.
    3. Vínculos a una parte de una página web.
    4. Vínculos a lugares de Internet.
    5. Vínculos a direcciones de correo electrónico.
    6. Imágenes que actúan como vínculos.

    Introducción a CSS (Parte 1).
    Se introduce el lenguaje de las hojas de estilo en cascada (CSS), resaltando que son la herramienta que un diseñador web debe utilizar para aplicar formato a las páginas web. Se describe la sintaxis de las reglas CSS, compuestas de un selector y de la declaración de la regla; cómo enlazar las hojas de estilo con el código HTML; cómo aplicarlas; y los conceptos de herencia y cascada, esenciales para entender esta tecnología. Contenido:
    1. ¿Qué son las hojas de estilo en cascada (CSS)?
    2. Las reglas de CSS.
    3. Enlazar CSS con el código HTML.
    4. Aplicar las reglas de estilo.
    5. Herencia y cascada.

    Introducción a CSS (Parte 2).
    Se introducen los dos elementos fundamentales en la composición o maquetación de una página web: las etiquetas HTML div y span. Seguidamente se estudia cómo crear selectores complejos en las reglas CSS, así como el uso de las pseudoclases y pseudoelementos CSS. Contenido:
    1. Las etiquetas HTML div y span.
    2. Selectores avanzados de CSS.
    3. Pseudoclases y pseudoelementos CSS.

    Dar formato al texto de las páginas web.
    Se describen las propiedades más utilizadas a la hora de dar formato al texto de las páginas web mediante las hojas de estilo en cascada (CSS): la elección de fuentes o tipos de letra, el tamaño del texto, realces, alineación, color, etc. Contenido:
    1. Fuentes.
    2. La propiedad abreviada font.
    3. Propiedades de texto.
    4. Decoración del texto y color.

    Listas.
    Se introducen los distintos tipos de listas HTML que podemos incorporar en una página web: listas sin numerar, listas numeradas y listas de definición. También se estudian las propiedades CSS que afectan al aspecto de las listas. Contenido:
    1. Listas sin numerar.
    2. Listas numeradas.
    3. Listas anidadas.
    4. Imágenes como viñetas de una lista.
    5. Listas de definiciones.

    Tablas.
    Introduce las tablas como elemento adecuado a la hora de presentar información tabular en una página web. Describe las etiquetas HTML relacionadas con las tablas y las propiedades CSS para aplicar el formato y aspecto deseado. Se presenta el concepto de modelo de caja, fundamental a la hora de diseñar páginas web mediante CSS. Se recuerda que las tablas no son la herramienta adecuada para maquetar una página web excepto si deseamos compatibilidad con navegadores antiguos. Contenido:
    1. Introducción.
    2. Estructura de una tabla HTML.
    3. Bordes, espacio entre celdas y relleno.
    4. Color o imagen de fondo.

    Temas avanzados sobre tablas.
    Estudia conceptos avanzados en el trabajo con tablas en páginas web: se indica cómo establecer las dimensiones de la tabla, su número de columnas, etc. y cómo afecta estos detalles al cargar la tabla en la página web; la posibilidad de unir celdas en dos o más filas o columnas; crear tablas anidadas, es decir, una tabla en el interior de otra tabla, etc. Contenido:
    1. Establecer las dimensiones de la tabla.
    2. Título y pie de tabla.
    3. Especificar el número de columnas.
    4. Unir celdas.
    5. Tablas anidadas.

    Frames.
    Describe cómo dividir la página web en frames o marcos a través del código HTML, de forma que sea posible mostrar en pantalla más de una página web al mismo tiempo. Aunque es una técnica que no se recomienda actualmente, un buen diseñador web tiene que conocer el código correspondiente a los frames. Además, se estudia el uso correcto de los iframes. Contenido:
    1. El conjunto de frames.
    2. Propiedades de los frames.
    3. Bordes para los frames y contenido alternativo.
    4. Iframes.

    Posicionamiento mediante CSS (Parte 1).
    Describe la forma clásica de maquetar o distribuir los elementos de una página web mediante posicionamiento CSS. En este caso, se estudia el uso de los elementos flotantes (propiedad float) y del clearing o desplazamiento. Contenido:
    1. Introducción.
    2. Elementos flotantes.
    3. El clearing.
    4. El código CSS.

    Posicionamiento mediante CSS (Parte 2).