Confira primeiro a largura real de exibição
Uma foto de 5000 px em uma coluna de 900 px não mostra cinco vezes mais informação; o navegador apenas baixa mais dados e reduz a imagem.
Telas de alta densidade pedem alguma margem
Pode ser útil preparar imagens maiores que a largura CSS, mas isso não exige manter sempre o tamanho máximo do original.
Fotos e capturas de interface pedem critérios diferentes
Fotos toleram perdas melhor; código, tabelas e texto pequeno podem perder legibilidade com artefatos.
Use um fluxo repetível
Confira a exibição, redimensione, escolha o formato, comprima e teste na página real.