Desafío 1 Imagen-adicto: Tratamiento y optimización de imágenes para Internet
Desafío 1 Imagen-adicto: Tratamiento y optimización de imágenes para Internet
Requisitos de finalización
Recibir una calificación
Apertura: martes, 19 de enero de 2021, 12:00
Cierre: lunes, 1 de febrero de 2021, 23:59
Objetivos:
- Trabajar la competencia digital área 2. Recursos digitales: 2.2 Creación y modificación de recursos digitales.
- Aprender a re-dimensionar y cortar imágenes para ajustarlas en nuestro espacio.
Desarrollo
Aprender a trabajar con imágenes es muy importante para una web. A veces nos encontramos con imágenes de las que sólo nos interesa una parte, o bien imágenes muy grandes que nos conviene hacer más pequeñas para no sobrecargar demasiado nuestra web. Pues bien, el objetivo de esta actividad es aprender a re-dimensionar y cortar imágenes para ajustarlas en nuestro espacio.
Tomamos una imagen como la que vemos aquí, será nuestra imagen de partida:
Origen Pixabay. Autor: SkitterPhoto. Licencia CC
La imagen de partida original, con la que nosotros trabajaremos en este desafío, tiene unas dimensiones de 5.803 píxeles de ancho por 3.873 píxeles de alto y un tamaño en disco de 3.858KB.
Una imagen de ese tamaño, ocuparía mucho espacio en nuestra web, y llevaría mucho tiempo descargarla y mostrarla en nuestra página, no es manejable. Además, imaginemos que para nuestra web necesitamos una imagen cuadrada que muestre sólo el bote de pinceles.
Nos encontramos ante un desafío que como vemos tiene dos partes. En primer lugar conseguir recortar la imagen para que sea cuadrada y muestre sólo el bote de pinceles. En concreto necesitamos una imagen de 300 píxeles de ancho por 300 píxeles de alto.
Y en segundo lugar, necesitamos que ocupe en disco menos de 50KB, para que no penalice demasiado la navegación por nuestra página.
Necesitamos un resultado similar a este:
Y para poder superar este desafío, estos son los pasos que debes realizar:
- Descarga la imagen original de partida a tu ordenador, desde este enlace: Imagen de partida.
- Trata la imagen (bote de pinturas.jpg) para conseguir recortar las dimensiones pedida.
- Una pista: Escala la imagen sin deformarla, hasta que tenga una altura de 350 píxeles y a continuación, ajusta el tamaño del lienzo y la posición de la imagen para conseguir un cuadrado de 300x300 con el bote de pinceles centrado en él.
- Guarda la imagen recortada y reescalada en tu ordenador, ajustando los parámetros de calidad para conseguir que no ocupe más de 50KB en disco.
Entrega
- Una vez optimizada la imagen súbela a la plataforma. Si no sabéis cómo hacerlo, sigue las Instrucciones para entregar la actividad.
Evaluación
- La tarea se considerará superada si la imagen que has entregado:
- Es la solicitada.
- Está tratada correctamente, se ajusta a las dimensiones y tamaño pedidos y no se ha deformado.
- Cuando tu tutor/a haya evaluado la tarea podrás ver aquí los comentarios de retroalimentación.