Estructura de una página web

diagrama de la estructura del sitio web

Las páginas web son como cualquier otro documento. Se componen de varias partes esenciales que contribuyen al conjunto. En el caso de las páginas web, estas partes son las imágenes y los vídeos, los titulares, el cuerpo del contenido, la navegación y los créditos. La mayoría de las páginas web contienen al menos tres de estos elementos, y muchas contienen los cinco. Algunas páginas web pueden tener también otras áreas, pero estas cinco son las más comunes.

Las imágenes son un elemento visual de casi todas las páginas web. Atraen la mirada y ayudan a dirigir a los lectores a partes específicas de la página. Pueden ilustrar un punto y proporcionar un contexto adicional para el tema de la página. Los vídeos hacen lo mismo, añadiendo un elemento de movimiento y sonido a la presentación.

Después de las imágenes, los titulares son el siguiente elemento más destacado en la mayoría de las páginas web. La mayoría de los diseñadores web utilizan algún tipo de tipografía para crear titulares más grandes y destacados que el texto que los rodea. Además, un buen SEO requiere que se utilicen las etiquetas de titulares HTML para representar los titulares en el HTML, así como visualmente.

qué es la estructura de la página

Los “sitios” web son abstracciones completas: no existen, excepto en nuestras cabezas. Cuando identificamos un sitio como tal, lo que realmente estamos describiendo es una colección de páginas individuales enlazadas que comparten un aspecto gráfico y de navegación común. Lo que crea la ilusión de continuidad en un “sitio” cohesionado son las características de diseño que comparten las páginas. Las páginas html individuales y la forma en que están diseñadas y enlazadas son la unidad atómica de los sitios web, y todo lo que caracteriza la estructura del sitio debe aparecer en las plantillas de las páginas.

A medida que la web ha ido madurando en la última década, la estructura de las páginas de los sitios de información basados en texto se ha vuelto más uniforme y predecible. Aunque no todas las páginas web comparten el diseño y las características exactas descritas aquí, la mayoría de las páginas web incorporan algunos o todos estos componentes básicos, en ubicaciones de página que se han vuelto familiares para los usuarios de la web (fig. 6.1).

Las cabeceras de las páginas son como versiones en miniatura de la página de inicio que se sitúan encima de cada página y hacen muchas de las cosas que hacen las páginas de inicio, pero en un espacio limitado. Las cabeceras proporcionan la identidad del sitio y la navegación global, con búsqueda y quizás otras herramientas. La ubicación exacta y la disposición de los componentes varían fr

qué describe el contenido y la estructura de una página web

Aunque esta referencia pretende ofrecer un desglose exhaustivo de los distintos elementos HTML y sus respectivos atributos, también es necesario entender cómo encajan estos elementos en el conjunto. Una página web está estructurada de la siguiente manera.

El primer elemento que aparece en el código fuente de una página web es la declaración de doctype. Esto proporciona al navegador web (u otro agente de usuario) información sobre el tipo de lenguaje de marcado en el que está escrita la página, lo que puede afectar o no a la forma en que el navegador representa el contenido. Puede parecer un poco aterrador a primera vista, pero la buena noticia es que la mayoría de los editores web WYSIWYG crearán el doctype por ti automáticamente después de que hayas seleccionado en un diálogo el tipo de documento que estás creando. Si no utilizas un paquete de edición web WYSIWYG, puedes consultar la lista de doctypes contenida en esta referencia y copiar el que quieras utilizar.

En el ejemplo anterior, el doctype se refiere a HTML 4.01 Strict. En esta referencia, verá ejemplos deHTML 4.01 y también de XHTfML 1.0 y 1.1, identificados como tales. Aunque muchos de los elementos y atributos pueden tener los mismos nombres, existen algunas diferencias sintácticas claras entre las distintas versiones de HTML yXHTML. Puede encontrar más información al respecto en las secciones tituladas HTML frente a XHTML y Sintaxis de HTML y XHTML.

estructura básica de html con ejemplo

Una vez que hayas guardado tu código en tu carpeta con el nombre adecuado, cierra el cuaderno. En tu carpeta, además del cuaderno, verás el icono que representa el archivo que acabas de grabar.

Para ejecutar la página que acaba de crear, haga doble clic en el icono. Automáticamente se abrirá el navegador y se cargará la página. La ruta completa y el nombre del archivo aparecerán en la barra de direcciones.

Para ello, cierra el navegador y, dentro de la carpeta en la que estés trabajando, arrastra el icono de template.html sobre el cuaderno. De este modo, el cuaderno se abrirá y cargará el código fuente que habías escrito previamente.

Eduardo José Cazorla