Students Save 30%! Learn & create with unlimited courses & creative assets Students Save 30%! Save Now
Advertisement
  1. Photo & Video
  2. Compression
Photography

Cómo exportar ficheros JPG para la Web desde Adobe Photoshop Lightroom

by
Difficulty:BeginnerLength:MediumLanguages:

Spanish (Español) translation by Santiago Carnago (you can also view the original English article)

Tal vez, el mayor placer que ofrece la fotografía, es poder compartir tu trabajo con los demás y mostrar tus creaciones. Sin embargo, el camino para dominar la calidad de las imágenes en línea, puede ser difícil. En este tutorial, mostraré cómo obtener los mejores resultados de compresión y exportar imágenes listas para la web.

El Baile de la Compresión

Ya sea que tus imágenes estén siendo subidas a un sitio web o enviadas por correo electrónico a familiares y amigos, la compresión es necesaria. Crear imágenes para las capacidades restringidas de la web, significa que pesa la relación inversa entre la calidad de la imagen y el tamaño del archivo de la imagen. A medida que aumenta la calidad de nuestra imagen, también lo hace el tamaño del archivo de imagen.

Una parte esencial del diseño web es tener en cuenta la experiencia del usuario final (Tuts+ tiene un fantástico curso de UX, si estás interesado), o priorizar la capacidad del visitante, de visualizar y navegar el sitio web cómodamente. Una carga de página rápida, que en parte, está determinado por el tamaño del archivo de la página web, es parte fundamental de la experiencia del usuario. Las imágenes representan el 62% del peso del tráfico web. Mantener imágenes pequeñas en el tamaño final del archivo web ayuda a que los sitios se carguen mucho más rápido.

Como fotógrafos, estamos constantemente chocando contra esta barrera. Queremos fotos grandes y gloriosas. Y si queremos que nuestras imágenes aparezcan grandiosas en la web, no quieres forzar tiempos de carga lentos para nadie. El Balance es la Clave

Cuando exportamos imágenes para la web desde Adobe Photoshop Lightroom, tenemos que considerar dos aspectos fundamentales: calidad y tamaño.

Exportando en Lightroom

Antes de profundizar en el proceso de optimización de las exportaciones, vamos a revisar como hacer una exportación básica en Lightroom.

Elige una Imagen

Para iniciar una exportación, elige una imagen o una serie de imágenes a exportar. Prefiero elegir las imágenes que deseo exportar desde la cinta de película (Film Strip). Después que hayas seleccionado las imágenes para la exportación, puedes hacer clic derecho en Windows o Control + Clic en Mac para elegir Exportar > Exportar en el menú contextual.

Export export
Para exportar una imagen, elija Exportar > Exportar en el menú contextual.

Después de iniciar la exportación, aparecerá una nueva ventana con una variedad de opciones. Echemos un vistazo a los ajustes principales que elegirás con cada exportación.

Ubicación de la Exportación

La ubicación de la exportación indica dónde se guardarán las imágenes terminadas. Puede elegir una carpeta del menú desplegable y marcar la casilla "Colocar en subcarpeta", si desea que todas las imágenes se almacenen en la misma carpeta.

Nombres de Archivo

Cada exportación también puede contar con sus propios ajustes para renombrar los ficheros. Si nos quedamos con la opción por defecto, las imágenes mantendrán el mismo nombre que los archivos originales, pero serán guardadas en un tipo de imagen estándar, como JPEG. También puede marcar la casilla "Cambiar nombre a" y elegir una de las plantillas para renombrar que ofrece Lightroom y personalizar el nombre de archivo de las imágenes exportadas.

File naming

Ajustes de Archivo

El panel de ajustes de archivo es uno que analizaremos un poco más a profundidad cuando estamos buscando el equilibrio entre calidad y tamaño de archivo. En esta pantalla, están mis sugerencias para cada opción:

  • Formato de imagen: JPEG casi siempre, sobre todo si las imágenes están limitadas para su uso en la web
  • Espacio de color: sRGB siempre
  • Calidad: Este control le permite elegir la calidad de la imagen que se exporta; un número menor es una calidad baja, pequeño archivo; arrastrar el control deslizante hacia la derecha aumenta el tamaño de la calidad y archivo de imagen
  • Limitar tamaño de archivo a: también podemos comprobar la opción de "Limitar tamaño del archivo a" y poner un límite en el tamaño del archivo de la imagen guardada
File settings

Tamaño de Imagen

Cambiar tamaño de imagen es otro panel que controla el tamaño de nuestras imágenes. Usted puede elegir las dimensiones, así como el DPI de las imágenes exportadas.

Image sizing

Exportar para la Web

Cuando se trata de encontrar el equilibrio entre la calidad de la imagen y el tamaño del archivo, aquí están los principales aspectos a considerar:

Tamaño

