Si no sabes dónde escribir código HTML tienes varias opciones:
- Si quieres algo ligero para empezar puedes usar notepad o notepad++
- Si tienes experiencia con Eclipse, probablemente se te hará fácil usar Aptana Studio 3.
- Si te interesa ASP.NET, puedes utilizar Visual Studio o Visual Studio Express for Web.
- Si estás familiarizado con los programas de adobe, a lo mejor Adobe Dreamweaver es lo tuyo.
- Uno bien ligero y bonito es Sublime Text.
No es recomendable usar notepad, se requiere demasiada precisión y uno tiende a perderse entre tanto código si no existe al menos algo que nos guíe, por lo que mínimo es recomendable usar notepad++. Pero no importa cuál escojas, mientras escribas bien el código todo saldrá de maravilla.
El HTML se compone básicamente de etiquetas o elementos, las etiquetas que estudiaremos en esta publicación tienen la forma:
<nombreDeLaEtiqueta>contenido</nombreDeLaEtiqueta>
Por ejemplo, si queremos colocar en negrita una porción de un texto pondríamos:
Este es un texto <strong> con una parte sombreada </strong> y otra no.
En un navegador la linea anterior se vería así:
Este es un texto con una parte sombreada y otra no.
Vamos ahora a ver algunas etiquetas de HTML:
- <html></html> : Es la etiqueta principal de un documento HTML. Básicamente de identificar el HTML. Debe contener todo el contenido del documento.
- <head></head> : En esta parte colocaremos el título de la página (ese nombre que sale en la barra de título en el navegador), los archivos de CSS y Javascript, entre otras cosas.
- <title></title> : Contiene el título de la página.
- <body></body> : Aquí va el contenido principal de la página: imágenes, texto, botones, menú, etc.
- <header></header> : Representa la cabecera de la etiqueta que lo contiene.
- <h1></h1>,...,<h6></h6> : Definen el tamaño del texto dentro de ellos, donde <h1> es para el texto más grande y <h6> el más pequeño. Usualmente se usan para encabezados, en otros casos se usa CSS para definir el tamaño de la letra.
- <footer></footer> : Representa el pie de la etiqueta que lo contiene.
Veamos un ejemplo bastante sencillo (nota: las partes que empiezan <!-- son comentarios y sirven para explicar algo de la linea siguiente):
Vemos una página bastante simple. Presta atención al código, intenta hacer algunas variaciones y mira cómo va cambiando la página. Recuerda: se aprende a programar programando.
El objetivo en esta publicación era repasar un poco la estructura básica de un documento HTML, algunas etiquetas e ir introduciendo las nuevas etiquetas de HTML5. Además de tener todo listo para empezar a hacer páginas web, no vale la pena colocar ejemplos avanzados si no podemos hacer un hello world.
No hay comentarios:
Publicar un comentario