Hiding RDFa with CSS is an anti-pattern

jindrichmynarz says:

In the examples in rNews implementation guide RDFa data is hidden with CSS (style="display: none;"). I think this is an anti-pattern because there is a better mechanism for hiding information visually in RDFa: attributes. So, instead of using CSS to prevent RDFa data from being displayed (and potentially confusing users with screenreaders) it's better to use the content attribute. I.e. using:

<span property="rnews:description" content="The questions about the..."/>
<span property="rnews:language" content="en"/>
<span rel="rnews:thumbnailUri" resource="http://http://graphics8.nytimes.com/images/common/icons/t_wb_75.gif"/>
<div  style="display:none">
  <div property="rnews:description">The questions about the...</div>
    <div property="rnews:language">en</div>
    <div rel="rnews:thumbnailUri"
         href="http://http://graphics8.nytimes.com/images/common/icons/t_wb_75.gif"</div>           
</div>

<span property="rnews:description" content="The questions about the..."/><span property="rnews:language" content="en"/><span rel="rnews:thumbnailUri" resource="http://http://graphics8.nytimes.com/images/common/icons/t_wb_75.gif"/>

Instead of:

<div  style="display:none"><div property="rnews:description">The questions about the...</div><div property="rnews:language">en</div><div rel="rnews:thumbnailUri"   href="http://http://graphics8.nytimes.com/images/common/icons/t_wb_75.gif"</div></div>

We have also discussed this topic on answers.semanticweb.com. Do you think it's correct to amend the documentation to reflect this?

Posted at 4:48 PM on June 21, 2011


esandhaus admin says:

Good point, we'll take this under advisement and discuss it on our next call.

~Evan Sandhaus

Posted at 6:47 PM on June 23, 2011

You must log in to reply