Cómo Optimizar las Imagenes de mi Blog con Photoshop

Cómo Optimizar las Imagenes de mi Blog con Photoshop

Ya hace meses que os comentaba en Imágenes y Seo. Cómo podemos posicionarlas, la importancia de las imágenes y fotografías que incluimos en los posts de nuestros blogs. Uno de los puntos que destacaba era el tamaño de las imágenes y como este afecta a la velocidad de carga de nuestra web. Y lo que es más importante cómo esto afecta al amor que nuestros lectores y google tienen por nosotros…¡un blog lento no lo quiere nadie!. Así que hoy vamos a ponernos con Cómo Optimizar las Imagenes de mi Blog con Photoshop.

Así mismo os daba 10 consejos para mejorar la velocidad de carga de un blog y de nuevo, uno de los puntos más significativos era la importancia de optimizar la imágenes. Por cierto, en este post, además de los consejos, os doy algunas alternativas para medir la velocidad de carga.

Si os soy sincera, hasta hace muy poco, me liaba un montón con esto de los Píxeles, los KB,  los MG y lo que hacía era simplemente era poner la foto o imagen como quedara más mona para el post, en definitiva solo ajustaba el tamaño desde el mismo blog. Hasta que me dí cuenta de que las imágenes hay que tratarlas antes de subirlas al blog si no queremos que se coman el espacio del hosting, además de hacer nuestro sitio superlento.

Permitidme que ahora ponga un ejemplo muy sencillo para entender todo esto del peso, tamaño…, imaginaros que queréis meter una maleta en un coche, hay varias posibilidades por las que puede resultar imposible hacerlo; porque la maleta sea demasiado grande en dimensiones y simplemente no cabe (tamaño en píxeles), otra porque aunque la maleta cabe perfectamente lleva dentro un material muy pesado que hace imposible que el coche circule con ella (peso en KB/MG) y otra porque aunque la maleta sea normal con unas dimensiones normales el coche ya está lleno ya que hemos estado en el pasado metiendo maletas si miramiento y no cabe ni un pelo puesto que el alojamiento ya está lleno.

Por último una aclaración, cada cosa va como por libre pero también están muy relacionadas, es decir, no porque pongas una foto pequeña te creas que pesa menos, sin embargo, por lógica una foto grande en dimensiones, pesará más que una pequeña. Siiii ya sé que es un poco lío pero veréis como cuando lo haga lo entendéis. Vamos a la cuestión, hoy en Tecnomamáblogger…

Cómo Optimizar las Imagenes de mi Blog con Photoshop

Antes de nada decir que yo uso Photoshop porque es el programa que mejor me viene, ya que la mayoría de imagenes que subo al blog son mis dibujos o bien si son fotos, siempre tengo que recortarlas o añadir texto…y también optimizarlas, así que lo hago todo con este programa. Pero hay más aplicaciones muy útiles y sencillas online, aunque quizá con menos posiblidades, para optimizar la imágenes, en otro post os hablo de ellas si os interesa.

Cojo como ejemplo una foto hecha con mí móvil. Así es tal y como la he tomado. Véis que es un archivo en formato JPEG, es el que suelo usar porque pesa mucho menos. La foto mide 2560X1920 en pixeles, así que en un cuerpo de blog normal no cabría y pesa una barbaridad 2,80MB (y no es de las que más pesan), comparad, si tenéis un hosting por ejemplo de 500MG renovable al año y sois de poner muchas fotos, pronto acabaríais con el espacio.

Descripción del archivo

Empezamos a optimizarla. Pinchamos con el botón derecho del ratón sobre el archivo y le damos a Abrir con. En la ventana paralela buscamos Adobe Photoshop.

Abrir archivo con PS

Ya la tenemos abierta en Photoshop. No se ve muy bien pero os digo que la foto está al 25% y fijáos en las dimensiones que tiene…grandísima! y además en el circulo de arriba pone que pesa 14.1MB, ¿por qué más de lo que pesaba antes!? porque ahora está en formato Photoshop que es mucho más pesado, imaginad que lo guardáis así sin daros cuenta…(a mí me ha pasado). Bueno seguimos, pinchamos sobre imagen y abajo sobre tamaño de la imagen.

Imagen-tamaño de la imagen

