Saltar navegación

Activa JavaScript para disfrutar de los vídeos de la Mediateca.

WIX-3. Imágenes - Contenido educativo

Ajuste de pantalla

El ajuste de pantalla se aprecia al ver el vídeo en pantalla completa. Elige la presentación que más te guste:

Subido el 21 de diciembre de 2023 por Roberto S.

10 visualizaciones

En este videotutorial se describe cómo editar e introducir imágenes en una página web creada con el editor de contenidos WIX.

Más información Transcripción

Descargar la transcripción

Hola de nuevo, en este vídeo vamos a ver cómo insertar y también cómo podemos editar 00:00:00
y cambiar imágenes. 00:00:06
Para ello venimos aquí al menú lateral izquierdo y damos a agregar elementos y damos a imágenes. 00:00:09
Para tener todas las opciones posibles es mejor dar aquí en este comando que es de 00:00:19
subir imágenes y aquí tenemos imágenes propias de mi cuenta de Wix, es decir, yo aquí tengo 00:00:23
en cada página web tengo una serie de medios agrupados en carpetas. 00:00:31
También podríamos dar a nuestra cuenta de Google Drive, a Facebook, Instagram, etc. 00:00:36
De acuerdo, en todas estas redes sociales en las que yo puedo tener fotos y que me interesaría 00:00:40
aplicar aquí. 00:00:45
También puedo subir multimedia, es decir, imágenes desde mi ordenador y bien también 00:00:49
explorar aquí imágenes de Wix. 00:00:53
Aquí tenéis las imágenes de Wix agrupadas por vídeos, vídeos transparentes, ilustraciones. 00:00:58
Todo esto es gratuito. 00:01:04
También tenéis arte vectorial. 00:01:09
Tenemos también formas básicas. 00:01:11
También tenemos iconos de redes sociales, podemos elegir el que queramos y también 00:01:16
iconos de aplicaciones. 00:01:32
Aquí tenemos todos estos que veis, este que hemos utilizado antes. 00:01:33
Pues vamos entonces a ver que también podemos tener, digamos, filtrar por exclusivos de 00:01:49
Wix, abstracto, animales de naturaleza, blanco y negro, personas, productos, etc. 00:01:56
Podemos también, digamos, filtrar por la orientación, horizontal o vertical y bien 00:02:02
por los colores. 00:02:08
Ahora lo tengo con todos los colores, también lo puedo poner en blanco y negro y mediante 00:02:09
algún color específico. 00:02:13
Tengo también la colección de Shutterstock, que son todas de pago, o por lo menos la mayoría, 00:02:16
y luego Unsplash, que esta vez la mayoría son gratuitas también. 00:02:24
Yo lo que voy a hacer es coger una fotografía que ya he subido previamente, es decir, voy 00:02:35
a coger esta fotografía de un bebito y agregó a la página web, aquí la tengo, hago un poquito 00:02:47
más grande la sección y coloco aquí la imagen, esto suele pasar porque consume mucho recurso 00:02:56
y a veces queda el navegador un poco lento. 00:03:10
Con una de las opciones que me sale, puedo cambiar aquí la imagen, que no va a ser ahora 00:03:16
la cuestión. 00:03:21
Vamos a editar imágenes, a editar imagen que aquí me salen muchas cosas, por ejemplo 00:03:23
puedo redimensionar, es decir, me puedo quedar con parte de la imagen y en cualquier momento 00:03:27
puedo revertir a la imagen original tras los muchos cambios que yo puedo hacer. 00:03:33
Bien, después puedo optimizar. 00:03:41
En cuanto a optimización automática, le puedo decir que sea con un retrato, un paisaje 00:03:44
o bien como si estuviéramos en interiores. 00:03:54
Vamos a revertir a la original y redimensionar de nuevo. 00:03:56
Es interesante las opciones que me dan el comando ajustar, porque puedo cambiar el brillo 00:04:07
de la imagen, el contraste también puedo cambiarlo, destacar colores, destacar sombras, 00:04:12
saturar los colores o desaturarlos yendo a blanco y negro, cambiar la temperatura, es 00:04:29
decir, hacer una imagen cálida o una imagen fría, los fríos van hacia azul y los cálidos 00:04:37
hacia rojo. 00:04:42
Lo pongo un poquito cálido, la exposición a la luz también la puedo cambiar, efectos 00:04:43
puedo darle nitidez o quitarle nitidez, vamos a darle nitidez, vignette es un efecto de 00:04:51
aumentar los sombreados o las luces o puedo granular la imagen, puedo darle un tinte 00:05:03
rojo o no darse, evidentemente. 00:05:14
Puedo ponerle filtros dentro de la colección de filtros que tiene Wix, todos estos filtros 00:05:21
por ejemplo. 00:05:27
Puedo añadir texto, vamos a ponerle por ejemplo de 18 agregamos un texto, esto es grande todavía, 00:05:35
vamos a ponerle menos, 18 es pequeñito, no me deja poner valores intermedios, puedo 00:05:56
girarlo, cambiarle el color, por ejemplo este y puedo darle al texto más o menos opacidad. 00:06:08
Puedo superponer distintos efectos, como por ejemplo efecto de brillo, vamos a ponerle 00:06:26
este por ejemplo, lo colocamos aquí, como hacemos en Photoshop, y superponer con algún 00:06:33
fondo, por ejemplo, superponerle con este fondo, y esa superposición la puedo aumentar 00:06:46
o disminuir aquí, bueno vamos a dejar así que se vea un poquito el fondo, no mucho, 00:07:01
y damos a guardar, va a tardar un poquito porque es una imagen, digamos que la hemos 00:07:09
colocado bastante, hemos metido mucha información y suele empezar. 00:07:14
Bien, aquí la tenemos, tenemos una imagen bastante modificada, puedo volver a editarla 00:07:18
e incluso puedo ver ajustes, las opciones de ajustes son interesantes, primero al hacer 00:07:33
clic en la imagen puedo elegir que se abra un enlace o un pop-up, un pop-up es que se 00:07:41
me va a hacer grande la imagen o que se pueda agrandar, vamos a ver por ejemplo que se abra 00:07:46
un pop-up, vamos a guardar y vamos a vista previa, al hacer clic sobre ella, no me ha 00:07:51
dado mucho caso, ahora, sale esto, vamos a editarla de nuevo, sale un pop-up, puede agrandarse, 00:08:03
es decir que se haga grandecita, o bien puedo hacer que se abra un enlace, elegimos el enlace 00:08:18
y puedo ir a una página de mis páginas de Wix, a una dirección web externa, como por 00:08:32
ejemplo https://google.com y como es una ventana externa, es una página web externa que se 00:08:37
abra en una ventana nueva, hecho, guardamos y lo comprobamos, aquí tenemos, damos y efectivamente 00:08:48
se nos abre Google, volvemos al editor y hay más cosas que podemos hacer, volvemos a ajustes 00:09:04
y también tengo el texto que hay en la imagen, esto es su nombre y el texto flotante es el 00:09:17
texto que me va a aparecer en cuanto yo deje el ratón reposar en la imagen, como por ejemplo 00:09:21
vamos a poner bebé bonito, vamos a guardarlo y vamos a mi estrategia, vemos que ha dejado 00:09:26
aquí por el bebé bonito, volvemos al editor y vamos a seguir viendo cosas, le puedo cambiar 00:09:49
el diseño, no de la imagen sino del marco, aquí tengo el marco que he creado antes que 00:10:00
lo deja almacenado, aquí tengo más opciones, vamos a personalizar y vamos a ponerle también 00:10:12
una imagen redondita, le podría poner otras muchas y dentro de cada una tendría diferentes 00:10:18
opciones de opacidad, colores, sombras, bordes, etc. Vamos a ver la opción que me da, aquí 00:10:24
voy a poner el tipo elipse, en cuanto al borde, yo le puedo poner más o menos borde de diferente 00:10:30
color, le puedo cambiar el ancho, más o menos ancho el borde, vamos a dejarlo con 4 píxeles 00:10:38
y después esto en cuanto al borde y en cuanto al sombreado le puedo aplicar o no le puedo 00:10:47
aplicar sombreado, le puedo cambiar el ángulo, como vimos en las cajas contenedoras del vídeo 00:10:54
pasado, la distancia de la imagen la puedo modificar, el tamaño, el desenfoque, la opacidad 00:10:58
y relleno de la sombra y el color. 00:11:18
Puedo seguir recortándola, aplicar filtros, que eso ya lo hemos hecho antes y le puedo 00:11:35
poner una animación de entrada, como por ejemplo que entre rebotando, que planee, se 00:11:40
expanda, etc. y esto es cuando se cargue la página web. Vamos a ver como ha quedado, 00:11:48
vamos primeramente a guardar y vamos a darle a vista previa, aquí vemos como aparece, 00:11:55
el texto que le he puesto y el hiperenlace. 00:12:06
Bien, pues esto ha sido de donde digamos todas las opciones que puedo hacer respecto a una 00:12:18
imagen. En el próximo vídeo vamos a ver galerías y vídeos. Muchas gracias. 00:12:24
Idioma/s:
es
Idioma/s subtítulos:
es
Autor/es:
Roberto Soriano Casas
Subido por:
Roberto S.
Licencia:
Reconocimiento - No comercial
Visualizaciones:
10
Fecha:
21 de diciembre de 2023 - 19:34
Visibilidad:
Público
Centro:
IES PABLO PICASSO
Duración:
12′ 31″
Relación de aspecto:
1.89:1
Resolución:
1360x720 píxeles
Tamaño:
69.71 MBytes

Del mismo autor…

Ver más del mismo autor

EducaMadrid, Plataforma Educativa de la Comunidad de Madrid

Plataforma Educativa EducaMadrid