¿Cómo optimizar mis pictogramas para pantallas Retina?

Convierto mis imágenes vectoriales y logotipos en una fuente (o fuentes). Tome sus archivos .ai (después de limpiarlos, crear una ruta compuesta y recortar el cuadro de vista) y exportarlos como .svg. Luego use la aplicación icomoon para convertir a una fuente. Esto se mostrará en cualquier tamaño, cualquier resolución nítidamente.

https://icomoon.io/app/#/select

Obtenga más información: http://www.carbonsilk.com/development/convert-images-to-web-font-icons/

Necesitas exportar tus gráficos a doble resolución, por ejemplo, si para una pantalla estándar necesitas una imagen con una resolución de 64x64, necesitas una copia de 128x128 (o incluso no una copia) que luego se procesará en pantallas retina/de alta resolución. . Pero diferentes entornos pueden procesarlos de manera diferente, por ejemplo, en HTML/CSS necesita consultas de medios adicionales para que cada tipo de pantalla se muestre correctamente en cada pantalla.

Con los vectores, es bastante simple exportar activos a doble resolución, el ráster a veces requiere un redibujado completo si originalmente creó una imagen de baja resolución.

Además, si el único caso de uso es la web, puede ver lo que SVG puede ofrecer.