When building web pages, one of my colleagues displays any logo using the CSS background-image property, rather than embedding the image using an HTML <img>
tag. The colleague reported it was to reduce the number of HTTP requests. He also showed me an image sprite and said that Google displays its logo with sprite images.
I don't agree with his approach and showed him that the main Google.com page loads their logo in an <img>
tag.
Which is a better practice?
EDIT: Facebook also do the same thing on their homepage, loading the logo in an img tag while on their profile pages they display their logo using a CSS sprite.
From this my conclusion was that perhaps you should load your main logo in an img tag while for the other logos such as in a footer or subpage you might want to load them in the background using CSS sprites.
UPDATED: I am routinely loading logos with img tags and also know why we might use sprites. My main question is: if you have three or more logos on a page, what is the better way to load them?
I want people to be able to download/link my logo. Therefor I will not include it in the sprite map.
Situation: your company decides to update/change logo, but wait your logo in sprite. So you have recreate sprite again. My suggestion, keep logo in img tag.