1
00:00:00,110 --> 00:00:08,050
Muy buenos días, vamos a empezar con el video tutorial de la práctica 3 de HTML que a algunos se os ha atragantado un poco, ¿vale?

2
00:00:08,949 --> 00:00:14,570
En primer lugar estamos aquí en nuestro menú principal de Replit, ¿vale? Para el que no sepa cómo llegar tiene que ir a Profile

3
00:00:14,570 --> 00:00:24,210
y tenéis que ir a Reps, ¿vale? En vuestros Reps van a aparecer los archivos que ya tenéis creados, ¿vale?

4
00:00:24,210 --> 00:00:27,129
Este lo voy a borrar para empezar de nuevo, ¿vale?

5
00:00:27,129 --> 00:00:30,550
Con la práctica 3, este es uno de Python que tengo que no vais a necesitar.

6
00:00:31,089 --> 00:00:32,609
Le damos aquí a Create, ¿vale?

7
00:00:32,609 --> 00:00:37,210
A Create, REPL es como Replit llama a los programas.

8
00:00:37,409 --> 00:00:42,990
Vamos a crear HTML y decimos que se va a llamar la práctica 3, ¿vale?

9
00:00:42,990 --> 00:00:51,649
Muy bien, le damos a Create REPL y aparece ya el archivo vacío con el Hello World, ¿vale?

10
00:00:51,649 --> 00:00:53,369
Si le damos a Run, aquí nos aparece Hello World.

11
00:00:53,369 --> 00:01:03,649
Muy bien, tenemos nuestra página de index, ¿vale? Lo que queremos es insertar hipervínculos para pasar de una página a otra, es decir, aquí tenemos que tener más páginas.

12
00:01:04,170 --> 00:01:13,329
Lo primero de todo que vamos a hacer va a ser, bueno, esto del script sabéis que lo podéis borrar, que eso no vale para nada en esta práctica.

13
00:01:14,430 --> 00:01:20,870
Lo único que tenéis que tener en cuenta es que tenéis que escribir todo entre el body abierto, la etiqueta del body abierto y body cerrado, ¿vale?

14
00:01:20,870 --> 00:01:29,090
Todo tiene que estar escrito aquí, lo del resto dejadlo un poco como está, pero no pongáis cosas aquí debajo, ¿vale? Es importante.

15
00:01:29,390 --> 00:01:36,730
Entonces, lo primero que tenemos que hacer es darle un nombre a nuestro diario. Yo le voy a dar, por ejemplo, Diario Montañés.

16
00:01:36,730 --> 00:01:49,670
hemos dicho que había que ponerle una etiqueta de header 1, abierto y luego cerrarlo después del título

17
00:01:49,670 --> 00:01:54,549
para que veáis ahora aparece ya con un título de nivel 1, es decir, grandote

18
00:01:54,549 --> 00:02:12,909
Bien, y vamos a poner un H2 que va a ser el de noticias deportivas y otro H2, que vamos a copiarlo entero, que va a ser de noticias políticas.

19
00:02:12,909 --> 00:02:25,759
Ya tenemos el diseño de la primera página, pero necesitamos que esto sea un hipervínculo

20
00:02:25,759 --> 00:02:27,539
¿Cómo conseguimos que esto sea un hipervínculo?

21
00:02:27,659 --> 00:02:30,840
Pues para empezar tenemos aquí de momento solo una página de HTML

22
00:02:30,840 --> 00:02:39,780
Para ello necesitamos crear un nuevo archivo que se llame un poco lo que vosotros queréis

23
00:02:39,780 --> 00:02:56,960
Yo voy a llamar, por ejemplo, deportivas.html, ojo, cuidado, con la extensión, muy importante, le damos al enter y se nos ha creado, está vacío ahora mismo, ¿vale? Y lo mismo vamos a hacer una con políticas.html.

24
00:02:56,960 --> 00:03:01,099
Ya tenemos nuestras tres páginas

25
00:03:01,099 --> 00:03:03,840
La primera es esta, que todavía está sin hipervínculo

26
00:03:03,840 --> 00:03:05,879
Y las otras dos están vacías absolutamente

27
00:03:05,879 --> 00:03:07,259
Ya lo podéis ver aquí

28
00:03:07,259 --> 00:03:13,340
Entonces, ¿cómo le dábamos un hipervínculo a esto?

29
00:03:13,479 --> 00:03:15,439
Pues haríamos una etiqueta que era A

30
00:03:15,439 --> 00:03:18,460
Luego poníamos href="a

31
00:03:18,460 --> 00:03:23,199
Y poníamos el nombre de la página que queremos

32
00:03:23,199 --> 00:03:49,460
Esto es noticias deportivas, vamos a poner deportivas.html, vamos a cerrar la primera A, digamos la etiqueta de AHREF, la cerramos, pero esto de aquí, el texto tiene que estar dentro de, entre el A abierto y el A cerrado, ¿vale?

33
00:03:49,460 --> 00:03:51,759
muy importante, quedaos con esta estructura

