HTML es el lenguaje estándar para el desarrollo de páginas web, este lenguaje es el encargado de dar la estructura a nuestra páginas.
Hay que tener presente que HTML no es un lenguaje de programación si no un lenguaje de marcado, el cual es interpretado por el navegador para generar nuestra pagina, claro el omitir saber esto no cambia como funciona pero nunca esta de menos saberlo.
HTML al igual que cualquier otro lenguaje tiene sus propias normas para interpretarse, en este concreto caso usa etiquetas de marcado, estas etiquetas normalmente encierran el contenido que se desea que englobe.
Para entenderlo mejor, las etiquetas son las encargadas de decidir que tipo de contenido estamos colocando, ya sea una imagen un texto o un audio.
Las etiquetas tienen una estructura general que es:
<a
>Link</a
>
Como se muestra se emplean los signos de mayor y menor que para encerrar el nombre de la etiqueta, en este caso se trata de un enlace porque la etiqueta encerrada es
a.
Antes de seguir y para poder entenderlo mejor les hablare sobre los comentarios en html.
Comentarios
Los comentarios son párrafos dentro de nuestro código html el cual sirve para identificar o para separar partes de nuestro html, los comentarios se encierran dentro de las siguientes etiquetas:
<!-- Comentario -->
Este párrafo escrito dentro del html no significara nada y el navegador lo ignorará, no se visualiza en nuestra página, por lo tanto es útil para emplearlo en partes que sean difícil de recordar o para indicar alguna sección que requiera cambios.
Etiquetas
Ahora que sabemos que son los comentarios y como usarlos los podremos usar para nuestro ejemplo de etiquetas.
<a>Link</a> <!-- Enlace o vinculo -->
Como se aprecia en el ejemplo las etiquetas normalmente tienen 3 secciones:
Etiqueta de apertura:
<a>
Contenido que encierra:
Link
Etiqueta de Cierre*:
</a>
Se debe aclarar que no todas las etiquetas tienen algún cierre pero si la mayoría y las que no lo tengan serán tratadas igualmente en este pequeño curso
Ahora debemos mirar directamente a la etiqueta y empezar a desglozarla y nos damos cuenta que las etiquetas también tiene partes internas:
<a>link</a>
Etiqueta de apertura
Apertura de etiqueta:
<
Nombre de la etiqueta:
a
Cierre de la etiqueta:
>
Si nos fijamos notaremos la diferencia que existe entre la etiqueta de apertura con la de cierre y esa diferencia es: <
/> la barra diagonal o slash, el cual nos indica que se trata de la etiqueta de cierre.
Etiqueta de Cierre
Apertura de etiqueta:
<
Diagonal o slash:
/
Nombre de la etiqueta:
a
Cierre de la etiqueta:
>
Un punto importante aunque tal vez muy simple es el echo de que tanto la etiqueta de apertura como la de cierre deben llevar el mismo nombre, para este
ejemplo es
a.
Propiedades de etiquetas
Ahora que ya sabemos como crear las etiquetas vamos a aprender un poco acerca de las propiedades de las etiquetas y como se declaran.
En el ejemplo anterior usábamos
"<a>Link</a>" y habíamos dicho que se trataba de un enlace o vinculo a otra página, pero realmente este "vinculo" no hace nada porque no esta enlazado a ninguna pagina, es más si lo escribimos tal cual en html ni siquiera lo considerará un enlace. Para eso están las propiedades, pero en este punto solo mostrare como se declaran y no ampliare su uso porque esto solo es una "no tan pequeña" introducción.
Siguiendo con nuestro ejemplo:
<a
href="http://webdesde0.blogspot.com">Visita nuestra Página Web</a>
Como te habrás dado cuenta realice unos pequeños cambios a nuestra etiqueta de enlace y adicionalmente agregue un texto más largo y representativo a su contenido:
Visita nuestra Página Web.
El resultado de esa etiqueta sería algo como esto: Visita nuestra Página Web
Como se había mencionado las etiquetas encierran un contenido y todo el contenido que se encuentre dentro de ellas es afectado por la etiqueta sin importar que existan espacios o cuan largo sea el contenido.
Ahora si podemos hablar de las propiedades y su declaración:
<a href=" ">link</a>
Las propiedades están establecidas por el organismo encargado de la estandarización de la web
W3C y son declaradas después del nombre de la etiqueta:
<a href
precedido del signo "igual":
<a href=
Finalizando con comillas simples o dobles para encerrar el valor de la propiedad:
<a href="valor">
En el caso de los vinculos se tratan enlaces a otros o al mismo sitio web. Con esto termino la introducción sobre los puntos más importantes desde mi punto de vista.
Nota Aparte: Tal vez si ya conoces sobre HTML te preguntes porque empecé con etiquetas y no hablando sobre la estructura real de html, esto es porque desde mi perspectiva es importante conocer las etiquetas y su declaración para poder entender como se estructura el html. Muchas veces cuando empezamos a aprender html hacemos la estructura que nos dicen pero sin entender porque deben llevar esa sintaxis, es por eso que decidí empezar por el medio para luego ir al principio.
Si te gusto esta entrada puedes seguir las siguientes para que sigas aprendiendo sobre html o dejar algún comentario sobre lo que pienses de este curso.