1
00:00:00,000 --> 00:00:01,200
Bienvenido de nuevo. 

2
00:00:01,200 --> 00:00:03,800
Continuemos con la
construcción de la página de inicio. 

3
00:00:03,795 --> 00:00:05,825
Y como pueden ver,
he vuelto a cambiar a

4
00:00:05,820 --> 00:00:08,730
la imagen de
fondo tradicional. 

5
00:00:08,730 --> 00:00:10,020
Pero como dije, si quieres
usar

6
00:00:10,020 --> 00:00:11,550
el video, eso está bien. 

7
00:00:11,550 --> 00:00:13,800
El siguiente apartado que
vamos a construir será

8
00:00:13,800 --> 00:00:16,080
la
sección de dos columnas que tendrá

9
00:00:16,080 --> 00:00:18,990
algunos textos a la izquierda,
una imagen a la derecha. 

10
00:00:18,990 --> 00:00:22,530
Y luego la tercera sección
aquí es muy, muy similar. 

11
00:00:22,530 --> 00:00:24,450
Sólo son las columnas invertidas. 

12
00:00:24,445 --> 00:00:27,325
En la tercera sección,
tenemos la imagen a la izquierda

13
00:00:27,320 --> 00:00:30,080
y luego el texto a la derecha. 

14
00:00:30,080 --> 00:00:32,750
Entonces, ¿cómo exactamente
vamos a lograr esto? 

15
00:00:32,750 --> 00:00:34,760
Esto es muy,
muy, muy sencillo. 

16
00:00:34,760 --> 00:00:36,650
Vamos a ir a una página de inicio. 

17
00:00:36,650 --> 00:00:38,000
Vamos a editar. 

18
00:00:38,000 --> 00:00:39,560
Y se puede ver en este momento es

19
00:00:39,560 --> 00:00:41,420
básicamente dos columnas, 5050. 

20
00:00:41,420 --> 00:00:44,200
Así que muy fácilmente
vamos a venir aquí abajo,

21
00:00:44,195 --> 00:00:47,455
crear una nueva sección
con dos columnas, 5050. 

22
00:00:47,450 --> 00:00:48,800
Voy a editar la sección, se

23
00:00:48,800 --> 00:00:50,600
asegura de que vaya de ancho completo. 

24
00:00:50,600 --> 00:00:53,780
Y entonces las columnas GAAP
van a decir que no hay brecha. 

25
00:00:53,780 --> 00:00:57,520
Muy bien, entonces la
primera sección de aquí,

26
00:00:57,515 --> 00:00:59,625
va a tener algunos textos. 

27
00:00:59,629 --> 00:01:02,179
Permítanme dibujar aquí el
editor de texto. 

28
00:01:02,180 --> 00:01:05,360
Lambda copia blandidamente el texto ficticio de
Lorem Ipsum

29
00:01:05,360 --> 00:01:06,830
que
tengo por aquí. 

30
00:01:06,830 --> 00:01:09,560
Déjame seguir adelante
y pegar eso. 

31
00:01:09,560 --> 00:01:12,080
Y luego también
tenemos el encabezado. 

32
00:01:12,080 --> 00:01:15,370
Déjame dejar caer eso por
atrevo. Es un h2. 

33
00:01:15,365 --> 00:01:16,105
Aquí. 

34
00:01:16,100 --> 00:01:17,840
En realidad no creé

35
00:01:17,840 --> 00:01:21,830
ningún encabezado real,
ningún título real. 

36
00:01:21,830 --> 00:01:25,240
Así que déjame simplemente escribir. 

37
00:01:25,235 --> 00:01:30,915
Nos encantaría viajar. 

38
00:01:30,910 --> 00:01:34,880
Sólo algo. Eso es eso. 

39
00:01:34,880 --> 00:01:36,940
Y luego para la
segunda columna aquí,

40
00:01:36,935 --> 00:01:38,905
vamos a sumar la imagen,

41
00:01:38,900 --> 00:01:42,460
y voy a añadir esta
imagen que tomé en Estambul. 

42
00:01:42,455 --> 00:01:44,455
Se trataba de un grupo de
nuestros estudiantes universitarios. 

43
00:01:44,450 --> 00:01:45,710
Estaba caminando por ahí
y le dije: Oye,

44
00:01:45,710 --> 00:01:47,480
¿te
gustaría que tomara
una foto de esta idea? 

45
00:01:47,480 --> 00:01:48,850
Entonces tomé la foto. 

46
00:01:48,845 --> 00:01:51,785
Así que asegúrate de configurar
esta imagen para engañar. 

47
00:01:51,785 --> 00:01:53,755
Porque de nuevo, queremos que
la imagen ocupe

48
00:01:53,750 --> 00:01:57,160
todo
el ancho y la
altura de su columna. 

49
00:01:57,155 --> 00:02:01,105
Pero entonces también necesitamos
agregar el botón Saber más. 

50
00:02:01,100 --> 00:02:02,750
Entonces lo que voy a hacer por supuesto,

