1
00:00:00,000 --> 00:00:02,580
Has aprendido mucho sobre las etiquetas HTML.

2
00:00:02,580 --> 00:00:05,270
Pero, ¿ya sabes lo que HTML significa en realidad?

3
00:00:05,270 --> 00:00:09,621
HTML significa HyperText Markup Language (Lenguaje de Marcas de Hipertexto).

4
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.

5
00:00:14,181 --> 00:00:16,860
Pero, ¿qué significa hipertexto?

6
00:00:16,869 --> 00:00:20,494
En realidad es una frase que fue inventada antes que existiera el Internet,

7
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

8
00:00:23,823 --> 00:00:26,263
al que el lector puede saltar inmediatamente.

9
00:00:26,273 --> 00:00:29,720
Tim Berners-Lee inventó el HTML,

10
00:00:29,720 --> 00:00:32,577
y otras cosas de Internet, como HTTP,

11
00:00:32,577 --> 00:00:34,912
para conectar un texto con otro texto

12
00:00:34,912 --> 00:00:36,822
localizado en cualquier otra parte del mundo.

13
00:00:36,822 --> 00:00:39,191
¿Cómo conectamos páginas web con otras páginas web

14
00:00:39,191 --> 00:00:41,280
en el Lenguaje de Marcas de Hipertexto?

15
00:00:41,282 --> 00:00:43,451
Con un hipervínculo, por supuesto.

16
00:00:43,451 --> 00:00:46,280
Que ahora llamamos simplemente un enlace.

17
00:00:46,280 --> 00:00:48,599
¿Cómo hacemos un enlace en HTML?

18
00:00:48,636 --> 00:00:50,304
Esto es lo raro.

19
00:00:50,304 --> 00:00:52,950
Tal vez pienses que deberíamos usar una etiqueta de enlace...("link")

20
00:00:52,950 --> 00:00:57,633
Pero en realidad, esa etiqueta se usa para otro tipo de enlace en HTML.

21
00:00:57,633 --> 00:01:02,752
En lugar de eso usamos la etiqueta "a" que significa "ancla".

22
00:01:02,752 --> 00:01:06,453
Esta etiqueta ancla el enlace en una cierta posición de la página

23
00:01:06,453 --> 00:01:09,370
y conecta esa ancla a una página web diferente.

24
00:01:09,370 --> 00:01:11,989
Para hacer un enlace, ya sabes, tenemos que escribir la etiqueta,

25
00:01:11,989 --> 00:01:14,621
pero también tenemos que decidir el texto del enlace,

26
00:01:14,621 --> 00:01:17,219
y después la dirección a la que el enlace se va a dirigir.

27
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.

28
00:01:24,748 --> 00:01:29,469
El texto del enlace debe ir dentro de las etiquetas de inicio y fin.

29
00:01:29,469 --> 00:01:31,900
Así que voy a poner mi cursor aquí dentro y voy a escribir,

30
00:01:31,900 --> 00:01:36,610
"Read more about the history of HTML" (Leer más sobre la historia de HTML).

31
00:01:36,610 --> 00:01:41,097
Ahora podemos ver que el texto se ve como un enlace.

32
00:01:41,097 --> 00:01:44,397
Pero todavía no nos lleva a ninguna parte. Tenemos que añadir una dirección.

33
00:01:44,397 --> 00:01:47,480
En realidad no queremos que la dirección se muestre en la página,

34
00:01:47,480 --> 00:01:50,007
pero es necesario que el navegador la conozca.

35
00:01:50,007 --> 00:01:53,140
Así que la ponemos dentro de un atributo de la etiqueta.

36
00:01:53,140 --> 00:01:56,992
En el atributo "href".

37
00:01:56,992 --> 00:01:59,789
¿Qué significa "href"?

38
00:01:59,789 --> 00:02:03,264
Les voy a dar una pista: Han visto esa "h" muchas veces.

39
00:02:03,283 --> 00:02:06,124
¡Significa "hiper"! Hiper-referencia.

40
00:02:06,124 --> 00:02:11,956
Ahora, voy a pegar la dirección, que también se le llama URL.

41
00:02:11,956 --> 00:02:16,050
¿Te fijaste que la URL inicia con "http:"?

42
00:02:16,051 --> 00:02:19,114
¿Adivina qué significa la "h"? ¡Hiper!

43
00:02:19,114 --> 00:02:21,683
HTML se refiere a todo lo hiper.

44
00:02:21,683 --> 00:02:25,744
Esta URL especifica todo lo que el navegador necesita saber para encontrar la página web:

45
00:02:25,744 --> 00:02:28,035
El protocolo utilizado para encontrarlo,

46
00:02:28,035 --> 00:02:30,457
el dominio,

47
00:02:30,457 --> 00:02:34,305
y la ruta para encontrarla en el servidor.