34
00:03:51,759 --> 00:03:53,460
entonces ahora cuando le demos a run

35
00:03:53,460 --> 00:03:55,020
ya vais a ver que tenemos

36
00:03:55,020 --> 00:03:57,659
diario montañés, noticias deportivas y noticias políticas

37
00:03:57,659 --> 00:03:59,620
¿no? bien, hasta ahí bien

38
00:03:59,620 --> 00:04:00,479
vale

39
00:04:00,479 --> 00:04:03,319
tienes que hacer lo mismo exactamente

40
00:04:03,319 --> 00:04:05,639
con noticias políticas, pero que os lleve

41
00:04:05,639 --> 00:04:07,780
a la página, en vez de a deportivas

42
00:04:07,780 --> 00:04:09,620
html, que es esta, pues a políticas

43
00:04:09,620 --> 00:04:11,539
html, que es esta de aquí, muy bien

44
00:04:11,539 --> 00:04:13,379
si veis que le damos aquí

45
00:04:13,379 --> 00:04:15,219
nos lleva a una en blanco completamente

46
00:04:15,219 --> 00:04:17,500
¿por qué? pues porque estamos en

47
00:04:17,500 --> 00:04:19,360
en, perdón, estamos en

48
00:04:19,360 --> 00:04:21,579
en una completamente en blanco

49
00:04:21,579 --> 00:04:23,800
entonces lo que vamos a hacer va a ser copiar

50
00:04:23,800 --> 00:04:27,040
copiar todo

51
00:04:27,040 --> 00:04:28,939
el índice

52
00:04:28,939 --> 00:04:31,399
y lo vamos a pegar en deportivas

53
00:04:31,399 --> 00:04:33,639
por lo tanto ahora que estamos

54
00:04:33,639 --> 00:04:35,519
en deportivas nos va a aparecer esto

55
00:04:35,519 --> 00:04:37,019
estamos en deportivas, vale

56
00:04:37,019 --> 00:04:39,800
si le pinchamos

57
00:04:39,800 --> 00:04:41,300
aquí nos va a llevar al

58
00:04:41,300 --> 00:04:43,480
a ver, nos llevaría al mismo sitio

59
00:04:43,480 --> 00:04:45,639
evidentemente, porque le estamos diciendo que nos lleve a

60
00:04:45,639 --> 00:04:47,379
deportivas, entonces vuelve a su sitio

61
00:04:47,379 --> 00:05:04,899
Para volver a index, ¿cómo lo hacemos? Pues lo que tenemos que hacer es sustituir este enlace, por ejemplo, vamos a ponerle que vuelva a ir a index y vamos a poner aquí, en vez de noticias deportivas, vamos a poner vuelta a página principal, ¿vale?

62
00:05:04,899 --> 00:05:08,259
Estos noticias políticas lo eliminamos

63
00:05:08,259 --> 00:05:08,939
Muy bien

64
00:05:08,939 --> 00:05:11,180
Vale, entonces ahora le damos a Run

65
00:05:11,180 --> 00:05:13,860
Nos va a aparecer vuelta a la página principal

66
00:05:13,860 --> 00:05:15,920
Que nos va a llevar a la primera

67
00:05:15,920 --> 00:05:18,680
¿Veis? Noticias deportivas, tal cual, tal cual

68
00:05:18,680 --> 00:05:19,019
Muy bien

69
00:05:19,019 --> 00:05:21,920
Entonces, yo voy a hacerlo solo para noticias deportivas

70
00:05:21,920 --> 00:05:24,300
¿Vale? Para noticias políticas ya lo hacéis vosotros

71
00:05:24,300 --> 00:05:27,319
Tienes que poner aquí, evidentemente

72
00:05:27,319 --> 00:05:29,759
El hipervínculo

73
00:05:29,759 --> 00:05:32,259
Y tenéis que crear

74
00:05:32,259 --> 00:05:33,620
Ahora ya sí el diseño

75
00:05:33,620 --> 00:05:36,699
tanto de deportivas como de políticas. Yo voy a hacerlo de deportivas solamente, ¿vale?

76
00:05:37,079 --> 00:05:43,240
Aquí veis que tengo abiertas dos. Si quisiera abrir la de prácticas, pues la de políticas, perdona, se me abre aquí.

77
00:05:43,720 --> 00:05:48,800
Bien, entonces, ¿qué es lo que hay que hacer en deportivas? Vamos a deportivas, ¿qué es lo que hay que hacer aquí dentro?

78
00:05:49,660 --> 00:05:54,319
Pues aquí tenemos que meter un título, vamos a ir a marca, por ejemplo, ¿vale?

79
00:05:55,319 --> 00:06:00,519
Para un, yo qué sé, pues noticias del Atleti, cualquiera.

80
00:06:01,139 --> 00:06:03,220
Morata, respaldo total, estupendo, mira.

81
00:06:03,620 --> 00:06:06,500
Vamos a ponerlo, vamos a ir copiándolo como podamos, ¿vale?