Nos aparece la pantalla de Tamaño de la Imagen. Si veis el peso al estar abierta en el formato del propio programa es de 14.1MG. Más abajo aparecen las dimensiones de nuestra imagen 2560X1920 en pixeles que es lo que vamos a cambiar ahora. Tambien os he rodeado los 72 pixeles/pulgada que es la resolución óptima que viene por defecto y que nosotros dejamos como está.

Tamaño de la imagen

Bien, pues modificamos la anchura y altura. En mi caso como tengo picado Restringir proporciones, si modifico la anchura, la altura se ajusta en proporción y suelo poner una anchura que quede bien para el cuerpo del post, por ejemplo 600 pixeles. Vemos que el peso ya se ha modificado a 549.3KB, ya pesa bastante menos aunque es aun demasiado. Una vez hechas las modificaciones picamos en OK.

Tamaño optimizado

Bueno pues ya tenemos la foto casi optimizada, ahora vamos a guardarla. En condiciones normales lo haríamos con Guardar como, verdad!? pero como la estamos optimizando para subirla a un post, podemos/debemos reducir su peso mucho más. Así que la guardamos pinchando en Guardar para Web y Dispositivos Móviles.

Guardar par aweb y dispositivos móviles

Se nos abre una pantalla completa del mismo Photoshop pero en la pestaña de Optimizada. Aquí, a la derecha, podéis hacer varias modificaciones; el formato en el que queréis guardarlo (JPEG, GIF, PNG…), la calidad (baja, media, alta…o bien en número), y la posibilidad de elegir una opción por defecto. Pero lo más importante es el dato de abajo, si os fijáis estáis guardando la foto con un peso de 35.66 KB y con la calidad adecuada para web y móviles…eso ya es otra cosa, verdad!? va a ocupar poquísimo espacio!!! Si os parece bien, le dais a Guardar.

Guardar optimizada. Cómo Optimizar las Imagenes de mi Blog con Photoshop

Y listo, ya solo tenéis que subirla a vuestro post con la tranquilidad de estar poniendo una foto o imagen optimizada.

Por cierto, a los que tengáis el hosting con Webempresa, os recuerdo que ofrecen como servicio gratuito un optimizador de imágenes, muy útil para poner al día el blog y aseguraros de optimizar todas las imágenes pasadas…un motivo más para contratarlos a través de mis banners jejejej

Pues esto es todo por hoy, espero que os haya servido aunque solo sea un poquito jejeje, ya sabes que mi experiencia es la que me ha dado ir haciendo estas cositas en mamá ríe, por eso estoy abierta a todo tipo de críticas y sugerencias siempre que sea para bien. Y si tenéis alguna duda o consulta podéis escribirme a mamarreir@gmail.com o al formulario de contacto del pie de página con el asunto Tecnomamablogger.

Y hablando de hosting, ofrezco el mejor del mercado, HOSTING WEBEMPRESA un 20% más económico con el cupón GRACIAS20, no tenéis más que contratarlo a través de  mis banner. También podéis beneficiaros los que residís en América, os recuerdo que la atención es en español las 24h del día los 7 días de la semana. Si queréis preguntarme por mi experiencia ya sabéis como encontrarme.

alojamiento wordpress

Para América:

alojamiento wordpress

 

 

15 comentarios en “Cómo Optimizar las Imagenes de mi Blog con Photoshop

  1. Madre mía me has dejado flipada con la explicación, me parece tan complicado!!. Echaba de menos tus tecnomamablogger porque aprendo muchísimo.
    Yo tuve una vez un problema con las fotos porque no sabía nada de este tema y ya no me dejaba subir más. Menos mal que pude utilizar la optimización de web empresa.
    Un besote

    • Te ha parecido complicado? Si tienes alguna duda me dices…La verdad es que los de webempresa tenemos suerte con estos servicios que ofrecen. Pero si las optimizamos nosotras es mejor.

  2. Hola!!!!! Pues yo soy un desastre, busco la foto que me interesa y la pongo, sin más, sin editar ni nada. Ya sabes que el último viernes de mes hago un resumen de las cosas chulas que me han pasado, pongo unas 15 fotos y nunca las edito ni les hago nada, y el resto de los post con fotos tampoco, ainnnns.
    La verdad es que no tengo photoshop pero desde ya me lo estoy planteando. Un besito y soy fan de esta sección.

    • Pues yo no sé en blogger pero en wp ya hubieras petado el hosting jejejejej por cierto a ver si vas pensando en cambiar! 😉

      Me alegro que te sea útil esta sección.

      Besos

Deja un comentario