Los archivos SVG (Scalable Vector Graphics) son archivos gráficos vectoriales escalables, son muy ligeros y mantienen la calidad visual sin importar el tamaño al que se redimensionen.
Es decir que el mismo archivo SVG que pesa 2KB lo podrás usar en el Hero con un tamaño de 600×600 pixeles y como logo en tu header en 32×32: Sin perder calidad ¡una maravilla!
Además estos SVG pueden incluir animaciones directamente en su código y podrás usarlos como iconos animados y otros elementos visuales dinámicos en tu web. Esto por supuesto mejorará la experiencia de tus usuario y te permitirá crear contenido más atractivo y dinámico en tus sitios web.
En un mismo archivo SVG tenés:
- Escalabilidad sin perdida de calidad.
- Interactividad y movimiento para mostrar contenido dinámico.
- Tamaño reducido, lo que te beneficia de cara a la optimización de tu web.
Pero hay un pequeño problema
No podrás usarlos y subirlos directamente a tu WordPress.
Lamentablemente lo grandioso de los archivos SVG, abre la puerta a que ciber criminales se aprovechen de ellos y agreguen código malicioso dentro de ellos. Vos no lo vas a notar, funcionará normal pero al estar dentro de tu web podrá hacer mucho daño si ese archivo ha sido manipulado y le han inyectado código malicioso.
Para evitar riesgos de seguridad, WordPress restringe la carga directa de archivos SVG, y si los querés usar tenés que añadir manualmente la opción para hacerlo.
Podés usar un plugin, pero sería demasiado para algo tan sencillo. Lo mejor es usar un pequeño trozo de código, añadirlo a tu plugin de funcionalidades o al functions.php de tu Child Theme.
¿Cual es el código que debo usar? ¿Dónde puedo verificar si el archivo SVG esta limpio? Esto y más se muestra a continuación:
🔐
Aquí va la Clase+ pero este contenido es exclusivo para Suscriptores. Podés suscribirte y si ya estas suscrito podés ingresar a tu cuenta de usuario.
Sin lugar a dudas los archivos SVG son 100% recomendables por su versatilidad y capacidad de proporcionar gráficos escalables sin pérdida de calidad.
Que sean tan ligeros es beneficioso para nuestra web: entre menos peso, la web carga más rápido y se necesita menos recurso de nuestro servidor.
Pero, pero, pero… si o si debemos utilizar archivos SVG de fuentes confiables para minimizar riesgos de seguridad. Utilizar archivos de fuentes confiables garantiza la integridad del sitio web y previene posibles vulnerabilidades asociadas con la ejecución de código malicioso.
Nosotros usamos SVG a partir de archivos vectoriales creados por nosotros mismos. Pero si tenés que usar uno bajado de internet, ya sabés que tenés que hacer.