Partes de una página web: Estructura y contenido [Ejemplos]

partes de una página web

Los nombres de las partes de una página web, que vendrían siendo la estructura web son:

  • Cabecera o header en inglés
  • Cuerpo o body en inglés
  • Pie de página o footer en inglés

También se le ha denominado con menos frecuencia a partes de la página web a la distribución de los contenidos (páginas/secciones) en el sitio.

En este caso, el nombre de las «partes de una página web» son:

  • Homepage o página de inicio
  • Contacto
  • Productos o servicios
  • Blog
  • Quiénes somos
  • Legales

Abordaré en este artículo a los dos casos dominando al primero como partes de una página web basándose en la estructura y al segundo en función al contenido y su distribución.

¡Acompáñame!

? Promociones de Black Friday
■ 83% de descuento en SiteGround
■ 81% de descuento en Hostinger
■ 70% de descuento en Webempresa
¡Por tiempo limitado!

Partes de una página web basándose en la estructura

Las esenciales, básicas y verdaderas partes de una página web son las siguientes:

1. Cabecera o header en inglés

La cabecera es la parte de arriba de una página web, su función suele ser mostrar información del sitio web: menú de navegación, elementos de identidad y a veces también:

  • Buscador, para que al usuario se le facilita encontrar una página específica
  • Redes sociales, botones a las diferentes RR. SS
  • Carrito de compras, en tiendas online se usa para incluir diferentes productos que ha escogido el cliente

Cabe mencionar que la cabecera tiende a aparecer en todas las páginas web.

Las etiquetas HTML de la cabecera son: <header>En este lugar el contenido de la cabecera</header>

Ejemplo de header como parte de una página web

la cabecera es parte o estructura de una pagina web
Imagen extraída de Hostinger

2. Cuerpo o body en inglés

El cuerpo de una página web se encuentra entre el header y el footer, su función es contener información importante del sitio. En este largo y ancho espacio se encuentran varios elementos. Algunos son:

  • Texto
  • Imágenes
  • Videos
  • Audios
  • Enlaces

El cuerpo o body habitualmente es diferente en cada página digital.

En el caso de los blogs online lo común es ver dos columnas en sus páginas: una columna (que ocupa gran parte del espacio) es netamente contenido y la otra es para publicidad, navegación o cosas por el estilo.

Las etiquetas HTML del cuerpo son: <body>En este lugar el contenido del cuerpo</body>

Ejemplo de body como parte de la estructura de una página web

el cuerpo es parte o estructura de una pagina web
Imagen extraída de Hostinger

3. Pie de página o footer en inglés

El pie de página es la parte baja de una web, su función generalmente es exponer elementos e informaciones del sitio. Algunos recurrentes son:

  • Soporte
  • Recursos
  • Copyright
  • Mapa del sitio web
  • Botones de redes sociales
  • Formulario de suscripción
  • Textos legales

Destacó que la parte inferior de la página no se debe infravalorar y, al contrario, aprovecharla para compartir información que sea útil para el usuario de internet.

Las etiquetas HTML del pie de página son: <footer>En este lugar el contenido del pie de página</footer>

Ejemplo de footer como parte de la página web

el footer es parte o estructura de una pagina web
Imagen extraída de Hostinger

Ejemplo de las partes de una página web (estructura)

ejemplo de las partes de una pagina web
Imagen extraída de MNG

El color rojo marca la cabecera, el color morado marca el cuerpo y el color verde marca el pie de página.

Partes de la página web en función al contenido y su distribución

1. Homepage o página de inicio

La homepage es la página de inicio del sitio web. En este espacio se debe añadir toda la información más relevante del negocio para que los visitantes comprendan qué se ofrece y por qué se es la mejor opción.

Son muchos los elementos que puedes encontrar en una homepage, algunos de ellos son:

  • Chatbots
  • Banners publicitarios
  • Últimos artículos del blog
  • Llamados a la acción (CTA)

En tanto ha contenido como tal podrás ver:

  • Ofertas
  • Testimonios
  • Imágenes de alta calidad
  • Beneficios del producto/servicio
  • Características del producto/servicio

