-1

I have a WordPress site with several blog posts that have tabular data. This tabular data is important so I've been looking at building a plugin that would build a sitemap for guests to reference but I'm unsure if there is a proper solution to identifying the name or title of the table.

In research I've read and understand that the title attribute is a global attribute, which means that you can use it on all elements:

<table id="foo" class="bar" title="Hello World">

</table>

and:

The title attribute represents advisory information for the element, such as would be appropriate for a tooltip. On a link, this could be the title or a description of the target resource; on an image, it could be the image credit or a description of the image; on a paragraph, it could be a footnote or commentary on the text; on a citation, it could be further information about the source; on interactive content, it could be a label for, or instructions for, use of the element; and so forth. The value is text.

but I'm also aware that name isn't HTML5 compliant after reading Can we give name to html <table>? but there is data-name="Hello World".

Further research I've looked at:

In regards to SEO, HTML5 compliancy and sitemap development what is the proper way to declare the title or name of a table because I'm having issues finding an answer in any schema regarding tables other than using the title attribute?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
DᴀʀᴛʜVᴀᴅᴇʀ
  • 7,681
  • 17
  • 73
  • 127
  • Can I get an explanation for the downvote? – DᴀʀᴛʜVᴀᴅᴇʀ Aug 30 '17 at 15:41
  • 1
    "In regards to SEO" … this question is off-topic. Try https://webmasters.stackexchange.com/ – Quentin Sep 01 '17 at 13:50
  • "sitemap development" — I have no idea what you mean. Are you talking about sitemap.xml? Or a user facing HTML document describing the important parts of the site? What are you actually trying to achieve by adding markup? – Quentin Sep 01 '17 at 13:51

1 Answers1

1

I'm unsure if there is a proper solution to identifying the name or title of the table.

What you're looking for is the <caption> element.

Working Example:

table {
width: 500px;
}

table, th, td {
border: 1px solid rgb(191, 191, 191);
}

caption {
line-height: 32px;
font-size: 16px;
font-style: italic;
}
<table>
<caption>I am a table caption</caption>
<thead>
<th>Header Cell</th>
<th>Header Cell</th>
</thead>
<tr>
<td>Data Cell</td>
<td>Data Cell</td>
</tr>
<tr>
<td>Data Cell</td>
<td>Data Cell</td>
</tr>
</table>

Further Reading:

http://developer.mozilla.org/en/docs/Web/HTML/Element/caption

Excerpt:

The HTML <caption> element represents the title of a table [...] it is always the first descendant of a <table>

Rounin
  • 27,134
  • 9
  • 83
  • 108
  • The caption element modifies the table's content and that isn't something I'm looking to do which was why I was seeking a backend solution since the content is from an automatic post ingestion. If I didn't want it visible I'd have to build a hack solution of `display: none;`. – DᴀʀᴛʜVᴀᴅᴇʀ Aug 29 '17 at 15:42
  • 1
    There's nothing hacky about using `display: none` (or, for that matter, `visibility: hidden`, or `opacity: 0`). `` is an element explicitly and exclusively intended to represent the title of a table. I'm not clear why `` isn't exactly what you're looking for. – Rounin Aug 29 '17 at 15:54
  • 1
    Putting content in a document which you never intend to show anybody is hacky. It's also the poster child of black hat SEO. – Quentin Sep 01 '17 at 13:52
  • If you never intend to show it to any user-agent at all, then yes, I agree with you, it's hacky. Not displaying an element in a browser viewport - but that element still playing a role within the document structure and available to other user-agents if and when needed - I don't think that's hacky. – Rounin Sep 01 '17 at 14:48