Etiquetas HTML ¿Que son?

Bienvenidos a mi primer post. Quiero comenzar con este primer tutorial de html básico que yo escribí e ilustré. Aquí muestro claramente y con los términos correctos que son las etiquetas html.

Yo sé que aquí hay muchos expertos pero siempre puede ser de utilidad para alguien, y nunca está de más recordar un poco de lo básico. Si alguien tiene alguna duda o comentario siempre son muy bien recibidos.


Html son las siglas de “Hyper Text Markup Language” que significa “Lenguaje de Marcado de Hipertexto”.
Este lenguaje describe a través de etiquetas la apariencia de una página web y para poder utilizarlo no se requiere de costoso software especializado, cualquier procesador de palabras es suficiente aunque sea tan básico como el Notepad que viene instalado con el sistema operativo para los usuarios de Windows o el Gedit para los usuarios Linux.

En capítulos siguientes hablaremos un poco sobre qué programas nos ayudan a trabajar con mayor comodidad mientras desarrollamos nuestro sitio. Por ahora entendamos cómo funciona el lenguaje y las etiquetas.

Las etiquetas de html comienzan con un signo de menor que, después describen al elemento al que pertenecen ya sea con una palabra, una abreviatura o una inicial y por último un signo de mayor qué. Por ejemplo la etiqueta: <p>
Etiquetas HTML ¿Que son?

Esta etiqueta describe por medio de la letra “p” que pertenece al elemento “paragraph” o párrafo en español. No todos los elementos requieren etiquetas de cierre, pero sí la mayoría y para eso utilizamos la misma etiqueta pero agregando una diagonal justo después del signo de menor qué y antes de la descripción del elemento: </p>
aprende

Entre estas dos partes de la etiqueta (la parte que abre y la que cierra) se coloca el contenido que será descrito, en este caso el texto que queremos mostrar como un párrafo: <p>Mi primer párrafo</p>
html

De este modo podemos tratar de pensar en las etiquetas como unos paréntesis que encierran el contenido a mostrar y todo junto es un elemento que será interpretado por un navegador (G Crome, Firefox, IE, Opera, etc.).
Mientras estamos escribiendo el código de nuestra página empleamos muchos elementos y algunos quedarán dentro de otros, por lo que es bueno acostumbrarse a abrir y cerrar las etiquetas inmediatamente para así evitar errores al momento de mostrar la página.
Un ejemplo de elementos que se colocan dentro de otros sería el usar una etiqueta para hacer palabras en bold o itálicas dentro de un párrafo. Utilizando nuestro ejemplo anterior: <p>Mi primer párrafo</p> Me gustaría que la palabra párrafo sobresalga en bold, y para eso necesito encerrar esa palabra entre las etiquetas <b> y </b> del siguiente modo: <p>Mi primer <b>párrafo</b></p> y el resultado final visto en un navegador sería: Mi primer párrafo
Etiquetas
Valor

Los elementos que no requieren de una etiqueta de cierra son llamados “Elementos vacíos”. Se llaman así porque no poseen un contenido. Un ejemplo es la etiqueta <hr> que muestra en los navegadores una línea divisora.
En otros lenguajes como XML Y XHTML se requiere que el elemento vacío tenga un espacio y una diagonal antes del signo de mayor qué. Y aunque no es necesario en HTML es bueno acostumbrarse a utilizarlo con el espacio y la diagonal no solo por compatibilidad, también porque en algún momento será necesario aprender a utilizar otros lenguajes en tu sitio y te será más sencillo. Entonces tus elementos vacíos se verán así: <hr />
elemento

Las etiquetas de apertura así como las etiquetas de los elementos vacíos pueden contener a su vez atributos que detallan de manera más específica la descripción de nuestro elemento. Por ejemplo a una etiqueta “<form></form>” que ya nos indica que su contenido será un formulario, puede especificar si tendrá un estilo o a que archivo enviará la información que reciba entre otras cosas.
Para agregar un atributo al formulario debemos dar un espacio dentro de la etiqueta de apertura antes del signo de mayor qué y ahí escribir el nombre del atributo seguido de su valor: <form action=”enviar.php”></form>
atributo

En este caso el atributo “action” contiene el valor “enviar.php”. Si se desea agregar un nuevo atributo lo único que se debe hacer es escribirlo del mismo modo antes del signo de mayor que: <form action=”enviar.php” id=”consulta”></form>

En resumen en esta primera entrega debes comprender lo que es un elemento, una etiqueta, contenido, artibuto y valor.
etiqueta de apertura

En el siguiente tutorial escribiré sobre la estructura básica de una página html.

Tambien pueden leerlo dentro de mi página web http://www.ecalli.com

Si leíste hasta aquí, puede ser que te gustó ¡Comenta!

Fuentes de Información - Etiquetas HTML ¿Que son?

El contenido del post es de mi autoría, y/o, es un recopilación de distintas fuentes.

Dar puntos
5 Puntos
Votos: 0 - T!score: 0/10
  • 0 Seguidores
  • 318 Visitas
  • 1 Favoritos

1 comentario - Etiquetas HTML ¿Que son?