SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    Forensic SEO Consultant Webnauts's Avatar
    Join Date
    Jun 2003
    Location
    European Union
    Posts
    1,488
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Arrow Empty spans - semantics and accessibility question

    I want to use empty spans for positioning Eye-candy images on my site.
    Would this violate semantics and accessibility, if it is the best solution for our visitors and for ourselves?

  2. #2
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The W3C advises against empty elements but the use of them for image replacement is probably the most accessible method available so I don't think it should be too much of a problem. If the tag has no content, then it's not going to be read by screen readers. I'd recommend using empty divs though instead of spans as spans should be used inside other content.

  3. #3
    Forensic SEO Consultant Webnauts's Avatar
    Join Date
    Jun 2003
    Location
    European Union
    Posts
    1,488
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs up Thanks man

    Quote Originally Posted by Tyssen
    I'd recommend using empty divs though instead of spans as spans should be used inside other content.
    And what about divitis? And what about adding an ampersand within the span tags?

  4. #4
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Divitis only refers to using divs when another more suitable tag would be better (e.g. taking a tabled layout and converting all cells to divs). As mentioned before about screen readers, if you put content in your span or div, it'll be read out and will seem out of context so probably best left empty.

  5. #5
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just saw your other thread - I only recommended using divs because I thought they were going to be sitting outside other content. Of course, as Paul pointed out in the other thread, if the images are to be displayed within paragraphs, then you'd use spans.

  6. #6
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Spans are semantically neutral and do not affect accessibility. The main adverse effect is code bloat.
    Birnam wood is come to Dunsinane

  7. #7
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Tyssen
    Divitis only refers to using divs when another more suitable tag would be better (e.g. taking a tabled layout and converting all cells to divs).
    I and maybe others as well use it to mean when someone has more <div>s than they need, not just when there is a more semantically appropriate element they could be using.
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  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)
    I agree with Kravvitz about the definition of 'divitis'. Using DIVs instead of the appropriate semantic element types is a special case of 'tag soup'.
    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
  •