82
00:06:06,879 --> 00:06:09,319
Molata, respaldo total lo ponemos en H1.

83
00:06:11,540 --> 00:06:14,579
Y veis que aquí hay un... Estas son las... La noticia entera, ¿vale?

84
00:06:14,579 --> 00:06:15,620
Van a ir copiando y pegando.

85
00:06:15,720 --> 00:06:23,079
Y esto que veis aquí, esto tenéis que ponerlo como H3, digamos, ¿vale?

86
00:06:23,079 --> 00:06:27,620
Entonces podéis copiar uno o dos párrafos, me da exactamente igual.

87
00:06:27,720 --> 00:06:31,019
Le voy a copiar, por ejemplo, este de aquí hasta aquí.

88
00:06:31,019 --> 00:06:42,639
Vamos a copiar esto y lo vamos a poner por aquí. Ojo, cuidado, el cuerpo no tiene que tener formato, ¿vale? Lo vamos a dejar así para que no sea, no tiene que tener formato de encabezado, ¿vale?

89
00:06:42,680 --> 00:06:55,040
Luego ya si le queréis meter un, esto sí que lo tenéis que hacer, ¿no? Porque lo pone en la rúbrica, tenéis que ir metiéndole párrafos, ¿no? Pues aquí un párrafo y el siguiente párrafo, y esto lo vamos a cerrar aquí.

90
00:06:55,040 --> 00:07:13,120
Y lo mismo aquí, abrimos un párrafo y lo cerramos aquí. Muy bien, ya tenemos más o menos dos párrafos puestos dentro de nuestra noticia.

91
00:07:13,120 --> 00:07:21,339
hemos dicho en la rubrica pone que tiene que haber algo de un encabezado de nivel 3 que haga como una especie de separación entre la noticia

92
00:07:21,339 --> 00:07:27,519
pues esto lo vamos a poner aquí y le vamos a meter un, bueno, mejor vamos a abrir primero la etiqueta

93
00:07:27,519 --> 00:07:36,360
h3, cerramos y ya lo pegamos ahí, entonces ya nos aparece el respaldo de Simeone, muy bien

94
00:07:36,360 --> 00:07:45,620
Bien, entonces, esto de aquí lo vamos a volver a pegar y lo pegáis aquí.

95
00:07:45,699 --> 00:07:53,459
Me da igual que sea muy grande, muy pequeña la noticia, me da un poco igual, ¿vale?

96
00:07:53,459 --> 00:07:55,720
Yo lo que quiero es que sepáis cómo crear hipervínculos.

97
00:07:56,959 --> 00:08:02,399
Ya tenemos nuestra noticia más o menos entera, ¿vale?

98
00:08:02,399 --> 00:08:09,399
y tenemos la vuelta a la página principal de nuestro periódico, el diario Montañés.

99
00:08:09,639 --> 00:08:11,279
Entonces tenemos noticias deportivas, noticias políticas.

100
00:08:11,639 --> 00:08:14,060
Tenemos noticias deportivas, va a aparecer lo que estábamos haciendo antes.

101
00:08:14,220 --> 00:08:19,600
Bien, esto. Esto es lo que tienes que hacer, pero también con noticias políticas.

102
00:08:19,800 --> 00:08:23,379
Exactamente igual, con una noticia política que queráis.

103
00:08:24,019 --> 00:08:25,500
Es decir, tienes que veniros aquí y demás.

104
00:08:26,600 --> 00:08:27,660
¿Cómo se entrega la práctica?

105
00:08:27,660 --> 00:08:32,620
Una vez hayáis terminado todo, vais a tener que darle aquí y Download as ZIP.

106
00:08:33,639 --> 00:08:41,120
Se os aparece un archivo de WinRAR o WinZIP, depende de cualquier programa.

107
00:08:41,440 --> 00:08:44,659
Esto está comprimido, tenéis que descomprimirlo.

108
00:08:45,279 --> 00:08:48,620
A mí lo que me interesa es que me subáis estos tres archivos.

109
00:08:49,779 --> 00:08:54,759
Estos tres archivos es lo que yo necesito para poder verlo.

110
00:08:54,759 --> 00:08:58,200
¿Por qué? Porque yo voy a abrir el index y se me va a abrir esto.

111
00:09:00,019 --> 00:09:03,500
Y voy a poder mirar a ver cómo han sido vuestras noticias, ¿vale?

112
00:09:04,139 --> 00:09:12,340
Mirad la rúbrica, por favor, mirad, pues eso, todo lo que os pido,

113
00:09:12,340 --> 00:09:18,379
porque os pido que lo separéis en párrafos, os pido encabezados, os pido negritas,

114
00:09:19,360 --> 00:09:23,379
recordad que para negritas la etiqueta B, para la cursiva es la etiqueta I,

115
00:09:23,379 --> 00:09:26,559
y demás, pues esto es todo lo que tenéis que hacer

116
00:09:26,559 --> 00:09:28,440
básicamente, es una práctica bien sencilla

117
00:09:28,440 --> 00:09:28,820
¿vale?