1
00:00:00,192 --> 00:00:02,681
Los enlaces son una gran manera de conectar

2
00:00:02,681 --> 00:00:04,735
una página web con otra página web.

3
00:00:04,737 --> 00:00:07,236
Pero también pueden conectar una parte de una página web

4
00:00:07,236 --> 00:00:09,487
con otra parte de la misma página web,

5
00:00:09,487 --> 00:00:13,885
especialmente en páginas web muy largas, como para una tabla de contenidos.

6
00:00:13,885 --> 00:00:16,884
He añadido mucha información a esta página,

7
00:00:16,884 --> 00:00:19,501
así que puedo darles información sobre la historia de la web,

8
00:00:19,501 --> 00:00:22,046
y las historia de las versiones de HTML.

9
00:00:22,046 --> 00:00:26,256
Pienso que toda esta información merece el uso de una tabla de contenidos.

10
00:00:26,256 --> 00:00:29,420
Y ya empecé una aquí, sólo es una lista desordenada,

11
00:00:29,420 --> 00:00:32,901
con una lista de elementos de cada uno de los títulos de las secciones.

12
00:00:32,901 --> 00:00:35,516
Y quiero enlazar cada uno de esos títulos de las secciones,

13
00:00:35,516 --> 00:00:38,648
de manera que cuando presionen el ratón en alguno de ellos, vayan a la parte de la página que corresponde.

14
00:00:38,648 --> 00:00:41,701
Para hacer eso, voy a usar otra vez la etiqueta "a",

15
00:00:41,701 --> 00:00:44,952
así que empezaré por poner este título

16
00:00:44,952 --> 00:00:48,654
dentro del inicio y fin de la etiqueta "a".

17
00:00:48,654 --> 00:00:54,854
Ahora, ¿qué debe ir en "href" de este enlace?

18
00:00:54,854 --> 00:00:57,808
Bueno, debemos decirle al navegador de alguna manera

19
00:00:57,808 --> 00:01:00,069
hacia dónde debe saltar en la página web.

20
00:01:00,069 --> 00:01:03,493
Alguna manera de identificar de forma única esa parte de la página.

21
00:01:03,493 --> 00:01:06,337
Si ya has aprendido de selectores de CSS,

22
00:01:06,337 --> 00:01:09,358
de hecho has visto cómo hacer esto.

23
00:01:09,358 --> 00:01:13,936
Podemos hacerlo añadiendo un atributo "id" a la etiqueta.

24
00:01:13,936 --> 00:01:18,777
Vamos a desplazarnos hacia abajo y encontrar el encabezado.

25
00:01:18,777 --> 00:01:22,931
Y vamos a poner el atributo "id" a este encabezado.

26
00:01:22,931 --> 00:01:25,366
Así que voy a poner mi cursor en 

27
00:01:25,366 --> 00:01:27,429
voy a teclear id="

28
00:01:27,429 --> 00:01:30,082
y poner un buen identificador que sea único,

29
00:01:30,082 --> 00:01:32,956
como "web-history".

30
00:01:32,975 --> 00:01:35,916
Ok, vamos a desplazarnos de vuelta al enlace.

31
00:01:35,916 --> 00:01:39,556
Y ahora, para decirle al navegador que vaya a este enlace interno,

32
00:01:39,556 --> 00:01:41,797
debemos empezar con el signo numeral (#),

33
00:01:41,797 --> 00:01:46,230
y luego teclear exactamente el identificador que tecleamos abajo.

34
00:01:46,230 --> 00:01:48,090
Ok, así que ahora...

35
00:01:48,090 --> 00:01:51,449
Pausen esta guía paso a paso, y traten de presionar el ratón en el enlace.

36
00:01:51,449 --> 00:01:56,327
Adelante, esperaré. "Clicky-clicky-clicky"

37
00:01:56,327 --> 00:01:59,707
Ok.¿Vieron cómo se desplazó hasta esta sección?

38
00:01:59,707 --> 00:02:01,208
Entonces ¡funciona!

39
00:02:01,208 --> 00:02:02,877
Podemos añadir más enlaces como éste

40
00:02:02,877 --> 00:02:05,555
poniendo atributos en cada encabezado,

41
00:02:05,555 --> 00:02:07,795
y haciendo etiquetas "" que apunten a ellos.

42
00:02:07,795 --> 00:02:09,548
Pero dejaré que ustedes traten de hacerlo.

43
00:02:09,548 --> 00:02:12,153
Lo más importante que deben recordar es que los IDs (identificadores) deben ser únicos,

44
00:02:12,153 --> 00:02:15,452
porque de otra manera el navegador no sabrá hacia dónde dirigirse.

45
00:02:15,452 --> 00:02:17,671
Así que háganlos lindos y descriptivos.