¿Guardar activos para Web?

¿Es una buena práctica hacer un ícono, por ejemplo, en Ai y luego exportarlo a una resolución png 72 para usar en la web?

Los navegadores web ignoran la configuración de PPI. Todo lo que importa para las imágenes rasterizadas en la web es la cantidad de píxeles. ¿De qué tamaño es la imagen que estás sacando? ¿Cómo se ve en las pantallas de alta resolución? ¿Es lo suficientemente grande? Eso es todo lo que importa realmente.
¿Todo el mundo supone que te refieres a PPI/PPC (usado para imprimir) cuando dices resolución y no realmente la altura y el ancho de píxel como se define en tu configuración de exportación? ¿Puedes confirmar? *¡Solo necesitas PPI/PPC si lo que estás subiendo a la web también está diseñado para ser impreso!

Respuestas (3)

No importa, la web esencialmente muestra 1 píxel como un píxel y simplemente ignora la configuración de resolución de paso de píxel. Pero si quieres que Illustrator sepa el tamaño de un píxel, entonces sí. Solo cuenta el número de píxeles.

¿Es una buena práctica hacer un ícono, por ejemplo, en Ai y luego exportarlo a una resolución png 72 para usar en la web?

Solo parcialmente. 72 no significan absolutamente nada en un documento electrónico.

Illustrator, en mi opinión, tiene una gestión de unidades muy torpe. Conserva el ridículo mito de que 72ppi es para la web.

Si inicia un documento para imprimir, digamos cm o pulgadas como unidad, la resolución interna del documento es de 300 ppp. Podrías exportar un cuadrado de 1x1 pulgada a 300ppi y mediría 300px.

Pero cuando cambias las unidades de ese mismo documento a píxeles (donde ya diseñaste algunos activos pensando que medirían 300 px) dice que tu activo mide 72px... porque cambia la resolución interna a 72 sin previo aviso. Eso es tonto.

Otro problema es que Illustrator tiene un cuadro de diálogo de exportación muy pobre, que no te dice la medida importante, los píxeles. Debe definirlo al iniciar un nuevo documento y trabajar con él, no solo en la exportación.

Por estas razones, la "mejor" práctica es:

  1. Defina el píxel como una unidad en Illustrator desde el inicio .

  2. Exporte el activo en la resolución definida por la resolución interna del documento. En este caso 72.

  3. O exporte el icono como SVG.


Este mito de 72ppi probablemente terminaría si el programa agregara un diálogo simple sobre las dimensiones de los píxeles.

Esta es una captura de pantalla del cuadro de diálogo de exportación de Corel Draw. Es similar a Exportar para web desde Illustrator.

a. En el fondo, puede ver que puede hacer un ícono del tamaño que desee en un documento de tamaño carta.

Y en la exportación, puede ver y cambiar las dimensiones de píxeles (naranja) independientemente de la información de ppi (rojo)

ingrese la descripción de la imagen aquí

Si solo agregaran una información simple sobre el tamaño exportado resultante en píxeles (cian)... Seguiré soñando...

ingrese la descripción de la imagen aquí

La mejor práctica es usar svg

Para todo lo demás, utilice la exportación de activos

ingrese la descripción de la imagen aquí

¿Qué hace específicamente la "Exportación de activos"? es esa la unica manera? Edite su respuesta para explicar un poco mejor , ya hay otra respuesta mucho más informativa.
Debería ser bastante obvio al mirar la captura de pantalla, le permite exportar sus elementos vectoriales a múltiples salidas con múltiples valores (tamaño, resolución, formato). Dado que SVG se puede escalar sin preocuparse por las dimensiones de la imagen, no encuentro ninguna razón para NO usar SVG, para otras aplicaciones, es posible que desee tener varios archivos para la misma imagen con sus propios atributos según sea necesario.