Vamos a programar #3 - Estructura básica de una página HTML
Hola de nuevo a todos, el día de hoy voy a resolver dudas que les surgieron a muchos cuando hicimos la calculadora de resistencias. Es cierto que mi intención no era enseñarte a programar en HTML, pero muchos me preguntaron por MP como es que funcionaba el código completo, por que las etiquetas X iban antes que las Y, etc.
Por eso el día de hoy les voy a mostrar solo un poquito cómo es que esta estructurado el HTML.
Es posible crear una página web muy sencilla en pocos pasos ya que todas tienen una estructura básica que seguir.
Todas las paginas utilizan "etiquetas" y las mas importantes son:
<HTML> <HEAD> <TITLE> <BODY>
Estas se organizan de forma jerárquica, en donde la mas alta es <HTML>. Una pagina debe de empezar con esta etiqueta y terminar con su respectivo cierre </HTML>
La siguiente etiqueta es: <HEAD>, Esta etiqueta es el encabezado de la pagina, aquí se puede incluir las características de la pagina, añadir los estilos CSS, el título y funciones de javascript, vbscript, etc. Ademas dentro de esta etiqueta se debe de incluir la etiqueta <TITLE>, esta sirve para cambiar el titulo que se muestra en la barra de titulo del navegador o como titulo de la pestaña. Hay que recordar que todas las etiquetas deben de llevar su respectivo cierre, en este caso como usamos la etiqueta <TITLE>, debemos de escribir el texto que queremos usar y de inmediato poner el cierre </TITLE>. Una vez que agregamos todo lo que necesitamos en el encabezado, también cerraremos el encabezado con </HEAD>.
Después viene la parte del cuerpo, en esta parte se incluirán los elementos que se mostraran al usuario; es decir: Texto, imágenes, vídeos, formularios, etc. La etiqueta <BODY> se usa para indicar que ahí es el comienzo del cuerpo. Dentro de esta etiqueta se pueden poner la mayoría de los elementos que componen a una pagina web: imágenes <IMG></IMG>, formularios <FORM></FORM>, vinculos <A></A>, etc. finalmente se debe de ponder la etiqueta de cierre </BODY> y generalmente no hay nada que agragar despues del cierre del cuerpo asi que tambien hay que cerrar la etiqueta principal </HTML> y con esto se entiende que la pagina ha llegado a su fin.
Algo que es importante resaltar es que el HTML no reconoce minúsculas de mayúsculas, así que es valido; por ejemplo; poner <BODY> que <Body> o <body> y tampoco se toma en cuenta los espacios por lo que se pude poner:
o
<title>
Hola mundo
</title>
En ambos casos le estamos indicando que el titulo de la pagina es "Hola mundo", solo que en el primer ejemplo todo está escrito en la misma linea. Por recomendación deberías de usar el primer ejemplo, este ahorra datos porque en el no se incluyen los saltos de línea.
Y ya para terminar un ejemplo del programa mas básico de todos.
<HTML>
<HEAD>
<TITLE>Hola Mundo</TITLE>
</HEAD>
<BODY>
Esta cuenta como una pagina funcional que muestra hola mundo.
</BODY>
</HTMl>
Y ya para terminar un ejemplo del programa mas básico de todos.
<HTML>
<HEAD>
<TITLE>Hola Mundo</TITLE>
</HEAD>
<BODY>
Esta cuenta como una pagina funcional que muestra hola mundo.
</BODY>
</HTMl>
La única función del código anterior es mostrar "Esta cuenta como una pagina funcional que muestra hola mundo.", para probarlo en un navegador puedes escribir todo el código anterior en un bloc de notas y guardarlo en archivo con extensión html ("Hello.html" es un nombre por ejemplo). Después lo abres en un navegador de Internet y el resultado deberá de ser similar al siguiente:
Y con esto ya sabrás como es que funciona de forma básica el HTML. ya después veremos cuestiones un poco mas avanzadas. Por lo mientras puedes ver como funciona el código que hicimos antes y comparar con lo que acabas de leer.
Los leo luego.
No hay comentarios.