Como colocar uma imagem sem alterar a qualidade dela?

Como colocar uma imagem no html/css sem que a qualidade dela não decaia? Eu fiz os procedimentos abaixo, achando que a coisa pudesse melhorar, porém a imagem horizontalmente fica esticada, toda a resolução se perde. O que eu quero é justamente fazer com que o width fique completo e o height no 300px, porém com uma qualidade boa.

A resolução original da imagem é de 1920x1279.

 .img {

     width: 100%;

     height: 300px;

     background-size: cover;

     background-position: center right;

 }