Inserir imagens de qualidade e com baixo peso de arquivo na internet é um desafio antigo e perturbador em projetos baseados no design. E, há um recurso que nem todos os profissionais que trabalham com desenvolvimento sabem, ou se ouviram dizer, não sabem gerar.
O SVG, acrônimo para Scalable Vector Graphics, de uma maneira resumida, significa que é possível inserir vetores na internet com coordenadas matemáticas, formando assim, os pontos e curvas.
O SVG é fruto de um desenvolvimento coletivo e foi lançado em setembro de 2001, atualmente existem diversas ferramentas gratuitas na internet que geram códigos do arquivo para serem inseridos no HTML.
Uma ferramenta impecável na geração do SVG é o Abobe Illustrator 2020, em apenas alguns cliques o seu arquivo vetor é exportado para a extensão, e o melhor, é possível copiar o código no próprio programa. Simples, rápido e eficaz.
Veja o passo a passo abaixo:
Passo 1
Selecione um vetor para exportar em SVG.
Passo 2
Clique em arquivo > exportar > exportar como.
Passo 3
Selecione a extensão SVG e salve dentro do diretório do seu projeto HTML.
Passo 4
Clique em ver código na caixa de opções, selecione e copie.
Passo 5
Cole o código no arquivo HTML e divirta-se com vetores nas páginas de internet.
Que tal usar esse recurso no próximo projeto HTML?
Além de muito leve como arquivo, pois o SVG é formado por linhas de códigos, ele é responsivo, adaptando-se em todos os dispositivos, mantendo e usando o máximo de nitidez em todas as telas.