2 Replies - 1223 Views - Last Post: 09 November 2009 - 07:55 AM

#1 Torroes_prime  Icon User is offline

  • D.I.C Head

Reputation: 0
  • View blog
  • Posts: 111
  • Joined: 07-June 09

inline image versus CSS image

Posted 04 November 2009 - 09:05 PM

So I was in my Web Design class tonight, and the teacher posed the question, "in regards to separating Content from presentation, when would you want to use an inline image versus setting it using the background-image property in an external style sheet?"

So obviously, it would be a better option to use CSS for stuff like nav-bars, Logos, and anything else that is used repeatedly through out the site. Even with in article images, you would get more control over formatting with image and it's border and everything else.

so... yeah. When would you want to use an image inline versus a CSS element?

Is This A Good Question/Topic? 0
  • +

Replies To: inline image versus CSS image

#2 jwwicks  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 24
  • View blog
  • Posts: 162
  • Joined: 31-July 08

Re: inline image versus CSS image

Posted 04 November 2009 - 10:05 PM

Hello,

View PostTorroes_prime, on 4 Nov, 2009 - 08:05 PM, said:

So I was in my Web Design class tonight, and the teacher posed the question, "in regards to separating Content from presentation, when would you want to use an inline image versus setting it using the background-image property in an external style sheet?"

So obviously, it would be a better option to use CSS for stuff like nav-bars, Logos, and anything else that is used repeatedly through out the site. Even with in article images, you would get more control over formatting with image and it's border and everything else.

so... yeah. When would you want to use an image inline versus a CSS element?


When the image is the content you should use the image tag. If I have a gallery of images a user is free to turn off styling/css or print a page and the images will still show. When it is simply a styling element, background, rounded corners etc... use CSS

Jw
Was This Post Helpful? 0
  • +
  • -

#3 SubTypical  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 6
  • Joined: 03-November 09

Re: inline image versus CSS image

Posted 09 November 2009 - 07:55 AM

View Postjwwicks, on 4 Nov, 2009 - 09:05 PM, said:

Hello,

When the image is the content you should use the image tag. If I have a gallery of images a user is free to turn off styling/css or print a page and the images will still show. When it is simply a styling element, background, rounded corners etc... use CSS

Jw


Agreed. When you disable the CSS, an image defined as a css background element is disabled as well. If it is content, it should be in-line (and always make sure to enter the 'alt' description under the image tag for accessibility purposes).

The only time you'd want to have content-related images as a background image is if you're using one of the various techniques to replace text (headers, etc.) with a decorative alternative. It would keep the users from being able to scale your site and adjust fonts, etc. for the headers that may break your design. The problem is none of the methods work flawlessly, they all have some impact on accessibility/seo/etc. So it should be used sparingly or not at all IMO.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1