En esta nota vamos a contarte acerca de algunas recomendaciones al momento de cargar tu logo en un sitio web de Grid. 

Veremos detalladamente los siguientes puntos:
1. Formatos de imagen: SVG, PNG y JPG
2. Versión apaisada del logo
3. Logo para email
4. Favicon

1. Formatos de imagen: SVG, PNG y JPG

Al momento de subir el logo podemos elegir entre tres formatos de archivo diferentes: SVG, PNG o JPG.
Hablemos de las diferencias que hay entre estos tres tipos de archivo. 

Para empezar, la principal diferencia entre SVG y los dos últimos, es que este es un formato de archivo vectorial. Esto significa que la información del mismo no está guardada pixel por pixel sino que son valores sobre un eje de coordenadas; lo cual nos garantiza que se verá bien (sin pixelarse) en cualquier resolución de pantalla y a cualquier tamaño.

Los formatos PNG y JPG son formatos de imagen basados en pixeles (también conocidos como raster), con lo cual la calidad de visualización puede variar dependiendo del tamaño de la imagen y la resolución de pantalla.

El formato PNG tiene mayor calidad (y mayor peso) que el formato JPG, sobre todo para archivos con texto, colores plenos o degradés. Además, a diferencia del formato JPG, el formato PNG soporta transparencias. Si no tenés tu logo en formato vectorial, es probable que PNG sea tu mejor opción.

El formato JPG tiene mayor compresión y "suavizado", lo cual puede reducir su calidad en archivos con texto, colores plenos o degradés, pero no es problema para otro tipo de archivos como una foto de un paisaje. Utilizá este formato de archivo para tu logo sólo si no tenés otra alternativa, y asegurate de que el color de fondo coincida con el de tu encabezado ya que JPG no soporta transparencias.

En resumen, lo mejor es cargar tu logo en formato SVG. En segundo lugar PNG, y tercero JPG.

Zoom sobre logo SVG

Zoom sobre logo PNG

Zoom sobre logo JPG

2. Versión apaisada del logo

Al momento de cargar nuestro logo en un sitio web de Grid, si tenés diferentes versiones de tu logo (algo que está bueno pedirle a tu diseñador a la hora de hacer un logo), en general suele quedar mejor la versión apaisada por el espacio disponible en el encabezado. 

En el siguiente ejemplo vemos dos versiones diferentes del mismo logo, al subirlo al administrador recomendamos elegir la segunda versión para asegurarnos que se verá bien.  

Versión cuadrada del logo

Versión apaisada del logo

3. Logo para email 

Para aquellos que tengan el plan Store de Grid tienen la opción de cargar un logo que se ve en los emails que se envían cuando se realiza una compra o se confirma un pago. En este caso recomendamos que el logo que se cargue sea un archivo en formato PNG (la mayoría de los software de email como Gmail o Outlook no soportan SVG) en un color que sea legible tanto en fondo claro como en fondo oscuro; ya que no sabemos si el cliente que recibe el email estará usando el tema oscuro.

Si nuestro logo es de un color fuerte (ej. naranja) no hay problema; pero si nuestro logo es blanco o negro, es mejor editarlo y subir una versión en gris medio que sea legible tanto en fondo claro como en fondo oscuro.

4. Favicon

El favicon es una pequeña imagen asociada con una página o sitio web en particular, puede ser parte del logo o una imagen que se relacione con la marca. Se muestra en diferentes partes del navegador: en la barra de favoritos, marcadores, historiales y en la pestaña donde tenemos abierto el sitio, entre otros.

Al momento de cargarlo en la parte de diseño de Grid tiene que ser un archivo PNG. Si no cargamos ningún archivo cuando publiquemos el sitio web se verá el favicon de Grid Web Engine. 

Al momento de cargar los distintos logos e íconos tenemos que tener en cuenta las medidas mínimas necesarias para que el archivo se suba correctamente.