48
00:02:34,305 --> 00:02:38,649
Podemos decir que ésta es una URL absoluta porque lo especifica todo.

49
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.

50
00:02:43,569 --> 00:02:46,179
Eso le indica al navegador que se quede en el dominio actual,

51
00:02:46,179 --> 00:02:48,634
y sólo busque una ruta diferente de ese dominio.

52
00:02:48,645 --> 00:02:50,731
A eso se le llama URL relativa.

53
00:02:50,731 --> 00:02:54,134
Nosotros los usamos todos en Khan Academy cuando hacemos enlaces entre nuestros contenidos.

54
00:02:54,136 --> 00:02:57,623
Deberían poner URLs absolutas en las páginas web que hagan aquí,

55
00:02:57,623 --> 00:02:59,338
para estar seguros.

56
00:02:59,338 --> 00:03:02,146
También podemos decirle al navegador dónde abrir la página:

57
00:03:02,146 --> 00:03:04,768
en la ventana actual, o en una nueva ventana.

58
00:03:04,769 --> 00:03:07,061
Para decirle al navegador que abra el enlace en una nueva ventana,

59
00:03:07,061 --> 00:03:10,798
debemos añadir otro atributo: "target".

60
00:03:10,798 --> 00:03:15,248
'target ="_blank"'

61
00:03:15,248 --> 00:03:19,466
Ahora, quiero que pausen el video y traten de hacer click en el enlace.

62
00:03:19,466 --> 00:03:23,203
Adelante, esperaré.

63
00:03:23,203 --> 00:03:24,462
¿Qué pasó?

64
00:03:24,462 --> 00:03:25,802
Probablemente vieron una advertencia

65
00:03:25,802 --> 00:03:28,244
sobre el enlace de una página web generada por el usuario.

66
00:03:28,244 --> 00:03:30,616
Y luego si presionan "OK", el enlace se abre.

67
00:03:30,616 --> 00:03:33,122
Eso se debe a que tratamos los enlaces de una manera especial

68
00:03:33,122 --> 00:03:34,425
en las páginas web que hacemos aquí.

69
00:03:34,425 --> 00:03:37,797
Porque no queremos que los usuarios piensen que los enlaces están respaldados

70
00:03:37,797 --> 00:03:41,084
por Khan Academy y de pronto lleguen a un sitio web inesperado, de miedo.

71
00:03:41,084 --> 00:03:43,992
Así que cada enlace que hagas aquí tendrá esa advertencia,

72
00:03:43,992 --> 00:03:46,323
y cada enlace se abrirá en una ventana nueva.

73
00:03:46,323 --> 00:03:50,223
Eso significa que en realidad puedo borrar este atributo "target",

74
00:03:50,223 --> 00:03:53,098
porque se ejecuta de cualquier manera.

75
00:03:53,098 --> 00:03:54,420
O, podría dejarlo,

76
00:03:54,420 --> 00:03:57,764
en caso de que quiera mover un día este HTML de Khan Academy

77
00:03:57,764 --> 00:04:00,880
y asegurarme de que el enlace se abrirá en una nueva ventana.

78
00:04:00,880 --> 00:04:02,793
¿Cuándo deberías usar "target"?

79
00:04:02,793 --> 00:04:06,302
Generalemente, si un enlace va a ir a otra página en el mismo dominio,

80
00:04:06,302 --> 00:04:08,023
debería abrir en la misma ventana.

81
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.

82
00:04:12,239 --> 00:04:13,641
Basta de tanto hablar,

83
00:04:13,641 --> 00:04:16,699
déjenme mostrarles otra cosa interesante sobre los enlaces.

84
00:04:16,699 --> 00:04:18,653
Podemos enlazar algo más que textos.

85
00:04:18,653 --> 00:04:21,657
Podemos enlazar imágenes, ¡o texto con imágenes!

86
00:04:21,657 --> 00:04:26,875
Aquí tenemos esta imagen, que es una fotografía de Tim Berners-Lee.

87
00:04:26,875 --> 00:04:30,484
La voy a cortar...

88
00:04:30,484 --> 00:04:34,097
y pegar para que quede aquí dentro de nuestro enlace.

89
00:04:34,097 --> 00:04:36,068
¡Oh! Hermoso.

90
00:04:36,068 --> 00:04:38,958
Ahora si paso el ratón sobre esta imagen,

91
00:04:38,958 --> 00:04:41,309
veo que el cursor cambia a apuntador,

92
00:04:41,309 --> 00:04:44,379
y si presiono en la imagen, me envía a la página web del CERN.

93
00:04:44,379 --> 00:04:46,948
De hecho podrían hacer un enlace de su página entera

94
00:04:46,948 --> 00:04:49,867
y que se convierta en una mancha azul, grande y subrayada.

95
00:04:49,867 --> 00:04:55,830
Pero por favor, ¡no hagan eso!
Amigos, hagan enlaces con amor.