Background or img?

Hi

I'm confused as to when I should use a image as a background and when I should declare it as an img in html.

On my home page I have the navigation bar and then one large image of the artist's work. Currently I have this image as the background, but I am aware that if the image fails (eg as it does when I call up the page on my mobile) then there is no alt text and just a big blank space.

Thanks,

Ruby

Depends what your needs are. I use background: for layout elements and <img> for images most of the time.

__________________

Backgrounds are good if your going to writing over it in html. An image is good if its going to be a stand alone. ex.. logos, products, yadda yadda.
<quote>Depends what your needs are. I use background: for layot elements and <img> for images most of the time.</quote>

Basic rule of thumb is to use background images, where you can, for images that are decorative.

Use the img tag for images that are part of what an end-user visits your site for. As you have pointed out, it is essential to have an alt text at the very least.

If images are a main feature of the site as on an art related site, then you need much more than these to allow for people using assistive technologies.

Thank you for your answers.

I think it's much clearer in my head now.

Ruby

Yeah, I agree with what ukgeoff said. If it's part of a site's design, use a background image (although I've seen just logos as images which doesn't bother me as long as there's an h1). If you've got an article about cars, you certainly don't want to do one of these:

Code: Select all

<div style="width: 200px; height: 120px; background: #fff url('06gto.jpg') 0 0 no-repeat;">

Thats what I said damnit.. heh I am always getting shafted by you lot!

__________________

Haha, we were just expounding on your correctness.