A medida que construye un sitio web y agrega imágenes a ese sitio, una de las cuestiones más importantes que debe determinar es qué formatos de archivo son los correctos que debe usar. Dependiendo del gráfico, un formato puede ser mucho mejor que otros.
Muchos diseñadores web se sienten cómodos con el formato de archivo JPG, y este formato es perfecto para imágenes que tienen una profundidad de color profunda, como las fotografías. Si bien este formato también funcionaría para gráficos simples, como los iconos ilustrados, no es el mejor formato para usar en esa instancia. Para esos iconos, SVG sería una mejor opción. Echemos un vistazo a exactamente por qué:
SVG es tecnología de vectores
Esto significa que no es tecnología rasterizada. Las imágenes vectoriales son una combinación de líneas creadas usando matemáticas. Los archivos de trama utilizan píxeles o pequeños cuadrados de color. Esta es una de las razones por las que SVG es escalable y perfecto para sitios web receptivos que deben escalar junto con el tamaño de la pantalla de un dispositivo. Como los gráficos vectoriales existen en el mundo de las matemáticas, para cambiar el tamaño, simplemente cambias los números. Los archivos de trama a menudo requieren una revisión significativa cuando se trata de tamaño. Cuando desea ampliar una imagen vectorial, no hay distorsión porque el sistema es matemático y el navegador simplemente vuelve a calcular esa matemática y hace que las líneas sean tan suaves como siempre. Cuando acercas una imagen ráster, pierdes la calidad de la imagen y el archivo comienza a aparecer borroso al comenzar a ver esos píxeles de color. Las matemáticas se expanden y se contraen, los píxeles no. Si quieres que tus imágenes sean independientes de la resolución, SVG te dará esa habilidad.
SVG está basado en texto
Cuando utiliza un editor de gráficos para producir una imagen, el programa toma una imagen de su obra de arte completa. SVG funciona de manera diferente. Aún puedes usar algunos programas de software y sentir que estás dibujando una imagen, pero el producto final es una colección de líneas vectoriales o incluso palabras (que en realidad son solo vectores en la página). Los motores de búsqueda miran las palabras, específicamente las palabras clave. Si carga un archivo JPG, se está limitando al título de su gráfico y quizás a la frase de texto alternativo. Con la codificación SVG, usted amplía las posibilidades y crea imágenes que son más amigables para los motores de búsqueda.
SVG es XML y funciona en otros formatos de idioma
Esto se remonta al código basado en texto. Puedes hacer tu imagen base en SVG y usar CSS para pulirla. Sí, puede tener una imagen que en realidad es un archivo SVG, pero también puede codificar el SVG directamente en la página y editarlo en el futuro. Puede modificarlo con CSS de la misma manera que alteraría el texto de la página, etc. Esto es muy poderoso y facilita la edición.
SVG se edita fácilmente
Esta es probablemente la mayor ventaja. Cuando tomas una imagen de un cuadrado, es lo que es. Para hacer un cambio, tienes que restablecer la escena y tomar una nueva foto. Antes de que te des cuenta, tienes 40 imágenes de cuadrados y todavía no lo tienes del todo bien. Con SVG, si comete un error, cambie las coordenadas o una palabra en un editor de texto, y listo. Puedo relacionarme con esto porque dibujé un círculo SVG que no estaba colocado correctamente. Todo lo que tenía que hacer era ajustar las coordenadas.
Las imágenes JPG pueden ser pesadas
Si desea que su imagen crezca en tamaño físico, también aumentará en tamaño de archivo. Con SVG, una libra sigue siendo una libra, no importa lo grande que la hagas. Un cuadrado de 2 pulgadas de ancho pesará lo mismo que un cuadrado de 100 pulgadas de ancho. El tamaño del archivo no cambia, lo que es excelente desde el punto de vista del rendimiento de la página.
Entonces, ¿cuál es mejor?
Entonces, ¿qué es un formato mejor - SVG o JPG? Eso depende de la propia imagen. Esto es como preguntar "¿qué es mejor, un martillo o un destornillador?" ¡Depende de lo que necesites lograr! Lo mismo es cierto para estos formatos de imagen. Si necesita mostrar una foto, entonces JPG es la mejor opción para usted. Si está agregando un icono, es probable que SVG sea una mejor opción. Puede obtener más información sobre cuándo es apropiado usar archivos SVG aquí.
Artículo original de Jennifer Krynin. Editado por Jeremy Girard el 6/6/17
