What you’ve created is called a “sprite” image, and it’s the best way to go. You could have a separate image appearing on hover, but it doesn’t work as well, because there’s a delay as it downloads. That’s the beauty of sprites, and the extra bandwidth is usually negligible. So I’d recommend you stay with what you have. 