51
00:02:02,750 --> 00:02:04,640
es volver aquí,

52
00:02:04,640 --> 00:02:07,120
arrastrar el botón, soltarlo aquí. 

53
00:02:07,115 --> 00:02:14,255
Y entonces voy a
decir aprender, aprender más. 

54
00:02:14,255 --> 00:02:17,845
Entonces este enlace puede ir a
tal vez la página sobre. 

55
00:02:17,840 --> 00:02:21,840
Así que simplemente voy a decir barra
hacia adelante sobre. 

56
00:02:22,030 --> 00:02:24,200
Y ahí está. 

57
00:02:24,200 --> 00:02:25,590
Voy a
alinearme con el centro. 

58
00:02:25,594 --> 00:02:26,604
Hagamos algunos cambios. 

59
00:02:26,600 --> 00:02:28,630
Tipografía de estilo. 

60
00:02:28,625 --> 00:02:32,515
Voy a decir
transformar a mayúsculas. 

61
00:02:32,510 --> 00:02:37,060
La declaración sobre no
dentro de lo que es una integración. 

62
00:02:37,055 --> 00:02:39,655
Y luego el color del texto. 

63
00:02:39,650 --> 00:02:42,490
Voy a cambiar
eso a negro. 

64
00:02:42,485 --> 00:02:45,085
Ahora para el botón real
en sí van a ir con

65
00:02:45,080 --> 00:02:48,380
un color de fondo de blanco. 

66
00:02:48,380 --> 00:02:52,220
teclear de fondo aquí
va a ser de color blanco. 

67
00:02:52,220 --> 00:02:54,260
Pero entonces vamos a establecer un borde de

68
00:02:54,260 --> 00:02:57,590
sólido para que en realidad podamos
ver el botón. 

69
00:02:57,590 --> 00:02:58,940
Y si lo quisieras, podrías

70
00:02:58,940 --> 00:03:00,440
agregar algunos videos de frontera también. 

71
00:03:00,440 --> 00:03:02,620
Pero no voy a hacer eso. 

72
00:03:02,615 --> 00:03:05,485
Una cosa final a hacer sería

73
00:03:05,480 --> 00:03:08,680
alinear nuestro contenido
en el medio. 

74
00:03:08,675 --> 00:03:11,375
Por lo que voy a hacer click en
el botón Editar Columna,

75
00:03:11,375 --> 00:03:13,855
comentarios,
Alinear Vertical, establece medio. 

76
00:03:13,850 --> 00:03:15,980
Y entonces una cosa más que
hacemos

77
00:03:15,980 --> 00:03:18,200
para tener algo de
espacio a la izquierda
y a la derecha está en

78
00:03:18,200 --> 00:03:19,940
contra
ahora mismo el texto no es

79
00:03:19,940 --> 00:03:22,670
exactamente justo al
borde de la columna,

80
00:03:22,670 --> 00:03:23,900
por lo que necesitamos agregar un poco de espaciado. 

81
00:03:23,900 --> 00:03:25,220
Así que voy a volver aquí. 

82
00:03:25,220 --> 00:03:27,790
Lo que vamos a hacer
es muy, muy sencillamente,

83
00:03:27,785 --> 00:03:30,305
vamos a ir a avanzado

84
00:03:30,305 --> 00:03:32,875
por la misma columna. Aquí mismo. 

85
00:03:32,870 --> 00:03:35,210
Vamos a desvincular los
valores para el patrón. 

86
00:03:35,210 --> 00:03:38,440
Y luego voy
a dar 50 pixeles

87
00:03:38,435 --> 00:03:42,025
por 50 pixeles a la izquierda. 

88
00:03:42,020 --> 00:03:43,130
Y ahí está. 

89
00:03:43,130 --> 00:03:47,930
Hemos construido nuestra
segunda sección muy fácilmente,

90
00:03:47,930 --> 00:03:50,390
ya que la tercera sección es muy,
muy

91
00:03:50,390 --> 00:03:51,980
similar en diseño,

92
00:03:51,980 --> 00:03:54,200
lo que podemos hacer es
simplemente hacer clic derecho en

93
00:03:54,200 --> 00:03:57,190
la sección de edición proteína
y luego duplicar. 

94
00:03:57,185 --> 00:03:59,855
Y ahora lo que simplemente voy a hacer

95
00:03:59,855 --> 00:04:02,605
es que voy a arrastrar esta
primera columna aquí,

96
00:04:02,600 --> 00:04:06,200
arrastrarla hasta
aquí, cambiar las columnas. 

97
00:04:06,200 --> 00:04:07,490
Y ahora muy sencillamente,

98
00:04:07,490 --> 00:04:09,290
sigamos adelante y
editemos esta imagen. 

99
00:04:09,290 --> 00:04:13,220
Voy a elegir éste
que tomé en Argentina. 

100
00:04:13,220 --> 00:04:16,670
Montaje encaja en L, color graso. 

101
00:04:16,669 --> 00:04:20,029
Y luego por supuesto,
para los textos de aquí,

102
00:04:20,030 --> 00:04:21,560
¿añadí cualquier cosa viajada a

103
00:04:21,560 --> 00:04:23,300
los mejores lugares como
el encabezado, vale,

104
00:04:23,300 --> 00:04:27,350
así que déjame simplemente cambiar
ese encabezado aquí y

105
00:04:27,350 --> 00:04:34,210
decir viajar a los mejores lugares. 

106
00:04:34,205 --> 00:04:38,035
Ahí vas. Muy bien,
sigamos adelante ahora actualizaciones. 

107
00:04:38,030 --> 00:04:41,610
Digamos cómo se ve la
página. 

108
00:04:41,920 --> 00:04:45,180
Vamos, vamos. 

109
00:04:46,210 --> 00:04:49,780
No soporten conmigo. 
Desafortunadamente, estos son

110
00:04:49,775 --> 00:04:54,485
los riesgos ocupacionales de
un instructor, un maestro. 

111
00:04:54,485 --> 00:04:57,205
A veces el incidente comienza

112
00:04:57,200 --> 00:05:00,320
a estropearse y
finalmente se actualiza. 

113
00:05:00,320 --> 00:05:03,560
Vale, gracias. Ahora,
veamos la página. 

114
00:05:03,560 --> 00:05:07,310
Desplazemos hacia abajo
y ahí está. 

115
00:05:07,310 --> 00:05:08,920
De acuerdo, una cosa más. 

116
00:05:08,915 --> 00:05:10,285
Al igual que un bonus,

117
00:05:10,280 --> 00:05:11,960
podríamos añadir alguna animación

118
00:05:11,960 --> 00:05:13,130
para que las imágenes tal vez les guste,

119
00:05:13,130 --> 00:05:14,690
ya
sabes, esta diapositiva
desde la izquierda y la derecha. 

120
00:05:14,690 --> 00:05:17,000
Entonces lo que podemos hacer
es simplemente volver

121
00:05:17,000 --> 00:05:21,160
atrás y revisar esta alegoría
para la primera imagen,

122
00:05:21,155 --> 00:05:22,915
la que tiene aquí
los alumnos,

123
00:05:22,910 --> 00:05:24,460
voy a editar la imagen. 

124
00:05:24,455 --> 00:05:26,635
Ve a Encendedor avanzado,

125
00:05:26,630 --> 00:05:27,740
tienes efectos de movimiento. 

126
00:05:27,740 --> 00:05:29,800
Voy a decir animación de
entrada. 

127
00:05:29,795 --> 00:05:32,425
Vamos a deslizarnos desde las luces. 

128
00:05:32,420 --> 00:05:33,740
De acuerdo, tan ligeramente
adentro de la derecha,

129
00:05:33,740 --> 00:05:35,150
así que rebanando desde la derecha. 

130
00:05:35,150 --> 00:05:37,010
Y luego para esta
imagen era simplemente hacer

131
00:05:37,010 --> 00:05:39,750
la diapositiva opuesta
adentro desde la izquierda. 

132
00:05:39,745 --> 00:05:41,545
Efectos de movimiento. 

133
00:05:41,540 --> 00:05:44,700
Desacelerado, informa o amado. 

134
00:05:46,240 --> 00:05:49,940
De acuerdo, eso fue un poco raro. 

135
00:05:49,940 --> 00:05:50,930
No estoy seguro exactamente
lo que hicieron. 

136
00:05:50,930 --> 00:05:53,180
Permítanme volver a hacer eso. 

137
00:05:53,180 --> 00:05:53,660
Ok. 

138
00:05:53,660 --> 00:05:55,280
Por alguna razón la ventana de imagen

139
00:05:55,280 --> 00:05:56,420
sobre a la segunda columna. 

140
00:05:56,420 --> 00:05:57,530
No sé por qué pasó eso,

141
00:05:57,530 --> 00:06:00,570
pero está bien, voy a seguir
adelante y actualizarme. 

142
00:06:00,790 --> 00:06:02,180
Ahí vamos. 

143
00:06:02,180 --> 00:06:05,620
Veamos la página. 
Desplazemos hacia abajo. 

144
00:06:05,615 --> 00:06:07,235
Hace deslizamiento desde la izquierda,

145
00:06:07,235 --> 00:06:09,805
engañado y deleite,
y ahí está. 

146
00:06:09,800 --> 00:06:12,090
Y así así, nuestra página de inicio

147
00:06:12,094 --> 00:06:14,274
está empezando a surtir efecto. 

148
00:06:14,270 --> 00:06:16,490
Así que únete a mí en el siguiente
video donde ahora vamos

149
00:06:16,490 --> 00:06:17,660
echar un vistazo a cómo
vamos a

150
00:06:17,660 --> 00:06:19,150
construir la siguiente sección,

151
00:06:19,145 --> 00:06:23,795
que sería el diseño de viaje
único.