Una forma de mejorar el rendimiento de tu sitio web es que tus imágenes tengan el menor peso posible, en el blogEs un sitio web donde se publica nuevo contenido en forma cronológica, como en el que te encuentras. Si bien la gran mayoría son personales existen blog profesionales e institucionales. ya te he comentado algunas herramientas y formas que te permitirán hacer este trabajo.
Otra de las formas es reemplazar tus imágenes por otras vectoriales, que por lo general son más livianas y tienen la gran ventaja de que al ser escaladas no pierden calidad, se ven de la misma forma.
El formato por excelencia para llevar las imágenes vectoriales a la web es el SVG o Scalable Vector Graphics que según la Wikipedia
Es un formato de gráficos vectoriales bidimensionales, tanto estáticos como animados, en formato XML, cuya especificación es un estándar abierto desarrollado por el W3C desde el año 1999
Lamentablemente, o no, no es llegar y subir a tu WordPress una imagen en este formato, la razón principal para que sea así es relacionada con la seguridad debido a que personas malintencionadas podría incorporar código maliciosos dentro del código de la imagen para ser ejecutado cuando alguien acceda a ella.
En este artículoEs el tipo de contenido que vas agregando en forma periódica a tu blog, el cual se ordena de acuerdo a su fecha de publicación. te voy a comentar cómo hacer que tu blogEs un sitio web donde se publica nuevo contenido en forma cronológica, como en el que te encuentras. Si bien la gran mayoría son personales existen blog profesionales e institucionales. acepte este tipo de imágenes y las precauciones que has de tener para no tener problemas de seguridad con ellas.
Donde consigo imágenes SVG
Anteriormente te he mencionado algunos bancos de imágenes gratuitos, en el listado hay uno en donde puedes encontrar imágenes en formato SVG y ese es Pixabay, de ahí yo he sacado más de una vez alguna imagen.
En Pixabay hay una sección con imágenes vectoriales, lamentablemente no todas están en formato SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad., algunas las puedes encontrar en AI, el formato de Adobe Illustrator, solo tendrás que abrirlas en dicha aplicación y exportarla a SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad..
Por último si no te quieres liar mucho tienes la opción de utilizar la imagen en formato PNG, aunque el peso de la misma aumentará, lo puedes ver con la siguiente imagen que he descargado de Pixabay.
La imagen en formato SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad. tiene un peso de 43 kB,mientras en PNG a una resolución de 640px x 490px tiene un peso de 160 kB, a resoluciones superiores el peso va en aumento.
Cómo crear una imagen SVG
Para crear imágenes vectoriales en formato SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad. tendrás que utilizar algún programa especialmente preparado para ello, algunos de ellos pueden ser Adobe Ilustrator, Corel Draw o Inkscape, este último totalmente libre y es el que yo utilizo a día de hoy.
No pretendo que este artículoEs el tipo de contenido que vas agregando en forma periódica a tu blog, el cual se ordena de acuerdo a su fecha de publicación. sea una guía de como utilizar uno u otro programa gráfico, quizás más adelante sea la oportunidad, pero me gustaría dejarte con un video sobre como exportar a SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad. desde Adobe Illustrator, si utilizas Inkscape no tienes problemas porque SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad. es su formato nativo
Existen algunos otras aplicaciones que te harán más sencilla la creación de imágenes vectoriales, especialmente porque son aplicaciones en línea, por lo que no tendrás que instalar ningún programa en tu computador.
Cómo incorporar SVG a WordPress
Existen varias formas de hacer que tu WordPress acepte las imágenes en formato SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad., ya sea incorporando un pequeño código a tu archivo de funciones (o pluginLos plugins son pequeñas (o grandes) extensiones que permiten ampliar las funcionalidades de tu CMS, por ejemplo Woocommerce es un plugin (grande) que le otorga funcionalidades de carro de compra a tu WordPress. personal) o a través de alguno de los plugins que encontrarás en el repositorio de WordPress.
Método 1: functions.php
La opción “barata” y no tan segura es incorporar el siguiente código en tu archivo de funciones functions.php
function enable_svg_upload( $upload_mimes ) {
$upload_mimes['svg'] = 'image/svg+xml';
$upload_mimes['svgz'] = 'image/svg+xml';
return $upload_mimes;
}
add_filter( 'upload_mimes', 'enable_svg_upload', 10, 1 );
Si utilizas este método te sugiero que solo subas tus propias imágenes, así sabrás que no tienen código malicioso en ellas
Método 2: utilizando un plugin seguro.
En el repositorio oficial de WordPress, ese que puedes acceder desde tu propio WordPress, existe un centenar de plugins que habilitan la utilización de imágenes vectoriales en formato SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad., algunos más seguros que otros.
La instalación de ellos en tu Blog es muy sencilla, solo tienes que dirigirte a Plugins -> Añadir nuevo desde el Escritorio y ahi en la casilla de busqueda escribir el nombre del Plugin, para mas detalles puedes ver el artículo que he escrito sobre Cómo instalar Plugins.
SVG Support
El primero de ellos es SVG Support de Benbodhi, no es estrictamente el más seguro, deja en tus manos la responsabilidad de chequear la seguridad de tus imágenes svgEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad., limitando a su vez cual de los tipos de usuario tiene la posibilidad de subir archivos SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad., así lo puedes limitar solo a los Administradores (tú).
Safe SVG
El segundo plugin es Safe SVG de Daryll Doyle y como su nombre lo sugiere es más seguro que el anterior al realizar la santificación o limpieza de los archivos SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad. que subas a tu WordPress, eliminando las vulnerabilidades que puedan tener.
Safe SVG, junto a la versión gratuita, tiene una versión Premium que te dará la posibilidad de con el mismo plugins optimizar tus archivos SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad., limitar quienes tienen la posibilidad de subirlos, además de incorporar SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad. inline
Palabras al cierre.
Como espero que te haya quedado claro, la utilización de imágenes SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad. te ayudarán a que tu BlogEs un sitio web donde se publica nuevo contenido en forma cronológica, como en el que te encuentras. Si bien la gran mayoría son personales existen blog profesionales e institucionales. sea un poco más ligero, lo que a ayudará a la experiencia de tus usuarios en él y de paso también le agradará a Google.
Lo que tienes que tener siempre en cuenta es que tan seguros son los archivos SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad. que tienes en tu web, por lo que si utilizas archivos creados por terceros siempre realiza el proceso de Santificación, Safe SVGEl formato SVG o Scalable Vector Graphics es un formato de imagen vectorial, que a diferencia de JPG, GIF y PNG, no depende de la resolución de la imagen siendo posible su escalado sin ninguna pérdida o problema en su calidad. te vendrá muy bien.
Como siempre estoy atento a tus dudas a través de los Comentarios, del Formulario del blog y en mi Twitter. No dudes en compartir este artículoEs el tipo de contenido que vas agregando en forma periódica a tu blog, el cual se ordena de acuerdo a su fecha de publicación. en tus redes sociales, te lo agradeceria un montón.