La primera parte de una exportación eficiente debe considerar el tamaño de la imagen en la web. El tamaño de una imagen son las dimensiones reales en píxeles de la imagen.

Cuando las imágenes salen de la cámara, sus dimensiones son enormes. Por ejemplo, las imágenes de 22 megapíxeles de una Canon 5D Mark III miden 5760 x 3840 píxeles. Sin embargo, la pantalla de mi ordenador portátil es de sólo 1440 x 900 píxeles. ¿Ven el problema? Radica en el hecho de que imágenes de la web también son más pequeñas que el ancho de nuestros monitores y es clara la necesidad de redimensionar.

Image size
Puedes observar las dimensiones reales de una imagen en Lightroom pulsando la tecla "i" en el teclado. Mostrará las dimensiones en píxeles de la imagen captada. Puedes ver aquí que las imágenes que salen de la cámara serán mucho mayores de lo necesario para la web, donde las imágenes son típicamente de unos 1000 píxeles de ancho o menos.

Para los tutoriales en Tuts+, nuestras imágenes se redimensionan a 600 píxeles y un tamaño máximo de archivo de 200 kilobytes. Esto asegura una carga rápida y para la mayoría de las personas, cumple el propósito. Si estás leyendo esta página en tu smartphone, hay buenas probabilidades que cargue bastante rápido, incluso si estuvieras en una conexión lenta.

Export - Long Edge
Mi método favorito para exportar imágenes en Lightroom es elegir la opción "Redimensionar para encajar -> borde largo" en el cuadro de diálogo de exportación. Esto ajustará el tamaño de todas las imágenes para ser de 600 píxeles en su lado mayor, ya sea en orientación horizontal o vertical. El otro lado se calcula automáticamente. Esta es una gran opción cuando estoy exportando para Tuts+, donde todas las imágenes son de 600 pixels en el lado largo.

Calidad

En un mundo perfecto, siempre podríamos exportar imágenes en máxima calidad. En la realidad, descubrimos que las exportaciones de máxima calidad no siempre son necesarias. En tamaños para la web, las diferencias en la calidad son a menudo difíciles de percibir, y eso significa que podemos reducir un poco la calidad y reducir el tamaño del archivo considerablemente.

En el extremo superior de la escala de calidad se observan rendimientos decrecientes. Es difícil percibir una diferencia de calidad notable entre un 90 y 100 en ajuste de la calidad, pero aumenta significativamente el tamaño del archivo final.

Web Quality Comparison
La imagen de arriba muestra la comparación de calidad con diferentes ajustes del control deslizante. En la posición más baja de calidad, definitivamente se puede observar algunas bandas en el cielo. A medida que aumenta la calidad, también lo hace el nivel de detalles en las calles y la casa, pero a costa de un archivo de imagen más grande como se muestra a continuación.
Ajuste de Calidad de Lightroom Tamaño del Archivo en la Exportación
25 91kb
50 122kb
75 168kb
100 366kb

Dados los resultados anteriores, es probable que seleccione la exportación de calidad 75. Ofrece el equilibrio correcto de calidad y se ajusta al límite de 200kb que establece Tuts+ para las imágenes.

Perfiles Incrustados para la Web

Un paso importante a verificar cuando exportas imágenes para la web es incluir el perfil de color adecuado en las exportaciones. Daniel Sone tiene un gran artículo en Tuts+ sobre los espacios de color, pero con el fin de exportar en Lightroom, debes garantizar que el perfil de color incrustado sea sRGB.

Export with sRGB
Al exportar para la web, asegúrate que has seleccionado "sRGB" como espacio de color para obtener los mejores resultados.

Ajustes Preestablecidos de Exportación

Incluso al exportar para la web, existen un número de escenarios que pueden afectar sus ajustes. Si bien estamos optimizando para reducir el tamaño del archivo, hay ocasiones en las que una mayor calidad o imágenes de mayor resolución son necesarias. Por eso, los ajustes preestablecidos de exportación son increíblemente útiles; puedes crear varias opciones y utilizarlas para obtener tamaños diferentes.

En la ventana de exportación, es muy fácil guardar los ajustes actuales de la exportación. Después que hayas elegido todos los ajustes de exportación, presiona el botón «Añadir» y guarda tus ajustes preestablecidos listos para la web.

Save Export Preset
Después que hayas añadido tus reglas de redimensionamiento y calidad, no olvides guardarlos como "Ajustes de Exportación" pulsando Agregar. Se guardarán todas sus reglas; te recomiendo construir varias, para diversos objetivos en la web.

El Resumen

En este tutorial has aprendido algunas de las mejores prácticas e ideas para realizar una exportación eficiente de imágenes para la web. Comprimir tus imágenes para la web asegura que a tus visitantes les cargará rápidamente. Con los ajustes correctos, podemos aún, mantener una calidad alta.

¡Sé el primero en conocer las nuevas traducciones–sigue @tutsplus_es en Twitter!

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.