Antes de empezar el curso.
Grupos y foros.- Módulo 1 - Desarrollo web1.1 Sitios Web4 Temas1 Cuestionario
-
1.2 Lenguajes4 Temas1 Cuestionario
-
1.3 Herramientas3 Temas
- Módulo 2 - HTML2.1 Estructura5 Temas1 Cuestionario
-
2.2 Contenido6 Temas1 Cuestionario
-
Descargar material 1
- Módulo 3 - CSS3.1 Estilos2 Temas
-
3.2 Referencias2 Temas
-
3.3 Propiedades12 Temas1 Cuestionario
-
Descargar material 2
- Módulo 4 - Diseño web4.1 Cajas1 Tema1 Cuestionario
-
4.2 Modelo de caja tradicional4 Temas1 Cuestionario
-
Proyecto 1 - Netflix13 Temas
-
4.3 Modelo de caja flexible2 Temas1 Cuestionario
-
Proyecto 2 - Azul Web6 Temas
-
Descargar material 3
- Módulo 5 - Diseño web adaptable5.1 Web móvil
- Final del cursoProyecto final2 Temas
-
Despedida del curso
-
Encuesta
El lenguaje de Marcas de Hipertexto, HTML por sus siglas en inglés, se compone por un grupo de etiquetas con un nombre rodeado por signos de menor que y mayor que, o como también se le conoce a dichos signos; paréntesis angulares. Los paréntesis angulares delimitan la etiqueta y el nombre define el tipo de contenido que representa. Por ejemplo, la etiqueta <html> indica que el contenido es código HTML. Algunas de estas etiquetas son declaradas individualmente (por ejemplo, <hr>) y otras son declaradas en pares, que incluyen una de apertura y otra de cierre, como <body></body> (en la etiqueta de cierre el nombre va precedido por una barra invertida).
Las etiquetas individuales y las de apertura pueden incluir atributos para ofrecer información adicional acerca de sus contenidos (por ejemplo, <html lang=”es”>). Las etiquetas individuales y la combinación de etiquetas de apertura y cierre se llaman elementos. Los elementos compuestos por una sola etiqueta se usan para modificar el contenido que los rodea o incluir recursos externos, mientras que los elementos que incluyen etiquetas de apertura y cierre se utilizan para delimitar el contenido del documento, tal como ilustra la siguiente imagen.
Para definir un documento es necesario combinar varios elementos. Dichos elementos son listados en secuencia de arriba abajo y pueden contener elementos dentro de otros elementos. Por ejemplo, el elemento <html> que se muestra en la imagen anterior declara que su contenido debe ser interpretado como código HTML. Por lo tanto, el resto de los elementos que describen el contenido de ese documento se deben declarar entre las etiquetas <html> y </html>.
Al mismo tiempo, los elementos dentro del elemento <html> pueden incluir otros elementos. El siguiente ejemplo muestra un documento HTML sencillo que incluye todos los elementos necesarios para definir una estructura básica y mostrar el mensaje HOLA MUNDO! en la pantalla.
<!DOCTYPE html>
<html>
<head lang="es">
<title>Mi primer documento HTML</title>
</head>
<body>
<p>HOLA MUNDO!</p>
</body>
</html>
En el ejemplo anterior presentamos un código sencillo, pero con una estructura compleja. En la primera línea, se encuentra una etiqueta individual que declara el tipo de documento (<!DOCTYPE html>) seguida por una etiqueta de apertura <html lang=”es”>. Entre las etiquetas <html> y </html> se incluyen otros elementos que representan la cabecera y el cuerpo del documento (<head> y <body>), los cuales a su vez encierran más elementos con sus respectivos contenidos (<title> y <p>), demostrando cómo se compone un documento HTML. Los elementos se listan uno a continuación de otro y también dentro de otros elementos, de modo que se construye una estructura de tipo árbol con el elemento <html> como raíz.
Como ya mencionamos, las etiquetas individuales y de apertura pueden incluir atributos. Por ejemplo, la etiqueta de apertura <html> declarada en el código anterior no está solo compuesta por el nombre html y los paréntesis angulares, sino también por el texto lang=”es”. Este es un atributo con un valor. El nombre del atributo es lang y el valor es se asigna al atributo usando el carácter =. Los atributos ofrecen información adicional acerca del elemento y su contenido. En este caso, el atributo lang declara el idioma del contenido del documento (es por Español).