homefinance blog
El impacto visual es una de las características más importantes cuando se trata de un plan de marketing de contenido impactante.Bienvenido a una nueva serie de publicaciones: la última guía para administrar imágenes en WordPress.Está diseñado para proporcionarle las herramientas necesarias para administrar sus activos de imagen en WordPress, incluso de optimizaciones técnicas, SEO, integración de CDN y administración de bibliotecas.En esta guía multipart, recomendaremos solo esos métodos, tutoriales, complementos y temas que hemos probado o recomendado por parte de expertos de la industria.También evitaremos la sugerencia ciega de complementos que tienen un alto uso en el almacén de WordPress.Más bien, recomendaremos aquellos que dan la conexión perfecta entre la propuesta de valor y la optimización del rendimiento.
Tal vez se pregunte cómo lo haremos. Es posible que más de 24,000 descargas del total de WordPress, receptivo multipropósito de Themeforest no sean un excelente indicador. Bueno, he tomado los mejores blogs de las empresas de alojamiento de Toppress de la industria (como Wpengine y Pagely) y aprendí lo que aprendieron cuando sirvieron de miles de millones de visuales de página a miles de clientes de alto perfil. Hemos comprimido toda esta información para usted en pequeños párrafos y puntos de bala para su éxito en línea. Ahora comencemos, ¿no? Consejos técnicos y de optimización de rendimiento para imágenes de WordPress Hay bastantes opciones para optimizar la imagen disponible en WordPress que no ponen tareas innecesarias en el servidor web. Veremos algunos de los consejos de optimización de imágenes más comunes que todos deben seguir, junto con varias otras que vienen en ocasiones especiales.
JPG o PNG? Usando el formato de imagen correcto, el primer paso en la optimización de imágenes es un buen comienzo. Se dice que un trabajo bien iniciado está medio terminado. Este es exactamente el caso cuando se trata de optimizar la imagen en WordPress. Todo comienza con elegir el formato de imagen correcto. JPG y PNG son los dos formatos de imagen más comunes utilizados en línea en el marketing de contenidos. El truco es comprender qué formato elegir para cada tipo de imagen. La elección incorrecta provoca un crecimiento monumental del tamaño de la imagen. Estas son las reglas. ¿Cuándo se usa el formato PNG? Para imágenes planas, como vectores, ilustraciones, fuentes, logotipos, pancartas, formas, pancartas, etc. – Cualquier cosa se crea en un formato vectorial, como EPS o Adobe Illustrator (.ai), use un PNG. Obtendrá una imagen optimizada con casi cero pérdidas de calidad. Si usa un JPG en este caso, no comprometerá el tamaño, pero la calidad puede agotarse. De hecho, a resoluciones más altas, PNG sería más fácil sin pérdidas de calidad. El JPG sufriría. Crearemos una imagen plana a 5000 PX y la guardaremos como JPG y PNG.
Ejemplo de imagen utilizada para la prueba
| Imagen plana | |
| 233 kb | png | 42kb |
En resumen, la imagen JPG fue 455% más alta que PNG para la misma resolución. ¿Cuándo se usa el formato JPG? Para cualquier otra cosa, use un JPG. Use JPG para cualquier otra cosa que no sea una imagen plana o vectorial. Fotos con personas, lugares, cosas, etc. – Use JPG. Casi todas las fotos en esta categoría usan JPG. Si usa PNG en lugar de un JPG, tendrá serios problemas de rendimiento. Tienes que tener mucho cuidado en este caso. Si está utilizando un JPG en lugar de un PNG, sería pequeño o ningún daño. Sin embargo, si usa un PNG sangriento en el caso de un JPG, cree mucho espacio para el daño. Eche un vistazo a este ejemplo. Configuración: descargué esta imagen de Shutterstock, que pesa alrededor de 10.3 Mb a una resolución de 6149 × 4562, esencialmente, una foto de 28 MP. Si no preparamos algo como un folleto listo para imprimir, no utilizaremos la resolución completa de la foto en nuestros blogs. Supongamos que tenemos una dimensión de imagen fija máxima en nuestro blog 1600 PX. Experimento: cambiaremos el tamaño de la imagen de origen a 1600 PX y crearemos cuatro versiones: dos para formato PNG y dos para JPG. Para cada formato (JPG / PNG), utilizaremos (a) Configuración de compresión recomendada y (b) Configuración máxima de compresión.
Ejemplo de imagen para el experimento jepg
Resultados: Aquí están los resultados en un hermoso gráfico que debe seguir:
A primera vista, podría pensar que el 84% de compresión PNG es Lo suficientemente bueno para el 98% hecho en JPG. No es realmente cierto. Si observa más de cerca el tamaño de la imagen, verá que PNG pesa poco más de 1.7 MB, mientras que JPG es 0.22 MB. Lo que significa que PNG es 8 veces más difícil que la versión JPG de la misma imagen a la misma resolución. En otras palabras, para la misma imagen y resolución, ¡la versión JPG es 700% más ligera que PNG!
¡Para la misma imagen y resolución, la versión JPG es 700% más ligera que PNG! Por lo general, use PNG para imágenes planas y JPG para cualquier otra cosa. Lista de verificación para cargar fotos de archivo en blogs Hay muchos blogs en los que los editores cargan directamente la versión completa de resolución de imágenes en sus publicaciones de blog. Aquí hay algunas indicaciones para cargar fotos de archivo en blogs. Utilizo un software gratuito llamado IRFANVIEW que tiene muchas funciones maravillosas. Ilustraré cada uno para ti. 1. Cambie la imagen primero, debe decidir una resolución máxima para todas las imágenes en su sitio web de WordPress. Cualquier imagen arriba de esa dimensión se redimensionaría, a menos que, por supuesto, sea más pequeña. Herfanview tiene una función de conversión en el lote (presione B después de iniciar la aplicación) que puede aplicar una lista de funciones a una pila de imágenes desde una fecha. Para nuestros propósitos, las funciones incluyen cambiar el tamaño, el corte, la adición de una marca de agua, etc. 2. Elimine los datos de Exif Las fotos Haga clic en una cámara normal tienen muchos metadatos construidos, que no son más que información de imagen pequeña (pero útil). Ejemplos de dicha información incluyen las coordenadas GPS del lugar donde la imagen, la configuración ISO, el modelo de cámara, etc.
La información exif de una foto aleatoria ha hecho clic en mi iPhone
A menos que hagamos blogs de fotos, en general no queremos dicha información en la imagen de una publicación de blog. Cuando guarda o convierte las imágenes en IRFANVIEW, los datos de Exif generalmente se eliminan. Esto le ayuda a mantener su confidencialidad, especialmente la ubicación física. La diferencia de tamaño para la mayoría de las fotos es de aproximadamente 200-300 kb por imagen. 3. Guardar como JPG progivirfanview ha desinflado a los jepgs como progresivo
Una imagen JPG progresiva carga la capa por capa, acelerando así el tiempo de carga. Las redes de entrega de contenido, como KeyCDN, comenzaron a convertir automáticamente los JPG en JPG progresivos para acelerar la entrega de imágenes y optimizar el almacenamiento.
4. Establecer DPI a 72 ppp o puntos por pulgada es una medida de calidad de imagen. Para los materiales impresos, se utiliza un alto valor de DPI. Para la web, un valor de 72 es perfecto. Bien, resumiendo lo anterior, las siguientes son mis configuraciones. Ejecuto esta función una vez que he compilado todas las imágenes para mi publicación de blog, antes de cargar las imágenes en WordPress.
Configuración de conversión en el lote en Irfanview para un blog típico de WordPress
5. Optimice sus imágenes, ya sea que haya usado JPG o PNG, debe optimizar su imagen. Hay muchas herramientas maravillosas en línea que lo ayudan a optimizar sus imágenes y ahorrar mucho espacio.
Estoy hablando de servicios como TinyPng o TinyJPG que simplemente optimiza sus imágenes PNG / JPG con algunos algoritmos avanzados.
Imágenes optimizadas en tinypng
Para ser honesto, no sé cómo funcionan los algoritmos, pero siempre trabajo y siempre he logrado obtener un descuento del 50-70%, sin importar cuán bien los guardo.También puede comprar la versión Pro del servicio como complemento Photoshop a 50 USD.Ambas versiones para Windows y Mac están disponibles.Para mis propósitos, la versión en línea (junto con el Save in Dropbox) funciona mejor.Los complementos de optimización de imágenes en WordPress Hasta ahora, he aprendido pasos para comenzar correctamente.¿Qué sucede si te encuentras con esta publicación ahora y ya subes 100 imágenes?Bueno, aquí hay algunos complementos para ayudarlo en esto: EWWW Cloud Image Optimizer
Este complemento es una bifurcación del optimizador de imagen EWW de complemento original y extremadamente popular. Al reunir más de 500,000 descargas, este enchufe de optimización de imágenes le permite optimizar las imágenes a medida que se cargan en WordPress. Lo que lo diferencia de la competencia es su capacidad para optimizar las imágenes existentes en la base de datos, lo que resulta en un gran rendimiento. También ahorra importantes costos de ancho de banda porque la mayor parte de su tráfico proviene de artículos antiguos. También puede elegir opcionalmente para activar la compresión con pérdidas (que apenas es visible a simple vista), pero puede ahorrar mucho espacio y ancho de banda. En términos de tecnología de optimización, puede usar TinyPng o TinyJPG API para optimizar las imágenes nuevas y existentes. Pero aquí está el problema. Muchos hosts (incluido WPEngine) no permiten el complemento de optimización de imágenes EWWW, porque pone una gran carga adicional en el servidor. Si de alguna manera se las arregla para evitar las restricciones del servidor, puede arriesgarse a suspender su cuenta debido a violaciones de la póliza. Aquí viene el complemento EWWW Cloud Optimizer. Descargue todo el cálculo necesario para optimizar las imágenes en la nube y simplemente reemplaza las imágenes no optimizadas. Debido a que la potencia del procesador es prácticamente cero para la compresión, no hay tarea adicional por severa. Esto es cierto para todas las conversiones de imágenes nuevas y existentes en su sitio web de WordPress. Planes y precios:
Como es de esperar, el complemento no es gratuito, porque el desarrollador tiene que pagar las facturas de computación en la nube. Sin embargo, el precio es extremadamente razonable, que cuesta $ 9 por 3000 optimizaciones de imágenes para una suscripción prepago. El complemento EWWW Cloud Optimizer está bellamente diseñado. El escáner de medios le muestra cuántas imágenes necesita optimizar antes de realizar una compra. Según las imágenes de su servidor, puede comprar un plan prepago relevante. Tinypng WordPress Pluginacesta es otro excelente complemento de optimización de imágenes que se integra directamente con el servicio TinyPng / JPG. Las imágenes nuevas y existentes se cargan automáticamente en la biblioteca de medios de WordPress. Este complemento ofrece un plano gratuito de 100 optimizaciones de imágenes por mes. Freddy ha compilado una lista de complementos de optimización de imágenes hace algún tiempo; dale una lectura si quieres obtener más información sobre este tema. Conclusión Esto nos lleva al final de la primera publicación de esta serie. En el siguiente artículo, descubra cómo hay algunos consejos y trucos menos conocidos sobre la optimización de imágenes, como prevenir lazos rápidos, tomar imágenes de servidores remotos y similares. ¿Tiene algunos consejos en la categoría de inicio correcta? Cuéntanos en los comentarios a continuación.
Tags Guía final para la gestión de imágenes de WordPress
