WEBVTT

00:00:00.000 --> 00:00:02.580
Has aprendido mucho sobre las etiquetas HTML.

00:00:02.580 --> 00:00:05.270
Pero, ¿ya sabes lo que HTML significa en realidad?

00:00:05.270 --> 00:00:09.621
HTML significa HyperText Markup Language (Lenguaje de Marcas de Hipertexto).

00:00:09.621 --> 00:00:14.177
Ahora sabes lo que es el Lenguaje de Marcas (o Lenguaje de Marcado), es una manera de usar etiquetas para marcar contenidos.

00:00:14.181 --> 00:00:16.860
Pero, ¿qué significa hipertexto?

00:00:16.869 --> 00:00:20.494
En realidad es una frase que fue inventada antes que existiera el Internet,

00:00:20.494 --> 00:00:23.823
en la década de 1960, para referirse a un texto que está conectado con otro texto

00:00:23.823 --> 00:00:26.263
al que el lector puede saltar inmediatamente.

00:00:26.273 --> 00:00:29.720
Tim Berners-Lee inventó el HTML,

00:00:29.720 --> 00:00:32.577
y otras cosas de Internet, como HTTP,

00:00:32.577 --> 00:00:34.912
para conectar un texto con otro texto

00:00:34.912 --> 00:00:36.822
localizado en cualquier otra parte del mundo.

00:00:36.822 --> 00:00:39.191
¿Cómo conectamos páginas web con otras páginas web

00:00:39.191 --> 00:00:41.280
en el Lenguaje de Marcas de Hipertexto?

00:00:41.282 --> 00:00:43.451
Con un hipervínculo, por supuesto.

00:00:43.451 --> 00:00:46.280
Que ahora llamamos simplemente un enlace.

00:00:46.280 --> 00:00:48.599
¿Cómo hacemos un enlace en HTML?

00:00:48.636 --> 00:00:50.304
Esto es lo raro.

00:00:50.304 --> 00:00:52.950
Tal vez pienses que deberíamos usar una etiqueta de enlace...("link")

00:00:52.950 --> 00:00:57.633
Pero en realidad, esa etiqueta se usa para otro tipo de enlace en HTML.

00:00:57.633 --> 00:01:02.752
En lugar de eso usamos la etiqueta "a" que significa "ancla".

00:01:02.752 --> 00:01:06.453
Esta etiqueta ancla el enlace en una cierta posición de la página

00:01:06.453 --> 00:01:09.370
y conecta esa ancla a una página web diferente.

00:01:09.370 --> 00:01:11.989
Para hacer un enlace, ya sabes, tenemos que escribir la etiqueta,

00:01:11.989 --> 00:01:14.621
pero también tenemos que decidir el texto del enlace,

00:01:14.621 --> 00:01:17.219
y después la dirección a la que el enlace se va a dirigir.

00:01:17.233 --> 00:01:24.748
Déjenme hacer este enlace a una página con más información sobre el nacimiento de la web.

00:01:24.748 --> 00:01:29.469
El texto del enlace debe ir dentro de las etiquetas de inicio y fin.

00:01:29.469 --> 00:01:31.900
Así que voy a poner mi cursor aquí dentro y voy a escribir,

00:01:31.900 --> 00:01:36.610
"Read more about the history of HTML" (Leer más sobre la historia de HTML).

00:01:36.610 --> 00:01:41.097
Ahora podemos ver que el texto se ve como un enlace.

00:01:41.097 --> 00:01:44.397
Pero todavía no nos lleva a ninguna parte. Tenemos que añadir una dirección.

00:01:44.397 --> 00:01:47.480
En realidad no queremos que la dirección se muestre en la página,

00:01:47.480 --> 00:01:50.007
pero es necesario que el navegador la conozca.

00:01:50.007 --> 00:01:53.140
Así que la ponemos dentro de un atributo de la etiqueta.

00:01:53.140 --> 00:01:56.992
En el atributo "href".

00:01:56.992 --> 00:01:59.789
¿Qué significa "href"?

00:01:59.789 --> 00:02:03.264
Les voy a dar una pista: Han visto esa "h" muchas veces.

00:02:03.283 --> 00:02:06.124
¡Significa "hiper"! Hiper-referencia.

00:02:06.124 --> 00:02:11.956
Ahora, voy a pegar la dirección, que también se le llama URL.

00:02:11.956 --> 00:02:16.050
¿Te fijaste que la URL inicia con "http:"?

00:02:16.051 --> 00:02:19.114
¿Adivina qué significa la "h"? ¡Hiper!

00:02:19.114 --> 00:02:21.683
HTML se refiere a todo lo hiper.

00:02:21.683 --> 00:02:25.744
Esta URL especifica todo lo que el navegador necesita saber para encontrar la página web:

00:02:25.744 --> 00:02:28.035
El protocolo utilizado para encontrarlo,

00:02:28.035 --> 00:02:30.457
el dominio,

