WEBVTT

00:00:00.192 --> 00:00:02.681
Los enlaces son una gran manera de conectar

00:00:02.681 --> 00:00:04.735
una página web con otra página web.

00:00:04.737 --> 00:00:07.236
Pero también pueden conectar una parte de una página web

00:00:07.236 --> 00:00:09.487
con otra parte de la misma página web,

00:00:09.487 --> 00:00:13.885
especialmente en páginas web muy largas, como para una tabla de contenidos.

00:00:13.885 --> 00:00:16.884
He añadido mucha información a esta página,

00:00:16.884 --> 00:00:19.501
así que puedo darles información sobre la historia de la web,

00:00:19.501 --> 00:00:22.046
y las historia de las versiones de HTML.

00:00:22.046 --> 00:00:26.256
Pienso que toda esta información merece el uso de una tabla de contenidos.

00:00:26.256 --> 00:00:29.420
Y ya empecé una aquí, sólo es una lista desordenada,

00:00:29.420 --> 00:00:32.901
con una lista de elementos de cada uno de los títulos de las secciones.

00:00:32.901 --> 00:00:35.516
Y quiero enlazar cada uno de esos títulos de las secciones,

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.

00:00:38.648 --> 00:00:41.701
Para hacer eso, voy a usar otra vez la etiqueta "a",

00:00:41.701 --> 00:00:44.952
así que empezaré por poner este título

00:00:44.952 --> 00:00:48.654
dentro del inicio y fin de la etiqueta "a".

00:00:48.654 --> 00:00:54.854
Ahora, ¿qué debe ir en "href" de este enlace?

00:00:54.854 --> 00:00:57.808
Bueno, debemos decirle al navegador de alguna manera

00:00:57.808 --> 00:01:00.069
hacia dónde debe saltar en la página web.

00:01:00.069 --> 00:01:03.493
Alguna manera de identificar de forma única esa parte de la página.

00:01:03.493 --> 00:01:06.337
Si ya has aprendido de selectores de CSS,

00:01:06.337 --> 00:01:09.358
de hecho has visto cómo hacer esto.

00:01:09.358 --> 00:01:13.936
Podemos hacerlo añadiendo un atributo "id" a la etiqueta.

00:01:13.936 --> 00:01:18.777
Vamos a desplazarnos hacia abajo y encontrar el encabezado.

00:01:18.777 --> 00:01:22.931
Y vamos a poner el atributo "id" a este encabezado.

00:01:22.931 --> 00:01:25.366
Así que voy a poner mi cursor en 

00:01:25.366 --> 00:01:27.429
voy a teclear id="

00:01:27.429 --> 00:01:30.082
y poner un buen identificador que sea único,

00:01:30.082 --> 00:01:32.956
como "web-history".

00:01:32.975 --> 00:01:35.916
Ok, vamos a desplazarnos de vuelta al enlace.

00:01:35.916 --> 00:01:39.556
Y ahora, para decirle al navegador que vaya a este enlace interno,

00:01:39.556 --> 00:01:41.797
debemos empezar con el signo numeral (#),

00:01:41.797 --> 00:01:46.230
y luego teclear exactamente el identificador que tecleamos abajo.

00:01:46.230 --> 00:01:48.090
Ok, así que ahora...

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.

00:01:51.449 --> 00:01:56.327
Adelante, esperaré. "Clicky-clicky-clicky"

00:01:56.327 --> 00:01:59.707
Ok.¿Vieron cómo se desplazó hasta esta sección?

00:01:59.707 --> 00:02:01.208
Entonces ¡funciona!

00:02:01.208 --> 00:02:02.877
Podemos añadir más enlaces como éste

00:02:02.877 --> 00:02:05.555
poniendo atributos en cada encabezado,

00:02:05.555 --> 00:02:07.795
y haciendo etiquetas "" que apunten a ellos.

00:02:07.795 --> 00:02:09.548
Pero dejaré que ustedes traten de hacerlo.

00:02:09.548 --> 00:02:12.153
Lo más importante que deben recordar es que los IDs (identificadores) deben ser únicos,

00:02:12.153 --> 00:02:15.452
porque de otra manera el navegador no sabrá hacia dónde dirigirse.

00:02:15.452 --> 00:02:17.671
Así que háganlos lindos y descriptivos.