CODEWITHSUNDEEP
htmlsemantic-markup
Matt Crest
Matt Crest

Reputation: 560

Which HTML element makes the most sense for code annotation?

I'm working on a web app that has code listings. Certain lines of code have notes attached to them (think comments, but not inline code comments - more like an author explaining something).

When a user hovers over the footnote type indicator, a tooltip will display the comment.

Example code on jsFiddle

Now the questions

  1. What element would make the most sense to wrap the comment indicator in? I toyed with the idea of <mark>, but I get the feeling that's a stretch. Somebody suggested the <object> tag could actually make sense. Again, not sure.
  2. Is there an element that the actual footnotes (we're calling them annotations) should be wrapped in?

Any insight would be greatly appreciated.

Upvotes: 6

Views: 1728

Answers (1)

steveax
steveax

Reputation: 17753

I was thinking that <aside> might be useful, but probably a footnote pattern is really the closest match.

Wikipedia uses <sup id="cite_ref-N"><a href="#cite_note-N">N</a></cite> for the indicator and <li id="cite_note-N">Note</li> for the note. You could do worse than follow that.

Upvotes: 3

Related Questions