Así que hice que un diseñador en 99Designs creara un logotipo para mí, es Vector y generó el tamaño del logotipo que puedes ver en mi sitio web aquí: sandiegosoftware.net
Entiendo que mi navegador, SO y la resolución de mi monitor pueden afectar el aspecto, pero no me parece muy nítido. Parece un buen diseñador, ¿hay alguna área, como el suavizado, que podría mejorar?
Es una imagen dinámica configurada para cambiar de tamaño según el tamaño de la ventana del navegador. Algunos tamaños se verán pobres. Establecer un tamaño específico para la imagen (luego ajustar las consultas de medios CSS del sitio para llamar a otros tamaños para otras pantallas) serviría mejor.
La mayoría de los logotipos de sitios web no se ajustan a escala cuando cambia el tamaño de la ventana del navegador. Si bien esa teoría funciona maravillosamente para la mayoría de las imágenes, el logotipo es más importante y debe manejarse específicamente.
Primero, como han mencionado otros, la imagen del logotipo se muestra en un tamaño diferente de su tamaño real. Hacer eso deja que el navegador realice el submuestreo/supermuestreo necesario para cambiar el tamaño de una imagen y los navegadores no son impresionantes en eso.
Junto con eso, parece que el archivo de logotipo que está utilizando está un poco borroso. PNG es un buen formato aquí, pero el diseñador posiblemente pueda obtener una versión más nítida exportando con diferentes configuraciones de suavizado. Por ejemplo, en Illustrator, "Tipo optimizado (sugerido)" en lugar de "Arte optimizado (supermuestreo)" en el cuadro de diálogo de opciones de exportación PNG.
Mientras te consigue una versión más nítida, pídele que la exporte en las dimensiones exactas en las que piensas usarla. Parece que el navegador está tratando de mostrar la imagen de 385 píxeles de ancho como 333,719 píxeles de ancho. si le diera uno de 333px de ancho, sería más nítido; sin embargo, esos píxeles parciales seguirán causando problemas debido a que se confía nuevamente en el navegador para realizar sugerencias). Su diseñador/desarrollador web puede ayudarlo a solucionarlo (y obtener todos los tamaños de los logotipos sensibles).
A mí me parece bastante crujiente, pero de hecho se ve un poco aplastado. ¿Quizás las dimensiones de la imagen original producida por el diseñador no son similares (por ejemplo, 1000x1000 --> 2000x2000) a la forma en que la muestra en su sitio?
Alternativamente, puede usar un SVG a 385x105 en lugar de PNG o JPG. Los SVG son independientes de la resolución, lo que significa que nada de esto de "mi logotipo se verá bien en la pantalla de todos" es motivo de preocupación. Y muchas veces, un SVG será más liviano que un JPG o PNG. Y SVG funciona muy bien con consultas de medios.
brian ogden