ESTRUCTURA HTML
La estructura básica de una página web es la siguiente:
<html> <head></head> <body> </body> </html>
Una estructura HTML se empieza con la etiqueta <html> y acaba con </html>. Todo lo que esté en medio será la página web. Dentro de <html></html> se encuentran 2 partes diferenciadas.La primera <head></head> es la cabecera de la página. Aquí irán cierta información que no es directamente el contenido de la página. Aquí se pone el título de la página, los metadatos, estilos, código javascript (todo esto se estudiará en capítulos venideros). La primera que se suele estudiar es <title></title>, que indica el título de la página (lo que el navegador pone en la parte superior izquierda).
La segunda parte es <body></body>. Aquí va propiamente el contenido de la página: fotos, párrafos, formularios, etc. Por ejemplo, siguiendo con el ejemplo de la página anterior, el siguiente código, podemos cambiar el título de la página.
La segunda parte es <body></body>. Aquí va propiamente el contenido de la página: fotos, párrafos, formularios, etc. Por ejemplo, siguiendo con el ejemplo de la página anterior, el siguiente código, podemos cambiar el título de la página.
<html> <head> <title>Esto es el título de la página.</title> </head> <body> Hola mundo!<br> <b>Esto es negrita.</b><br> <i>Y esto itálica.</i><br> </body> </html>
Para verlo, puedes ver el código fuente de esta misma página. Para eso, haz clic en el botón derecho => ver código fuente, y verás así el código HTML de la página:
Observad el título en la parte superior izquierda de la página. Además, dentro de <body></body> distinguimos varias etiquetas:
<br> => Indica salto de línea. En HTML un salto de línea normal (púlsando la tecla Enter) no produce un salto de línea en el resultado. Es necesario escribir <br> (u otra etiqueta similar).
<b></b> => Indica comienzo y fin de negrita.
<i></b> => Itálica.
<br> => Indica salto de línea. En HTML un salto de línea normal (púlsando la tecla Enter) no produce un salto de línea en el resultado. Es necesario escribir <br> (u otra etiqueta similar).
<b></b> => Indica comienzo y fin de negrita.
<i></b> => Itálica.
También observamos el código &iaacute; => Esto indica que queremos poner una “i” con acento, es decir, “í”. Esto se explicará en un capítulo posterior.
Es importante mencionar que las etiquetas se pueden escribir indistintamente en mayúsculas o minúsculas, es decir <b>Esto es negrita.</b> y <B>Esto es negrita.</B> produce el mismo resultado. Por otro lado, toda etiqueta que se abre (es decir, se pone la etiqueta sin la barra /) debe cerrarse (es decir, poner su equivalente con el símbolo /), si no, el navegador podría dar resultados inesperados. Excepciones a esto son algunas etiquetas que no lo necesitan, como <br> o <hr>.
En HTML5 la estructura interna básica de una página web se ha simplificado, reduciendo el código innecesario hasta quedarse con el esqueleto básico, que sería el siguiente:
Elementos que contiene el <head>:
Todo lo que coloquemos entre las etiquetas <head> y </head>, aunque no se visualiza en el navegador, ofrece información importante sobre la propia página, por lo que en el <head> se introduce información referente a:
ESTRUCTURA HTML5
En HTML5 la estructura interna básica de una página web se ha simplificado, reduciendo el código innecesario hasta quedarse con el esqueleto básico, que sería el siguiente:
<!doctype html> <html> <head> <meta charset="utf-8"/> <title>Título de la web</title> </head> <body> Contenido de la web </body> </html>
Descarga este código o copia, pega y guarda como HTML en cualquier editor.
Cada fichero HTML está compuesto de dos partes. El <head>, donde se añade toda la información que el navegador necesita pero que no se visualiza y el <body>, que agrupa todo el contenido de la página y que el navegador sí que muestra.Elementos que contiene el <head>:
- La codificación de la página (para que aparezcan símbolos como la "ñ", "ç" o los acentos correctamente) utilizando meta charset="utf-8".
- El título de la página, que aparece en la pestaña del navegador (utilizando <title>).
- La descripción de la página, información destinada básicamente a los búscadores (Google, Bing o Yahoo entre otros).
- El código CSS que la página utilizará, ya sea interna o externamente (tratado en el tema: Introducción a CSS).
- La programación en javaScript (en el caso de que se utilice).
<meta name="description" content="Resumen del contenido
de la página">
<style type="text/css"> </style> <link rel=stylesheet href="css/estilo.css" type="text/css"/>
<script type="text/javascript"> </script>
No hay comentarios:
Publicar un comentario