Dependiendo del tipo de sitio web observarás distintas cosas, por ejemplo, en la homepage de un noticiero normalmente verás artículos, artículos y más artículos.

Mira un ejemplo de homepage:

pagina web partes homepage
Imagen extraída de SiteGround

2. Contacto

La sección de contacto es el espacio en donde se expone la información necesaria para que los visitantes, clientes y posibles compradores puedan contactar con el dueño del site.

Algunos elementos que se hallan son:

  • Dirección de correo
  • Números de teléfono
  • Formulario de contacto

En el caso de los negocios físicos, se agrega la dirección y los horarios en los que se atiende para que las personas visiten personalmente.

Por otro lado, en un blog, la mayoría de veces solo con dejar un formulario es más que suficiente.

Mira un ejemplo de página de contacto:

partes de una page web
Imagen extraída de Rock Content

3. Productos o servicios

La sección de productos o servicios sirve para exhibir los artículos y detalles sobre cada uno.

En este espacio lo ideal es mencionar:

  • Características de los productos
  • Beneficios de los productos
  • Precios de los productos

En fin.

Se debe agregar en esta parte web todo lo que sea necesario para que el visitante se convenza en que es una excelente opción y se convierta.

No olvides que todos los textos expuestos en esta página necesitan estar ajustados al lenguaje del cliente.

Mira un ejemplo de página de producto o servicio:

estructura pagina web productos o servicios
Imagen extraída de De Prati

4. Blog

El blog es el espacio en línea donde se publica contenido acerca de la temática para atraer a visitantes cualificados.

Con la creación de un buen blog se puede conseguir un mejor posicionamiento en los motores de búsqueda como Google y aumentar las ventas de los productos.

Los elementos comunes de un blog son:

  1. Barra de búsqueda, se inserta, por ejemplo, en los laterales o al final del blog para que los usuarios busquen un tema en particular de su interés
  2. Botones de redes sociales, se muestran, por ejemplo, al inicio o al final para que los lectores compartan los artículos
  3. Formulario de suscripción, se lo coloca para conseguir suscriptores y potenciales clientes

Las partes principales de un blog son:

  1. Cabecera
  2. Columna principal
  3. Barra lateral
  4. Pie de página

Mira un ejemplo de blog:

ejemplos partes de una pagina web
Imagen extraída de Inboundcycle

5. Quiénes somos

La sección «Quiénes somos» sirve para contar, por ejemplo, la historia del fundador o la del negocio junto a sus fundadores. Es de las partes web en la que se genera confianza y hasta posibles alianzas con otras marcas.

Los elementos que suele contener son:

  • Visión, misión y valores
  • Referencia de los socios
  • Imágenes de los fundadores

En el caso de los sitios weblog se puede añadir al final de toda la historia las diferentes redes sociales para que los visitantes ingresen a ellas.

Mira un ejemplo de página quiénes somos:

partes de la pagina sobre nosotros
Imagen extraída de Rock Content Sobre Nosotros

6. Legales

Las páginas legales se integran obligatoriamente, ya que hacen al sitio web confiable y a la vez se cumple con la legalidad.

Dichas páginas son las siguientes:

  • Aviso legal
  • Política de cookies
  • Política de privacidad
  • Términos y condiciones (en tiendas virtuales)

Generalmente, este conjunto de páginas están agregadas en el footer, así que añádelas ahí.

Ejemplo de páginas legales puedes ver en la parte baja de esta web

¿Cuáles son las partes de una página web?

cuales son las partes de una pagina web

Conclusión

Conocer las partes de una página web es importante porque permite saber qué elementos se incluye en cada una. Así que con ese conocimiento adquirido es momento de que empieces a trabajar en tu sitio de forma más óptima.

Posts que te recomiendo leer:

Todavía te preguntas: ¿Qué partes tiene una página web? Déjame un comentario en este momento

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Información de Privacidad:
Responsable: Anthony Malla ([email protected])
Finalidad del tratamiento: Controlar el spam, gestionar los comentarios
Legitimación: Tu consentimiento
Comunicación de los datos: No se cederán datos a terceros, salvo obligación legal
Derechos: Acceso, rectificación, portabilidad, olvido

 

Scroll al inicio