Como recortar las imágenes para tu página web

Como recortar las imágenes para tu página web

08-06-2016

Una de las preguntas más habituales a la hora de autogestionar tu propia web, blog o tienda online es: ¿qué tamaño deben tener las fotos que tengo que voy a utilizar?. La respuesta generalmente dependerá de la sección o ubicación de la misma. Es decir, no se utiliza el mismo tamaño para una galería de fotos, un banner publicitario o ilustrar un servicio.

Lo primero que debemos conocer cuando vamos a subir una imagen a nuestra web, es el tamaño requerido. Para esto debemos fijarnos cuales son las proporciones admitidas para ese campo y seleccionar una imagen que sea del tamaño requerido o algo más grande. Si no no sabes donde poder descargar fotografías no dudes en leer nuestro post sobre "Bancos de Imágenes".

A continuación vamos a explicar dos formas de recortar una imagen de una forma sencilla, para luego poder introducirla en tu web.


Recortar imágenes mediante VSO image Resizer
(Herramienta sencilla - gratuita - Windows)

  1. Descarga el programa.
  2. Una vez instalado, ir a la imagen que se quiere redimensionar.
  3. Clicar con el botón derecho del ratón.
  4. Elige la opción VSO Image Resizer.
  5. Selecciona la "Resolución" (por ejemplo 750px. x 500px).
  6. En "Destino" se debe indicar la carpeta donde se quiere guardar la imagen recortada.
  7. Marca la opción "Guardar por defecto" para no tener que volver a introducir la resolución.
  8. Por último clica en "OK".

Recortar imágenes mediante Gimp
(Herramienta profesional - gratuita - Windows/Mac/Linux)

  1. Nos descargamos e instalamos Gimp desde su página oficial.
  2. Una vez instalado abrimos la imagen en el programa.
  3. En el menú principal de la aplicación seleccionamos "Escalar" (Menú->Imagen->Escalar la imagen). Aparecerá un recuadro con varias opciones. Seccionamos la "Anchura" e insertamos la anchura requerida y clicamos en altura (es importante mantener la cadena para que se recorte proporcionalmente) y clicamos en "Escala". 
  4. Llegados a este punto puede que "Anchura" y "Altura" coincidan, si este es tu caso pasa al último punto de lo contrario continua con los siguientes pasos.
  5. Tendremos usar la funcion de recorte manual. Esta herramienta esta en el menú principal "Recortar" (Menú->Herramientas->Herramientas de selección->Selección rectangular). Una vez seleccionada la herramienta clicamos con el botón izquierdo y arrastramos hasta alcanzar el tamaño deseado. Para saber exactamente las proporciones en la barra de herramientas de la izquierda existe un apartado llamado "Tamaño" donde nos muestra tanto el ancho como el alto.
  6. Ahora vamos a hacer tres pasos seguidos. En el menú principal "Copiar" (Menú->Editar->Copiar), "Crear imagen a escala" (Menú->Archivo->Crear->Desde el portapapeles) y por último clicamos en la nueva pestaña que se ha creado.
  7. Para terminar "Guardamos la imagen" (Menú->Archivo->Exportar como). En la ventana que aparece elegimos donde guardarlo y la extensión ".jpg". Ya que es el formato ideal para web.

Mediante cualquiera de estas dos técnicas podrás recortar y adaptar tus imágenes de forma sencilla. Debemos ser conscientes de la importancia de subir los contenidos de una forma adecuada a nuestro sitio web.

Tu web es tu imagen, ¡cuídala!