I'm making a responsive site and my logo loses quality when I'm opening the site on mobile (iPhone, Android) http://kadmos.li/web/ji/stck.html My logo size is 266x68px and I'm not resizing it on any responsive size. When I'm opening this link on desktop browser, the logo doesn't change in quality, but when I'm opening it on ios or android, the logo doesn't look good.
As a solution I've made my logo 2x larger, the image width now is 532px instead of 266px But as I need my logo to have fixed 266px width I've set this with css. And it seems everything is ok and it looks good on all browsers and devices. http://kadmos.li/web/ji/solution.html
But in any case it's not good to have the image 2x larger than you need. And for that I'd like to ask if anyone has faced such issue and has a better solution for this.
Thanks in advance