Activa JavaScript para disfrutar de los vídeos de la Mediateca.
Cabecera de WEB con INK Scape
Ajuste de pantallaEl ajuste de pantalla se aprecia al ver el vídeo en pantalla completa. Elige la presentación que más te guste:
Os voy a preparar un tutorial para ver cómo diseñar una imagen para colocarla en la cabecera de una página de Ducamadrid.
00:00:00
Vamos a usar un programa que se llama Inkscape, que ya viene instalado en Max.
00:00:10
Viene en Inicio, Gráficos, Inkscape.
00:00:14
Este programa, por defecto, incluye aquí una plantilla que es tamaño DIN A4.
00:00:18
Vamos a cambiar ese tamaño.
00:00:27
Para eso vamos a ir a archivo, propiedades del documento y vemos que podemos darle un tamaño personalizado.
00:00:28
Viene en milímetros. Nosotros, como os comenté, hemos decidido que nuestra cabecera tenga 1000 píxeles de ancho y 200 de alto.
00:00:39
así que lo que vamos a hacer va a ser poner las unidades en píxeles
00:00:50
y decidir que de ancho tenga 1000 y de alto tenga 200
00:00:56
y ya está, veis ahí como ahora tiene otras dimensiones
00:01:04
vamos a quitarlo de mostrar sombra y que quede así solo el borde
00:01:12
color de fondo lo tenemos ahora en transparencia
00:01:16
Vamos a ponerlo completamente blanco
00:01:21
El color de fondo
00:01:24
Vemos que ya está completamente blanco
00:01:25
Si quisiéramos que fuera transparente
00:01:30
Lo ponemos aquí
00:01:32
Y ahora sería transparente
00:01:32
Pero depende para lo que nos interese
00:01:35
Vamos a ponerlo blanco en nuestro caso
00:01:37
Ahí, perfecto
00:01:39
Cerramos y cerramos
00:01:42
Pues ya tenemos aquí
00:01:45
La plantilla sobre la que trabajar
00:01:47
Que tiene ese tamaño
00:01:52
1000 píxeles por 200 píxeles
00:01:53
de esta manera luego cuando lo subamos a nuestra página
00:01:56
pues va a ajustarse completamente
00:01:59
por ejemplo, vamos a poner letras
00:02:01
con esta herramienta podemos aquí poner letras
00:02:04
por ejemplo, somos tecnorrurales
00:02:08
en mi caso, la C quiero que sea roja
00:02:15
la R quiero que sea roja
00:02:21
y la A quiero que sea roja
00:02:24
en tipos de letra
00:02:27
podemos ver
00:02:29
ese tipo de letra, fea, pero bueno, ese tipo de letra
00:02:30
vale
00:02:35
ahora lo que puedo hacer es
00:02:36
mover ese tipo de letra, voy a ponerla
00:02:39
más o menos por el centro y puedo jugar con ella
00:02:41
con estas flechas, vale
00:02:43
vamos a ponerlo ahí
00:02:45
ahora quiero
00:02:47
poner aquí una imagen y aquí otra imagen
00:02:49
pues voy a
00:02:51
importarlas de alguna manera
00:02:53
objeto
00:02:55
bueno, más fácil, puedo arrastrarlas
00:02:57
ir a donde las tengo y arrastrarlas
00:03:01
cojo una de ellas, la arrastro
00:03:04
y la pongo por aquí
00:03:08
le doy a aceptar, la voy a incrustar
00:03:09
le doy a aceptar y aquí tengo la foto
00:03:13
bueno, pues me la traigo por aquí, la coloco ahí
00:03:16
y ahora empiezo a ajustarla
00:03:19
le ajusto ahí y ahí, por ejemplo
00:03:21
y en este otro lado
00:03:25
me traigo otra imagen, la suelto
00:03:26
le doy a aceptar
00:03:30
y ahora la voy ajustando
00:03:32
ahí
00:03:33
ahí
00:03:34
y ahí más o menos
00:03:37
esto lo pongo un poquito más así
00:03:39
vale, pues imaginaros
00:03:43
que esta puede ser la cabecera que yo quiero
00:03:48
voy a ajustar esto un poquito más para allá
00:03:50
ahí
00:03:51
pues ahora solo tengo que exportar
00:03:52
esta imagen
00:03:56
le doy a archivo
00:03:58
exportar imagen PNG
00:03:59
y aquí distintas opciones de exportación
00:04:02
la página, el dibujo, la selección o personalizado
00:04:06
en este caso la página
00:04:09
si veis pone ancho 1000 píxeles, alto 200 píxeles
00:04:10
voy a decidir exportar como
00:04:15
bueno, se va a guardar en Madrid, imagen 3369 PNG
00:04:18
vale, podría decidir
00:04:21
exportarlo en imágenes
00:04:25
y poner cabecera CRA
00:04:27
por ejemplo
00:04:31
guardar
00:04:32
imágenes, cabecera CRA
00:04:34
y ahora le doy a exportar
00:04:35
ya está, se ha guardado
00:04:37
vamos a buscarlo
00:04:41
y ahora os lo enseño
00:04:42
aquí tenemos cabecera CRA
00:04:44
que si lo abrimos es esta imagen
00:04:49
si vamos a ver sus propiedades
00:04:52
veremos que
00:04:55
su anchura es de 1000 píxeles
00:04:57
y su altura de 200 píxeles
00:04:59
de esta manera
00:05:01
si yo la subo a mi cabecera
00:05:02
de mi página web
00:05:05
como he puesto esos tamaños
00:05:07
pues va a encajar perfectamente
00:05:09
bueno, espero que con eso
00:05:11
os sirva para hacer
00:05:13
la cabecera de vuestras páginas
00:05:15
- Autor/es:
- Daniel Esteban Roque
- Subido por:
- Daniel E.
- Licencia:
- Reconocimiento - No comercial - Sin obra derivada
- Visualizaciones:
- 158
- Fecha:
- 11 de marzo de 2019 - 21:50
- Visibilidad:
- Público
- Centro:
- CP INF-PRI C.R.A. LOS OLIVOS
- Duración:
- 05′ 21″
- Relación de aspecto:
- 1.78:1
- Resolución:
- 1920x1080 píxeles
- Tamaño:
- 14.79 MBytes