O vídeo foi removido neste. Vou filmar novamente algum dia em breve. Se você está lendo isso e eu ainda não li, fique à vontade para me contatar e me incomodar com isso.
Às vezes, o SVG que você deseja usar parece perfeitamente bom no Illustrator, mas não é bem como você gostaria de usá-lo na web.
Uma das coisas que vemos neste vídeo é uma forma simples que parece ser uma única forma, mas na verdade são quatro formas colocadas uma em cima da outra. Para simplificar, basta selecionar todas as formas e usar as ferramentas Pathfinder no Illustrator para combiná-las em uma única forma. Podemos ver isso refletido imediatamente no código. Às vezes é divertido ter o arquivo SVG aberto no Illustrator e em um editor de código, de modo que, ao salvá-lo, você poderá ver o que ele está fazendo com o código.
O Pathfinder é ótimo para otimização manual de formas - vale a pena conhecer o que esses botões fazem - e o que eles fazem com a tecla de opção pressionada também.
O tamanho de um arquivo SVG é, em grande parte, determinado por quantos pontos existem nas formas. Existem outros fatores, mas esse é o problema. Outra coisa que examinamos neste vídeo é o uso do recurso Illustrators Simplify Path para reduzir o número de pontos em algumas formas texturizadas para diminuir o tamanho do arquivo.
Outra coisa a saber: caminhos compostos podem ser úteis. Duas formas totalmente separadas uma da outra ainda podem ser um caminho. Tipo, literalmente um. A sintaxe permite essencialmente “pegar a caneta, movê-la para outro lugar, desenhar algo novo”. Portanto, quando você cria um caminho composto no Illustrator (por exemplo, várias formas independentes, Object> Compound Path> Make), é assim que ele sai. Pode levar a uma saída SVG simplificada / otimizada.