Lo que s\u00ed est\u00e1 claro es que existen cientos, por no decir miles, de tipos de p\u00e1ginas web. Por tanto, te podr\u00e1s imaginar que las partes de una p\u00e1gina web no son las mismas en un ecommerce<\/em> que en una p\u00e1gina web corporativa o un blog de reposter\u00eda, aunque s\u00ed es cierto que comparten una estructura y muchos elementos en com\u00fan.<\/p>\n \u00bfQuieres ver cu\u00e1les son las partes de una p\u00e1gina web y cu\u00e1les son los elementos m\u00e1s comunes? Pues entremos en materia \ud83d\ude42<\/p>\n Tabla de contenidos:<\/p> Generalmente, si hablamos de las partes de una p\u00e1gina web, nos referimos a su estructura. Eso s\u00ed, muchas veces tambi\u00e9n se habla de partes de una web en funci\u00f3n de su contenido. As\u00ed que, teniendo esto en cuenta, distingamos entre:<\/p>\n Ahora te explico cada una de ellas con m\u00e1s detalle. En la estructura de una p\u00e1gina web tenemos tres partes diferenciadas: cabecera, cuerpo y pie de p\u00e1gina. O, por sus t\u00e9rminos en ingl\u00e9s: header<\/em>, body<\/em> y footer<\/em>.<\/p>\n La cabecera es la parte superior de la p\u00e1gina web. Aqu\u00ed suele incluirse la informaci\u00f3n b\u00e1sica de la empresa o marca y es consistente en todo el sitio, es decir, se repite en cada p\u00e1gina de la web por la que navegas.<\/p>\n Los elementos que se incluyen en la cabecera son:<\/p>\n Estos elementos muchas veces difieren en funci\u00f3n de la plantilla de WordPress<\/a><\/strong> que utilices, pero son los m\u00e1s comunes.<\/p>\n Si hablamos en lenguaje HTML, ver\u00e1s que todo el contenido de la cabecera aparece entre las siguientes etiquetas:<\/p>\n Nota:<\/strong> Cuando creas una p\u00e1gina web, es recomendable fijar la cabecera. \u00bfQu\u00e9 quiere decir esto? Pues que a medida que un usuario hace scroll<\/em> y navega a trav\u00e9s de tu sitio, la cabecera se mantenga fija y tu marca y los accesos m\u00e1s importantes de tu p\u00e1gina, como el men\u00fa, est\u00e9n siempre visibles y accesibles. Esta es la parte de la web que alberga el contenido principal de tu p\u00e1gina. Esta parte s\u00ed es diferente en cada p\u00e1gina de tu sitio. Es decir, no ser\u00e1 el mismo contenido el que incluyes en tu p\u00e1gina de contacto que en la p\u00e1gina principal.<\/p>\n En HTML puedes identificar r\u00e1pidamente este contenido, ya que se encuentra dentro de las siguientes etiquetas:<\/p>\n El pie de p\u00e1gina o footer es la parte inferior de una p\u00e1gina web. Al igual que la cabecera, se repite y es consistente en cada p\u00e1gina. En el footer <\/em>podemos encontrar los siguientes elementos:<\/p>\n Tal y como vimos en las partes anteriores, en HTML el pie de p\u00e1gina se encuentra entre estas etiquetas:<\/p>\n Para no quede ni un resquicio de duda, veamos un ejemplo real con nuestra p\u00e1gina web www.lucushost.com.<\/p>\n Su estructura ser\u00eda la siguiente:<\/p>\n Acabamos de ver las partes de una p\u00e1gina web en funci\u00f3n de su estructura, ahora veamos c\u00f3mo se divide una p\u00e1gina web en funci\u00f3n de la distribuci\u00f3n de su contenido.<\/p>\n Si hablamos de las partes de una web, la p\u00e1gina principal, de inicio o la home es la m\u00e1s importante de todas. Aqu\u00ed se incluye la informaci\u00f3n m\u00e1s relevante de tu empresa, ya que es en la que tienes que proyectar tu marca y mostrar a tus visitas a qu\u00e9 te dedicas, en qu\u00e9 te diferencias de tu competencia y por qu\u00e9 deber\u00edan elegirte a ti.<\/p>\n Adem\u00e1s de los elementos propios de la cabecera y el footer (que ya sabes que son iguales en todas las p\u00e1ginas), en la p\u00e1gina de inicio sueles encontrar:<\/p>\n La p\u00e1gina de inicio est\u00e1 alojada siempre en el dominio principal, no en un directorio. Para que me entiendas, la p\u00e1gina de inicio o hombre de tu web ser\u00e1 tudominio.com<\/strong> y no tudominio.com\/servicios<\/strong>.<\/p>\n Una p\u00e1gina web no sirve \u00fanicamente para vender online.<\/p>\n Si tienes un negocio peque\u00f1o como, por ejemplo, una peluquer\u00eda, tener una p\u00e1gina web te ayudar\u00e1 a ganar visibilidad en tu zona y mostrar a tus clientes potenciales la forma de contactar contigo.<\/p>\n El tel\u00e9fono, la direcci\u00f3n y los horarios son tres elementos b\u00e1sicos que deben estar s\u00ed o s\u00ed en todas las p\u00e1ginas de contacto y, como no, tambi\u00e9n en la cabecera y en el footer. Pero, adem\u00e1s de ello es muy recomendable incluir los siguientes elementos:<\/p>\n Cuando creas el contenido de una web, lo ideal es que la informaci\u00f3n m\u00e1s detallada de los productos que vendes o los servicios que ofreces la incluyas en una p\u00e1gina espec\u00edfica.<\/p>\n En esta parte de la p\u00e1gina web debes incluir todo lo relacionado con tus productos o servicios: ventajas de tus productos, principales caracter\u00edsticas, a qui\u00e9n est\u00e1n dirigidos, el precio, gastos de env\u00edo\u2026<\/p>\n Por supuesto, no te olvides de la importancia de una buena llamada a la acci\u00f3n<\/a><\/strong> en esta parte de tu web. Textos como \u00ab\u00a1Lo quiero!\u00bb, \u00abA\u00f1adir a la cesta\u00bb o \u00abReserva ya\u00bb ayudar\u00e1n a conducir a tus visitas hacia el objetivo final.<\/p>\n La p\u00e1gina de \u00abQui\u00e9nes somos\u00bb, \u00abSobre m\u00ed\u00bb o \u00abAcerca de\u00bb es la parte de una web que funciona como tarjeta de presentaci\u00f3n. Y no hace falta escribir una epopeya: basta con explicar qui\u00e9n eres, qu\u00e9 haces y por qu\u00e9. Su objetivo debe ser ayudarte a conectar con tus visitas, mostrarles tu lado m\u00e1s humano y darles motivos para confiar en ti (o en tu empresa).<\/p>\n Por eso, lo m\u00e1s habitual es incluir informaci\u00f3n sobre los valores que te representan, un poco de la historia de la empresa o del proyecto e incluso una descripci\u00f3n del equipo que trabaja contigo (si no eres t\u00fa solo).<\/p>\n Incluso puedes plantearte acompa\u00f1ar el texto con fotos o v\u00eddeos aut\u00e9nticos, nada de bancos de im\u00e1genes. Una foto del equipo trabajando, un breve v\u00eddeo que muestre el d\u00eda a d\u00eda o incluso un gr\u00e1fico con los puntos clave de la historia de la empresa, eso ya lo eliges t\u00fa a tu gusto.<\/p>\n Lo importante es que tu marca deje de ser una entidad gen\u00e9rica y pase a convertirse en un nombre que las visitas van a reconocer a partir de ahora. \u00a1Y todo suma!<\/p>\n Si hay una parte fundamental en cualquier tipo de p\u00e1gina web, esa es la secci\u00f3n del blog.<\/p>\n Crear un blog<\/a><\/strong> puede hacer que tu negocio despegue de una vez por todas. Es indispensable para tu estrategia de contenidos y una pieza clave si quieres mejorar tu posicionamiento org\u00e1nico en Google y ganar visitas a tu sitio.<\/p>\n Los elementos web m\u00e1s comunes que encontrar\u00e1s en casi cualquier blog son:<\/p>\n Seguramente que es una de las p\u00e1ginas menos vistas de una web, pero con el GDPR (y ya antes de su aprobaci\u00f3n) uno de los requisitos b\u00e1sicos es proporcionar a tus usuarios toda la informaci\u00f3n relacionada con el procesamiento de los datos que se recopilan a trav\u00e9s de tu sitio web.<\/p>\n Esta parte de tu web no tiene que ir en el men\u00fa principal, pero la tienes que incluir s\u00ed o s\u00ed. Generalmente se ubica en el pie de p\u00e1gina o footer<\/em>, as\u00ed como en los avisos de cookies o cuando incluyes alg\u00fan formulario de registro o suscripci\u00f3n.<\/p>\n Estas son solo algunas de las p\u00e1ginas m\u00e1s importantes o comunes que puedes localizar en una web, pero no las \u00fanicas. En funci\u00f3n del contenido que necesites mostrar a tus usuarios, necesitar\u00e1s crear o suprimir algunas. \u00a1Sobre esto no hay una regla escrita!<\/p>\n\u00bfCu\u00e1les son las partes de una p\u00e1gina web?<\/span><\/h2>\n
\n
\n<\/strong><\/p>\n\n
\n
\n<\/a><\/p>\n
Estructura de una p\u00e1gina web<\/span><\/h2>\n
Cabecera o header<\/em><\/span><\/h3>\n
\n
<header>Contenido de la cabecera<\/header><\/pre>\n
![\"Partes](\"https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2019\/04\/partes-de-una-pagina-web-estructura-1.png\" "\\"\\"")
<\/p>\nCuerpo o body<\/em><\/span><\/h3>\n
<body>Contenido del cuerpo<\/body><\/pre>\n
Pie de p\u00e1gina o footer<\/em><\/span><\/h3>\n
\n
<footer>El contenido del pie de p\u00e1gina<\/footer><\/pre>\n
\u00bfVemos un ejemplo real?<\/span><\/h3>\n
![\"\"](\"https:\/\/www.lucushost.com\/blog\/wp-content\/uploads\/2019\/04\/estructura-web-lucushost.jpg\" "\\"\\"")
<\/p>\n\n
Partes de una p\u00e1gina web en funci\u00f3n de su contenido<\/span><\/h2>\n
Inicio o home<\/span><\/h3>\n
\n
<\/a><\/p>\n
Contacto<\/span><\/h3>\n
\n
Productos y servicios<\/span><\/h3>\n
Qui\u00e9nes somos o Acerca de<\/strong><\/span><\/h3>\n
Blog<\/span><\/h3>\n
\n
Pol\u00edtica de privacidad<\/span><\/h3>\n