SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Evangelist
    Join Date
    Aug 2005
    Posts
    574
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    XHTML 1.0 Strict and images

    I have a 1-pixel line gif that I'm using as a divider before the footer in a site I'm working on. The color of the line changex, depending on what section of the site you're in. I had planned on using PHP to specify the color, depending on what page you're on. The problem I've run into is that it doesn't really make sense to give the gif an alt attribute since it's only decorative and yet it won't validate without it. I know it's better to keep decorative elements in style sheets but this one seems tricky since it changes. I guess I could create several different styles for the different colors and use my gif as a background image. How would the rest of you handle this?

  2. #2
    . shoooo... silver trophy logic_earth's Avatar
    Join Date
    Oct 2005
    Location
    CA
    Posts
    9,013
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    give it an empty alt

    alt=""
    Logic without the fatal effects.
    All code snippets are licensed under WTFPL.


  3. #3
    SitePoint Addict
    Join Date
    Feb 2005
    Location
    Brisbane, Australia
    Posts
    306
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It makes perfect sense to require an alt tag for these images.

    We don't have alt tags for those people who can see a graphical screen (although it does have its uses). We have alt tags for those visitors who are blind and are unable to see our pages (their screen-reader will go through the page and read the alt tags, or at least that is my understanding); we also have alt tags for text-based browsers, where the visitor won't know it's a spacer image unless they are told.

    Personally, I'm not big on spacer images. But if you're going to use them, do what you would do with any other image: tell the user what the image is - a spacer image.

  4. #4
    SitePoint Wizard bronze trophy C. Ankerstjerne's Avatar
    Join Date
    Jan 2004
    Location
    The Kingdom of Denmark
    Posts
    2,702
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)
    logic earth's solution is the best. Having 'Spacer' or something similarread to them will not make any sense. ALT conveys the text equivilant of the contents of an image, however a spacer doesn't have any contents, and thus and empty ALT is semantically correct.
    Christian Ankerstjerne
    <p<strong<abbr/HTML/ 4 teh win</>
    <>In Soviet Russia, website codes you!

  5. #5
    SitePoint Wizard drhowarddrfine's Avatar
    Join Date
    Aug 2005
    Posts
    3,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    How would I handle it? Use a sized div with a background color.

  6. #6
    Brevity is greatly overrated brandaggio's Avatar
    Join Date
    Dec 2005
    Posts
    1,424
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you are going to bother to use strict XHTML, you should certainly not be using spacer gif's - not a one. It is not content in anyway - it is presentation. The use of inline images should be reserved for content.

    You should use CSS with unique id's (and a class if it makes sense in your context so the class has the rules for all the border info (but color) and the id's have just the color info) so you can uniquely color each of them. Whatever the nearest container/block level element is - just style one border instead of all of them and voila - you have a nice line. Then use padding/margin to control where it is.

  7. #7
    SitePoint Evangelist
    Join Date
    Aug 2005
    Posts
    574
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Excellent ideas and discussion. Thanks.

  8. #8
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by tryin_to_learn View Post
    How would the rest of you handle this?
    I would use a border on an existing element (either a bottom border on the element above the divider or a top border on the element below). Using an id attribute for, e.g., the body element I could control the border colour through CSS for different sections.

    No need to introduce an unnecessary element for presentational purposes.

    If the divider has semantic meaning (i.e., it should be there even in non-CSS browsers) I'd use an HR element (styled with CSS).
    Birnam wood is come to Dunsinane


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •