1
00:00:00,000 --> 00:00:03,980
Hola, vamos a ver aquí cómo crear una cabecera sencilla para nuestra web.

2
00:00:04,400 --> 00:00:06,700
Tendrá una imagen y un texto.

3
00:00:07,580 --> 00:00:09,279
Lo primero, buscar la imagen.

4
00:00:10,060 --> 00:00:13,900
Y para eso es importante dirigirse a bancos de imágenes de uso libre,

5
00:00:14,080 --> 00:00:17,219
que tengan una licencia que me garantice que puedo usarlas.

6
00:00:17,960 --> 00:00:21,320
Entonces, yo por ejemplo uso mucho Pixabay, pixabay.com.

7
00:00:22,219 --> 00:00:26,260
Me vengo a Pixabay y busco por ejemplo imágenes de química.

8
00:00:26,260 --> 00:00:32,240
bien, porque la web va a ser temática de química, soy profe de física y química

9
00:00:32,240 --> 00:00:34,359
entonces, bueno, tengo aquí muchas opciones

10
00:00:34,359 --> 00:00:39,780
y lo que voy a hacer es buscar aquellas que tengan fondo transparente

11
00:00:39,780 --> 00:00:42,359
me voy aquí a color, marco transparente

12
00:00:42,359 --> 00:00:48,179
y así me garantizo crear un logo en mi web que tenga el fondo transparente

13
00:00:48,179 --> 00:00:49,619
bueno, pues tengo muchas opciones

14
00:00:49,619 --> 00:00:52,200
voy a usar por ejemplo esta que me gusta

15
00:00:52,200 --> 00:00:59,299
aquí tengo la opción de descarga gratuita con una licencia Pixabay

16
00:00:59,299 --> 00:01:04,219
que no es necesaria atribución y es libre para uso incluso comercial

17
00:01:04,219 --> 00:01:07,599
cuando le doy a descargar me ofrece distintos tamaños

18
00:01:07,599 --> 00:01:11,239
selecciono el más pequeñito de todos para mi cabecera

19
00:01:11,239 --> 00:01:16,140
entonces aquí veo que me ha descargado la imagen

20
00:01:16,140 --> 00:01:21,920
si voy aquí voy a poner por ejemplo matraces

21
00:01:21,920 --> 00:01:25,359
que es como yo he llamado a mi imagen

22
00:01:25,359 --> 00:01:29,620
bien, pues ahora me voy a ir a Pixel

23
00:01:29,620 --> 00:01:32,980
que es el editor online, pixel.com

24
00:01:32,980 --> 00:01:36,519
cuando entramos me ofrece el sencillo o el avanzado

25
00:01:36,519 --> 00:01:38,659
yo voy a usar el avanzado en esta ocasión

26
00:01:38,659 --> 00:01:43,400
puedo crear una nueva o cargar o tal

27
00:01:43,400 --> 00:01:45,480
bueno, pues vamos a crear una imagen nueva

28
00:01:45,480 --> 00:01:48,120
me ofrece distintos tamaños

29
00:01:48,120 --> 00:01:51,739
yo le voy a dar, voy a poner aquí como nombre

30
00:01:51,739 --> 00:02:01,700
cabecera y le voy a dar un ancho por ejemplo de 1200 y de altura 200 píxeles vale y le voy a

31
00:02:01,700 --> 00:02:09,259
decir sin fondo para que tenga un fondo transparente vale y crear ya tengo aquí el esquema de mi

32
00:02:09,259 --> 00:02:16,120
cabecera no está tamaño real está reducida pero bueno para editarla me viene bien entonces voy

33
00:02:16,120 --> 00:02:23,199
a coger y aquí en la opción capa voy a añadir una imagen como capa que va a ser la imagen de

34
00:02:23,199 --> 00:02:33,259
los matraces que he descargado antes está como es una imagen muy grande pues nada la redimensionó

35
00:02:33,259 --> 00:02:41,120
la goma chiquitita la muevo la ajustó al tamaño de mi web bien y la tengo aquí la coloco más o

36
00:02:41,120 --> 00:02:48,719
menos como a mí me guste. También puedo usar, por ejemplo, abrir otra que tenía yo

37
00:02:48,719 --> 00:02:53,020
ya descargada de antes, abrir otra imagen como capa que son, por ejemplo, los tubos

38
00:02:53,020 --> 00:02:59,879
de ensayo. La tenía yo ya descargada de antes, pues lo mismo. La hago más chiquitita y me

39
00:02:59,879 --> 00:03:09,069
la traigo por aquí a la derecha y ya tengo un poco mi cabecera ya va cogiendo forma.

40
00:03:09,069 --> 00:03:30,169
Bien, ahora voy a añadir un texto sin más, ¿vale? Le digo aquí, por ejemplo, empiezo, pulso donde lo quiero añadir, me dice que si quiere añadir otra capa, le digo que sí, añadir, y aquí escribo un texto que es la profe de química, ¿vale?

41
00:03:30,169 --> 00:03:46,530
Y yo aquí ya puedo jugar o con el tamaño, puedo jugar con el color, etc. ¿Vale? Con el tipo de letra, lo que quiera. Bien. Y entonces, bueno, pues también voy a colocar por aquí, más o menos centradito, el texto, la profe de química.

42
00:03:46,530 --> 00:04:02,889
Vale, y sin más, ahora ya lo que tengo que hacer es exportar, una exportación rápida como png me vale, la llamo cabecera.png, guardar, bien, y ya tengo la imagen creada.

43
00:04:02,889 --> 00:04:31,470
Bien, ahora voy a la página, vamos a ver que me ha esperado la sesión, ahora voy a EducaMadrid y voy a configurar la cabecera, entonces me voy a editar en apariencia diseñador web y lo primero que tengo que hacer es en cabecera, pues buscar la imagen, imagen de cabecera.

44
00:04:32,889 --> 00:04:45,569
Le doy a añadir imagen, seleccionar archivo, voy a la carpeta donde he creado mi cabecera, cabecera png y abrir y subir fichero.

45
00:04:47,569 --> 00:04:54,410
Ahora me dice accede a los ficheros subidos desde listado, bueno pues me voy a listado y aquí tengo mi cabecera.

46
00:04:54,689 --> 00:05:00,569
Entonces veo este circulito que viene aquí, lo tengo que pulsar y seleccionar.

47
00:05:00,569 --> 00:05:16,350
Si pulso aquí encima, lo que me hará es abrirme la imagen. Tengo que pulsar este circulito y seleccionar. Ya la tengo seleccionada. Bien, ahora de altura, como le puse a mi cabecera, le puse 200 píxeles, pues le voy a poner 200 píxeles también.

48
00:05:16,350 --> 00:05:45,420
Aquí yo ya veo cómo me va quedando, le voy a poner por ejemplo que sea una página que ocupe el 100%, ya la tengo ahí y ahora por ejemplo pues veo que le puse un texto blanco, voy a cambiar el color de fondo de la cabecera y le voy a poner un azulito, a ver cómo queda ahí, pues queda aquí, bastante mono.

49
00:05:45,420 --> 00:05:53,100
y ahora le voy a ocultar el nombre para ocultar esto del tic

50
00:05:53,100 --> 00:05:57,639
y voy a ocultar el buscador también porque también me está estorbando en mi cabecera

51
00:05:57,639 --> 00:06:01,759
y ya estaría, eso sería todo

52
00:06:01,759 --> 00:06:05,139
bueno, tengo que seleccionar un tema también para completar la tarea

53
00:06:05,139 --> 00:06:08,899
tengo que seleccionar un tema que de hecho lo suyo es seleccionar el tema primero

54
00:06:08,899 --> 00:06:12,740
y luego poner la cabecera, pero bueno, yo lo he hecho al revés

55
00:06:12,740 --> 00:06:20,319
le doy a guardar y ya estaría, ya tengo aquí mi cabecera configurada

56
00:06:20,319 --> 00:06:22,199
y eso es todo, espero que os sirva