Has aprendido mucho sobre las etiquetas HTML.
Pero, ¿ya sabes lo que HTML significa en realidad?
HTML significa HyperText Markup Language (Lenguaje de Marcas de Hipertexto).
Ahora sabes lo que es el Lenguaje de Marcas (o Lenguaje de Marcado), es una manera de usar etiquetas para marcar contenidos.
Pero, ¿qué significa hipertexto?
En realidad es una frase que fue inventada antes que existiera el Internet,
en la década de 1960, para referirse a un texto que está conectado con otro texto
al que el lector puede saltar inmediatamente.
Tim Berners-Lee inventó el HTML,
y otras cosas de Internet, como HTTP,
para conectar un texto con otro texto
localizado en cualquier otra parte del mundo.
¿Cómo conectamos páginas web con otras páginas web
en el Lenguaje de Marcas de Hipertexto?
Con un hipervínculo, por supuesto.
Que ahora llamamos simplemente un enlace.
¿Cómo hacemos un enlace en HTML?
Esto es lo raro.
Tal vez pienses que deberíamos usar una etiqueta de enlace...("link")
Pero en realidad, esa etiqueta se usa para otro tipo de enlace en HTML.
En lugar de eso usamos la etiqueta "a" que significa "ancla".
Esta etiqueta ancla el enlace en una cierta posición de la página
y conecta esa ancla a una página web diferente.
Para hacer un enlace, ya sabes, tenemos que escribir la etiqueta,
pero también tenemos que decidir el texto del enlace,
y después la dirección a la que el enlace se va a dirigir.
Déjenme hacer este enlace a una página con más información sobre el nacimiento de la web.
El texto del enlace debe ir dentro de las etiquetas de inicio y fin.
Así que voy a poner mi cursor aquí dentro y voy a escribir,
"Read more about the history of HTML" (Leer más sobre la historia de HTML).
Ahora podemos ver que el texto se ve como un enlace.
Pero todavía no nos lleva a ninguna parte. Tenemos que añadir una dirección.
En realidad no queremos que la dirección se muestre en la página,
pero es necesario que el navegador la conozca.
Así que la ponemos dentro de un atributo de la etiqueta.
En el atributo "href".
¿Qué significa "href"?
Les voy a dar una pista: Han visto esa "h" muchas veces.
¡Significa "hiper"! Hiper-referencia.
Ahora, voy a pegar la dirección, que también se le llama URL.
¿Te fijaste que la URL inicia con "http:"?
¿Adivina qué significa la "h"? ¡Hiper!
HTML se refiere a todo lo hiper.
Esta URL especifica todo lo que el navegador necesita saber para encontrar la página web:
El protocolo utilizado para encontrarlo,
el dominio,
y la ruta para encontrarla en el servidor.
Podemos decir que ésta es una URL absoluta porque lo especifica todo.
En algunas páginas web, podrías encontrar URLs que inicien con una diagonal y una ruta.
Eso le indica al navegador que se quede en el dominio actual,
y sólo busque una ruta diferente de ese dominio.
A eso se le llama URL relativa.
Nosotros los usamos todos en Khan Academy cuando hacemos enlaces entre nuestros contenidos.
Deberían poner URLs absolutas en las páginas web que hagan aquí,
para estar seguros.
También podemos decirle al navegador dónde abrir la página:
en la ventana actual, o en una nueva ventana.
Para decirle al navegador que abra el enlace en una nueva ventana,
debemos añadir otro atributo: "target".
'target ="_blank"'
Ahora, quiero que pausen el video y traten de hacer click en el enlace.
Adelante, esperaré.
¿Qué pasó?
Probablemente vieron una advertencia
sobre el enlace de una página web generada por el usuario.
Y luego si presionan "OK", el enlace se abre.
Eso se debe a que tratamos los enlaces de una manera especial
en las páginas web que hacemos aquí.
Porque no queremos que los usuarios piensen que los enlaces están respaldados
por Khan Academy y de pronto lleguen a un sitio web inesperado, de miedo.
Así que cada enlace que hagas aquí tendrá esa advertencia,
y cada enlace se abrirá en una ventana nueva.
Eso significa que en realidad puedo borrar este atributo "target",
porque se ejecuta de cualquier manera.
O, podría dejarlo,
en caso de que quiera mover un día este HTML de Khan Academy
y asegurarme de que el enlace se abrirá en una nueva ventana.
¿Cuándo deberías usar "target"?
Generalemente, si un enlace va a ir a otra página en el mismo dominio,
debería abrir en la misma ventana.
Y si va a una página en otro dominio, debería abrir en una ventana nueva.
Basta de tanto hablar,
déjenme mostrarles otra cosa interesante sobre los enlaces.
Podemos enlazar algo más que textos.
Podemos enlazar imágenes, ¡o texto con imágenes!
Aquí tenemos esta imagen, que es una fotografía de Tim Berners-Lee.
La voy a cortar...
y pegar para que quede aquí dentro de nuestro enlace.
¡Oh! Hermoso.
Ahora si paso el ratón sobre esta imagen,
veo que el cursor cambia a apuntador,
y si presiono en la imagen, me envía a la página web del CERN.
De hecho podrían hacer un enlace de su página entera
y que se convierta en una mancha azul, grande y subrayada.
Pero por favor, ¡no hagan eso! Amigos, hagan enlaces con amor.