En esta página:
Existen muchos formatos de archivos que puedes usar en tus proyectos, muchos son de audio, video, imagen entre otros, es importante que sepas cual es el tipo de formato más optimo, en cuanto a imágenes puedes usar formatos de imagen JPG, PNG, JEPG, GIF y SVG, este último creemos que es uno de los mejores formatos para imágenes que existe en la actualidad, en este artículo vamos a enseñarte a como crear un archivo de imágen SVG con Adobe Photoshop, vamos con el artículo.
Actualización (Nueva Forma de Hacerlo):
Que es el Formato de imagen SVG ?
Las letras SVG son las iniciales de Scalable Vector Graphics que en traducido al español significa Gráficos Vectoriales Escalables, este tipo de formato tiene la capacidad de ser Vectorial, Redimensionable y Bidimensional, es decir se adapta al ancho de una pantalla o dispositivo sin perder su calidad y aspecto.
El desarrollo del Formato SVG se inicio por la W3C en el año 1999, organización que luego paso a recomendarla en Septiembre de 2011 como un formato que puede ser usado en proyectos reales.
Los Navegadores que soportan este formato son Google Chrome, Safari, Internet Explorer 9, Microsoft Edge, Mozilla Firefox, Opera, etc.
Crear un SVG con Photoshop CC (Mira el video de arriba)
El proceso es muy sencillo, creemos que si sigues los pasos puntuales, no es necesario que tengas conocimientos avanzando de Photoshop.
Ve al Menú Archivo luego a Exportar > Exportar Como
Te aparecerá una Ventana con un conjunto de opciones que puedes modificar según lo que desees hacer, en la parte derecha escoge de la lista el Formato SVG y luego dale clic en en botón Exportar todo y guarda tu archivo
Eso es todo, puedes insertar tu archivo SVG como cualquier imagen
|
1 2 3 |
<img src="tuimagen.svg" /> |
Si es un caso extremo de compatibilidad puedes usar lo siguiente para usar un archivo PNG en ves del archivo SVG y asi siempre tendrás una imagen cargando en tu proyecto
|
1 2 3 |
<img src="tuimagen.png" alt=Tu imagen" srcset="tuimagen.svg"> |
Notas
- Te aconsejamos tener actualizado a la última versión de Adobe Photoshop CC para que tengas soporte de las nuevas funcionalidades incluso para crear archivos SVG.
- Los pasos mencionados en este tutorial pueden cambiar en futuras versiones de Photoshop, eso no depende de nosotros si no de la empresa que da soporte al Programa.
Síguenos en las Redes Sociales para que no te pierdas nuestros próximos contenidos.