Respostas:
Eu diria PNG simplesmente pelo fato de parecer um formato mais aceito que o SVG.
O fato de você ter nomeado SVG como uma opção significa que podemos descartar os gráficos fotográficos como um caso de uso pretendido - porque os SVGs são bons apenas para gráficos de arte de linha, como logotipos, ícones e ilustrações semelhantes a clip-art.
Se você está considerando esta opção para gráficos fotográficos, não há opção; PNG provavelmente sempre será melhor. Para gráficos em que SVG é uma opção viável, SVG é a melhor opção com um fallback PNG / JPEG. O PNG tem muitos pontos fortes, mas na escalabilidade e no tamanho do arquivo, geralmente não corresponde ao SVG.
Pesando um contra o outro, o PNG certamente será suportado por mais navegadores que o SVG no momento atual, mas as resoluções de dispositivos recém-lançados aumentam para sempre, o que significa que os PNGs precisarão ser veiculados com base em uma ampla variedade de resoluções diferentes (por meio de consultas de mídia, JavaScript ou sniffing do agente do usuário) ou redimensionadas pelos navegadores, o que pode produzir resultados imperfeitos.
Olhando para o que sabemos que o futuro reserva; resoluções sempre mais altas, suporte mais amplo e uso mais amplo de SVGs na Internet; faz sentido construir para o que está por vir.
Em geral, os sites devem ser criados para durar muitos anos; daqui a cinco anos, seu site belamente compatível com versões anteriores pode parecer incrível para os 2% de usuários de Internet que ainda usam navegadores antigos, mas bastante ruim nos navegadores atualizados com resoluções malucas - portanto, é uma pilha de escolhas difíceis sobre como compromisso.
Apenas PNGs
Por uma questão de qualidade, você precisará veicular pelo menos cinco versões diferentes, dependendo do tamanho da tela e das resoluções - e esse é um estimativa muito conservador, você pode acabar com 10 a 15 versões da mesma imagem se quiser ser extremamente completo . Isso também leva algum tempo para implementar.
Se você optar por veicular um único gráfico e fazer com que o navegador dimensione, os resultados provavelmente serão menos do que perfeitos e podem ser feios, dependendo da quantidade de dimensionamento.
Um grande número de consultas de mídia pode inchar desnecessariamente o CSS e afetar negativamente a velocidade de carregamento da página.
Ficará ótimo em navegadores e dispositivos mais antigos, mas não tão bom nos mais novos.
SVGs com fallback PNG / JPEG / GIF único
Você pode usar SVGs em qualquer lugar e, em seguida, fazer o fallback para outro formato para navegadores que não suportam SVG. A principal vantagem é que você só precisa de um arquivo para todas as diferentes resoluções.
Se você comprometer e aceitar que os usuários em navegadores desatualizados possam viver com gráficos imperfeitamente dimensionados, você precisará apenas de uma outra versão de cada arquivo no formato PNG, JPEG ou GIF.
Isso levaria um tempo semelhante para ser implementado, pois as consultas de mídia somente PNG - possivelmente ainda menos, o que significa que provavelmente custaria o mesmo preço.
Ficará ótimo em todos os novos dispositivos, com sacrifícios sendo feitos em tecnologias mais antigas.
SVG com vários fallbacks PNG / JPEG / GIF, dependendo da resolução e tamanho da tela
Primeiro, você pode veicular SVG e, em seguida, PNGs dependentes de resolução para navegadores que não suportam SVG. Essa seria a opção mais demorada , compatível com versões anteriores e anteriores, mais consistente e mais cara .
Provavelmente levaria tanto tempo quanto 1 e 2 combinados, além de um pouco mais para resolver os problemas.
Ficará incrível em quase todos os dispositivos.
<picture>elemento ajudando com vários tamanhos de imagem
O SVG é escalável, se você tiver um gráfico vetorial que é uma clara vantagem. Para gráficos de pixel PNG é melhor. Uma desvantagem é que o Internet Explorer suporta SVG apenas na próxima versão 9 (antes com o plugin). Os navegadores móveis também podem ter suporte limitado ao SVG.
EDIT : Como ClemDesm aponta, versões mais antigas do IE não suportam PNG totalmente transparente, já que o IE8 é suportado. PNGs não transparentes funcionam bem. A resposta do Computerish tem uma ótima solução para lidar com imagens vetoriais por enquanto: mantenha-as como SVG, mas exporte-as para a Web como PNG. Concordo plenamente com esta solução.
Definitivamente, use PNG para um site. O SVG simplesmente não é suficientemente suportado e possui poucos (se houver) benefícios significativos sobre o PNG para uma exportação nivelada. Dito isto, mantenha todas as suas cópias de trabalho em SVG.
Eu ficaria com PNG para estar no lado seguro. O SVG ainda não é totalmente aceito por muitas grandes empresas e navegadores da Internet. Embora os SVGs sejam escaláveis e sejam vetores, muitas vezes são desnecessários, ocupam mais espaço e complicam demais o site.
Espero que tenha respondido sua pergunta :)
Embora o SVG não seja aceito globalmente e algumas pessoas tenham um tempo frustrante na escalação de PNGs, sempre achei que a criação de um ícone no Adobe Illustrator funciona melhor na escalada para cima ou para baixo em uma quantidade "razoável".