Análisis de la estructura básica de una página Web

Salvo contadas excepciones, las etiquetas siempre se presentan por pares, una para abrir y otra para cerrar.

add
B@UNAM

Análisis de la estructura básica de una página Web

Veamos las etiquetas en el ejercicio anterior.

Coloca tu cursor sobre las etiquetas

<html>

<head>

<title Esta es mi página web no. 1 </title>

<title>

</head>

<body>

Es en busca de lo imposible que se llega a lo posible

</body>

</html>

Etiquetas más usadas con HTML

La estructura básica de una página web se enriquece y amplia cuando se incorporan otro tipo de etiquetas, las cuales mejoran la forma de presentar la información, como: enfatizar cierta información (títulos), aplicar formato al texto (negritas, cursivas, etc), su organización (párrafos, viñetas y tablas) e incluir ciertos elementos visuales (imágenes), similar a un documento en Word.

  • Las etiquetas se pueden escribir en mayúsculas o minúsculas, sólo te pedimos que seas consiente en la opción que elijas; no obstante, te recomendamos que las escribas en minúsculas.
  • Salvo contadas excepciones, las etiquetas siempre se presentan por pares, una para abrir y otra para cerrar.
  • Cualquier par de etiquetas que se seleccione deberá escribirse después de la etiqueta <body>. Recuerda, es en esta parte donde estará el contenido que se mostrará al visitante de la página web.

Harás uso de estas etiquetas durante la elaboración de diversas páginas que almacenarás en tu carpeta páginas web.

Antes de iniciar, te recomendamos lo siguiente:

Lee e imprime los siguientes documentos que te serán de gran utilidad para la elaboración de tus páginas web propuestas en la unidad.

  1. Glosario de etiquetas class
  2. Otras recomendaciones class

1. Etiquetas para títulos

Los títulos son una de las principales herramientas para estructurar un documento HTML, permiten organizar el contenido en secciones y subsecciones a conveniencia del autor, tal como haríamos al redactar un informe o un trabajo escolar. Los siguientes 6 pares de etiquetas son los que están disponibles para los títulos:

<h1>…</h1>

<h2>…</h2>

<h3>…</h3>

<h4>…</h4>

<h5>…</h5>

<h6>…</h6>

Autoevaluación

Para que veas cómo funcionan estas etiquetas en la práctica, realiza la siguiente actividad.

Sigue los pasos que a continuación se indican para que diseñes tu primera página web.

  1. Crea una carpeta con el nombre paginasweb en el directorio raíz de tu computadora para que allí guardes todas las páginas web que elabores.

  2. Accede al bloc de notas, desde el escritorio de la pantalla de tu computadora, en la parte inferior izquierda, escribe bloc de notas y da clic.

  3. Al abrir el Bloc de notas se despliega su pantalla con el cursor vertical parpadeando, en espera de que escribas las etiquetas correspondientes a tu primera página Web:

  4. Escribe el siguiente código:

  5. Guarda o salva en tu carpeta paginasweb el código que acabas de escribir con el nombre titulo.html siguiendo la ruta establecida en el bloc de notas: Archivo/Guardar como, como se indica en la siguiente pantalla:

    Nota: es importante recordar que los nombres de archivos deben escribirse con minúsculas, sin acentos, sin espacios en blanco, sin caracteres especiales y siempre asigna manualmente la extensión html para que el navegador Web pueda reconocer al archivo como página Web.

  6. Ahora accede al contenido de la carpeta paginasweb y podrás ver que el archivo titulo.html que acabas de salvar tiene asociado el icono del explorador que hayas predefinido como principal (Netscape, Firefox, Explorer, etc.). Esto significa que el navegador Web ya lo puede reconocer.

  7. Finalmente haz doble clic en el archivo titulo.html y observa cómo el navegador despliega el mensaje:

Ahora, cierra el navegador [haciendo clic en el icono localizado en el ángulo superior derecho de la pantalla.

menu