00:02:30.457 --> 00:02:34.305
y la ruta para encontrarla en el servidor.

00:02:34.305 --> 00:02:38.649
Podemos decir que ésta es una URL absoluta porque lo especifica todo.

00:02:38.649 --> 00:02:43.569
En algunas páginas web, podrías encontrar URLs que inicien con una diagonal y una ruta.

00:02:43.569 --> 00:02:46.179
Eso le indica al navegador que se quede en el dominio actual,

00:02:46.179 --> 00:02:48.634
y sólo busque una ruta diferente de ese dominio.

00:02:48.645 --> 00:02:50.731
A eso se le llama URL relativa.

00:02:50.731 --> 00:02:54.134
Nosotros los usamos todos en Khan Academy cuando hacemos enlaces entre nuestros contenidos.

00:02:54.136 --> 00:02:57.623
Deberían poner URLs absolutas en las páginas web que hagan aquí,

00:02:57.623 --> 00:02:59.338
para estar seguros.

00:02:59.338 --> 00:03:02.146
También podemos decirle al navegador dónde abrir la página:

00:03:02.146 --> 00:03:04.768
en la ventana actual, o en una nueva ventana.

00:03:04.769 --> 00:03:07.061
Para decirle al navegador que abra el enlace en una nueva ventana,

00:03:07.061 --> 00:03:10.798
debemos añadir otro atributo: "target".

00:03:10.798 --> 00:03:15.248
'target ="_blank"'

00:03:15.248 --> 00:03:19.466
Ahora, quiero que pausen el video y traten de hacer click en el enlace.

00:03:19.466 --> 00:03:23.203
Adelante, esperaré.

00:03:23.203 --> 00:03:24.462
¿Qué pasó?

00:03:24.462 --> 00:03:25.802
Probablemente vieron una advertencia

00:03:25.802 --> 00:03:28.244
sobre el enlace de una página web generada por el usuario.

00:03:28.244 --> 00:03:30.616
Y luego si presionan "OK", el enlace se abre.

00:03:30.616 --> 00:03:33.122
Eso se debe a que tratamos los enlaces de una manera especial

00:03:33.122 --> 00:03:34.425
en las páginas web que hacemos aquí.

00:03:34.425 --> 00:03:37.797
Porque no queremos que los usuarios piensen que los enlaces están respaldados

00:03:37.797 --> 00:03:41.084
por Khan Academy y de pronto lleguen a un sitio web inesperado, de miedo.

00:03:41.084 --> 00:03:43.992
Así que cada enlace que hagas aquí tendrá esa advertencia,

00:03:43.992 --> 00:03:46.323
y cada enlace se abrirá en una ventana nueva.

00:03:46.323 --> 00:03:50.223
Eso significa que en realidad puedo borrar este atributo "target",

00:03:50.223 --> 00:03:53.098
porque se ejecuta de cualquier manera.

00:03:53.098 --> 00:03:54.420
O, podría dejarlo,

00:03:54.420 --> 00:03:57.764
en caso de que quiera mover un día este HTML de Khan Academy

00:03:57.764 --> 00:04:00.880
y asegurarme de que el enlace se abrirá en una nueva ventana.

00:04:00.880 --> 00:04:02.793
¿Cuándo deberías usar "target"?

00:04:02.793 --> 00:04:06.302
Generalemente, si un enlace va a ir a otra página en el mismo dominio,

00:04:06.302 --> 00:04:08.023
debería abrir en la misma ventana.

00:04:08.023 --> 00:04:12.229
Y si va a una página en otro dominio, debería abrir en una ventana nueva.

00:04:12.239 --> 00:04:13.641
Basta de tanto hablar,

00:04:13.641 --> 00:04:16.699
déjenme mostrarles otra cosa interesante sobre los enlaces.

00:04:16.699 --> 00:04:18.653
Podemos enlazar algo más que textos.

00:04:18.653 --> 00:04:21.657
Podemos enlazar imágenes, ¡o texto con imágenes!

00:04:21.657 --> 00:04:26.875
Aquí tenemos esta imagen, que es una fotografía de Tim Berners-Lee.

00:04:26.875 --> 00:04:30.484
La voy a cortar...

00:04:30.484 --> 00:04:34.097
y pegar para que quede aquí dentro de nuestro enlace.

00:04:34.097 --> 00:04:36.068
¡Oh! Hermoso.

00:04:36.068 --> 00:04:38.958
Ahora si paso el ratón sobre esta imagen,

00:04:38.958 --> 00:04:41.309
veo que el cursor cambia a apuntador,

00:04:41.309 --> 00:04:44.379
y si presiono en la imagen, me envía a la página web del CERN.

00:04:44.379 --> 00:04:46.948
De hecho podrían hacer un enlace de su página entera

00:04:46.948 --> 00:04:49.867
y que se convierta en una mancha azul, grande y subrayada.

00:04:49.867 --> 00:04:55.830
Pero por favor, ¡no hagan eso!
Amigos, hagan enlaces con amor.