Existem duas práticas usadas com freqüência para adicionar imagens a uma página da web, a tag IMG ou usando o fundo CSS. Para substituir com êxito as imagens usadas para imagens de exibição de retina em dispositivos iOS, existem dois métodos.
Substituindo Tags IMG
RetinaJS tem tudo que você precisa para substituir completamente todas as ocorrências de uma etiqueta IMG e é extremamente fácil de usar. Basta soltar o arquivo retina.js em seu projeto e, em seguida, vincular a ele em sua página, ele fará o resto.
Substituição de imagens de fundo (usando SASS)
A fim de contabilizar todas as imagens de fundo usadas em seu site, será necessário reescrever. Seu documento SASS exigirá um novo mixin criado para lidar com a declaração e decidir qual imagem distribuir. Em seguida, você substituirá todas as linhas em que está declarando background: url () por uma chamada ao mixin : @include background-image-retina (logo, png, 200px, 100px);
Este site irá listar todas as etapas necessárias para substituir completamente todos os usos de imagens CSS.