2.9 HTML: conceptos básicos (parte 2)
Recuerda que con el lenguaje HTML sólo se describe la estructura y el contenido, que puede ser texto, imágenes, vídeos y otros componentes, de las páginas web. Con HTML no se define la presentación visual de las páginas web.
En la primera parte de este videotutorial vimos la sintaxis del elemento, el componente básico de una página web. Una página web está compuesta por un conjunto de elementos escritos en un orden concreto. Recuerda que un elemento se compone de una etiqueta inicial o de apertura, y una etiqueta final o de cierre.
Con todas las etiquetas que vimos en la primera parte de este videotutorial ya podemos hacer páginas web sencillas.
Pero atención, lo que vamos a ver a continuación es una simplificación, para que sea más fácil de entender. En otro vídeo veremos detalles adicionales que son necesarios para que una página web sea realmente correcta.
Para escribir el código de una página web, es decir, para escribir el código HTML, no necesitas ningún programa especial. En este vídeo vamos a empezar a usar el Bloc de notas, vamos a hacer la primera página web con el Bloc de notas.
Recuerda que la etiqueta principal de una página web es la etiqueta <html>. La etiqueta <html> debe encerrar todo el contenido de la página web. A mí me gusta, cuando escribo el código de la página HTML, escribir, cuando escribo la etiqueta de inicio, escribo automáticamente la etiqueta de cierre. Así no se me olvida. No es obligatorio, pero es un consejo que te doy.
A continuación, dentro de la etiqueta <html>, dentro de la página web, la siguiente parte, la primera parte es la cabecera, la sección <head>. En la sección <head> recuerda que se escribe información, los metadatos que definen cómo se va a procesar la página web, cómo se va a visualizar, pero normalmente en el <head> no se escribe nada que deba aparecer visualmente en la página web. Por ahora, lo único que sabemos escribir es la etiqueta <title>, que es el título de la página web. Le voy a poner de título “Érase una vez HTML”. Y recuerda, si hemos abierto la etiqueta <title>, debemos de cerrarla.
Después del <head> tenemos el apartado <body>, el cuerpo de la página. Todo lo que escribamos aquí en el <body> sí que se va a ver, se va a pintar en la página web. En el 6
Ahora te animo a que escribas tu primera página web. Puede ser esta que yo he hecho o puedes intentar escribir una más complicada.
Para esta primera página he usado un editor sencillo, el Bloc de Notas. En la próxima parte de este videotutorial voy a usar un programa más potente.
Actividad
1. En el código base que se te proporciona debes realizar los siguientes cambios:
- Las siglas HTML deben aparecer como texto destacado en toda la página.
- Tim Berners-Lee debe aparecer como texto enfatizado en toda la página.
- Debes añadir el siguiente contenido:
- Un encabezado de nivel 1 con el texto "HTML" antes de "HTML son las siglas de..."
- Un encabezado de nivel 2 con el texto "Historia de HTML" antes de "Los inicios del lenguaje HTML..."
- Un encabezado de nivel 2 con el texto "Versiones de HTML" antes de dos nuevos párrafos que contienen el texto "Tim Berners-Lee definió la primera versión de HTML en el año 1991" y "En la actualidad, la última versión de HTML es HTML5".
Editor
Resultado
<!-- DIFERENCIAS -->
<html>
<head>
<title>El título de la páginaHTML</title>
</head>
<body>
<h1>HTML</h1>
<p><strong>HTML</strong> son las siglas de <em>HyperText Markup Language</em>, que puede traducirse como lenguaje de marcas o marcado de hipertexto.
</p>
<p>El lenguaje <strong>HTML</strong> se emplea para crear las páginas web. Es muy fácil ver el código <strong>HTML</strong> de una página web, la opción exacta cambia de un navegador a otro y también puede cambiar de una versión a otra de un mismo navegador, pero suelen tener un nombre similar.
</p>
<p><strong>HTML</strong> se compone de etiquetas que se escriben entre los símbolos menor que y mayor que.</p>
<h2>Historia de HTML</h2>
<p>Los inicios del lenguaje <strong>HTML</strong> se remontan al año 1990, cuando <em>Tim Berners-Lee</em> creó la primera página web.</p>
<h2>Versiones de HTML</h2>
<p><em>Tim Berners-Lee</em> definió la primera versión de <strong>HTML</strong> en el año 1991.</p>
<p>En la actualidad, la última versión de <strong>HTML</strong> es HTML5.</p>
</body>
</html>
<html>
<head>
<title>
</head>
<body>
<h1>HTML</h1>
<p><strong>HTML</strong> son las siglas de <em>HyperText Markup Language</em>, que puede traducirse como lenguaje de marcas o marcado de hipertexto.
</p>
<p>El lenguaje <strong>HTML</strong> se emplea para crear las páginas web. Es muy fácil ver el código <strong>HTML</strong> de una página web, la opción exacta cambia de un navegador a otro y también puede cambiar de una versión a otra de un mismo navegador, pero suelen tener un nombre similar.
</p>
<p><strong>HTML</strong> se compone de etiquetas que se escriben entre los símbolos menor que y mayor que.</p>
<h2>Historia de HTML</h2>
<p>Los inicios del lenguaje <strong>HTML</strong> se remontan al año 1990, cuando <em>Tim Berners-Lee</em> creó la primera página web.</p>
<h2>Versiones de HTML</h2>
<p><em>Tim Berners-Lee</em> definió la primera versión de <strong>HTML</strong> en el año 1991.</p>
<p>En la actualidad, la última versión de <strong>HTML</strong> es HTML5.</p>
</body>
</html>
No hay comentarios:
Publicar un comentario