Estructura de una pagina web en html

Inicio » Estructura de una pagina web en html

Elementos básicos de Html

HTML significa HyperText Markup Language (Lenguaje de Marcas de Hipertexto) y es el elemento estructural básico que se utiliza para crear páginas web. HTML es un lenguaje de marcado, lo que significa que se utiliza para «marcar» el contenido de un documento, en este caso una página web, con información estructural y semántica que indica a un navegador cómo mostrar una página. Cuando un navegador web carga un documento HTML, utiliza las etiquetas HTML que han marcado el documento para representar el contenido de la página.

La letra «p» representa el elemento párrafo. En este ejemplo, <p> es una etiqueta de apertura que indica al navegador que el contenido que le sigue es un párrafo. La barra en la segunda etiqueta, </p>, indica que es una etiqueta de cierre que le dice al navegador que el elemento párrafo está terminando y que cualquier contenido que aparezca después no es parte del párrafo. Puedes encontrarte con graves problemas de visualización si no te acuerdas de «cerrar» cada etiqueta porque el navegador interpretará este patrón como que el elemento identificado por la etiqueta de apertura debe continuar durante el resto de la página.

Ejemplo de Html

Esta estructura de carpetas es, en esencia, el sitio web. Es esta estructura de carpetas y su contenido lo que finalmente se subirá a un servidor en algún lugar y luego será visto por los millones de usuarios de la web que han estado esperando un sitio web así.

Una estructura de carpetas no es un requisito, es perfectamente posible meter todos los archivos en una sola carpeta y el sitio web se verá y funcionará igual y el usuario nunca notará la diferencia. Sin embargo, imponer una estructura de carpetas (sobre todo en un sitio web grande, que creo que se está convirtiendo en esto) conduce a una mejor organización: por lo general es más fácil encontrar cosas si hay una estructura fácil de seguir en el sitio (y luego está mi estructura, es broma).

Probablemente estés mirando y pensando «Dios mío, le ha dado un número a todo, ¿qué clase de idiota retentivo es este?» – Bueno, soy un ingeniero. A los ingenieros les gusta numerar las cosas, está enterrado en lo más profundo de nosotros.

En Windows no hay distinción entre un archivo llamado Index.HTML y otro llamado index.html (o incluso uno llamado InDeX.hTmL o cualquier combinación de ellos). Si tratas de copiar Index.html en una carpeta que contenga index.html, sustituirá este último por el primero.

Html w3schools

El tipo de documento se ha introducido para marcar la diferencia entre los navegadores antiguos que seguían el formato habitual en los años 90 y los navegadores más recientes que se acercan más a las especificaciones HTML 3 luego 4 y 5.

Su ausencia significa para Internet Explorer que la página está diseñada para los navegadores más antiguos. Esto puede no suponer ninguna diferencia si el latoyout es sencillo, compuesto únicamente por títulos y párrafos, pero si incluimos tablas, capas y otros elementos, la renderización podría cambiar totalmente.

Esta etiqueta es para el servidor que notifica al navegador. Puede omitirse si el servidor está configurado, por ejemplo a través de .htaccess, para asignar el formato a las páginas por una extensión determinada, como html.

Este formato básico suele ser suficiente para todas las situaciones. Existen otros conjuntos de caracteres, como iso-8859-1, pero no aportan nada más en el mundo latino. Para las páginas en chino o japonés, se requiere una codificación diferente.

Denota un contenido típico que puede encontrarse en diferentes páginas, o incluso en diferentes sitios. Puede ser un post de un foro, un artículo de un periódico, y esto sirve para que las herramientas puedan extraer más fácilmente el contenido (separando los datos innecesarios, como los menús de navegación).

Contenido Html

Además de definir partes individuales de su página (como «un párrafo» o «una imagen»), HTML también cuenta con una serie de elementos a nivel de bloque que se utilizan para definir áreas de su sitio web (como «la cabecera», «el menú de navegación», «la columna de contenido principal»). Este artículo analiza cómo planificar la estructura básica de un sitio web y cómo escribir el HTML para representar esta estructura.

Secciones básicas de un documentoLas páginas web pueden tener y tendrán un aspecto bastante diferente entre sí, pero todas suelen compartir componentes estándar similares, a menos que la página muestre un vídeo o un juego a pantalla completa, forme parte de algún tipo de proyecto artístico o simplemente esté mal estructurada:

Enlaces a las secciones principales del sitio; suelen estar representados por botones de menú, enlaces o pestañas. Al igual que la cabecera, este contenido suele ser consistente de una página web a otra: tener una navegación incoherente en tu sitio web sólo hará que los usuarios se sientan confundidos y frustrados. Muchos diseñadores web consideran que la barra de navegación forma parte de la cabecera en lugar de ser un componente individual, pero esto no es un requisito; de hecho, algunos también argumentan que tener las dos separadas es mejor para la accesibilidad, ya que los lectores de pantalla pueden leer las dos características mejor si están separadas.

Scroll al inicio
Ir arriba