Skip to main content

Day 73 of 100DaysOfSpec, code, var, samp, and kbd elements

I am reading and taking notes on the HTML specifications for 100 days as part of #The100DayProject. Read the initial intent/backstory. I am a Microsoft employee but all opinions, comments, etc on this site are my own. I do not speak on behalf of my employer, and thus no comments should be taken as representative of Microsoft's official opinion of the spec. Subsections not listed below were read without comment.

Currently reading in 4.5 Text-level semantics.

4.5.12 The code element

“The code element represents a fragment of computer code.”

  • There’s no semantic way to designate the coding language. Classes are okay to use for syntax highlighting.
  • You don’t HAVE to use code inside pre, just if you want to display this as a block of pre-formatted text. Throughout these posts I’ve been using the code element inline.

4.5.13 The var element

“The var element represents a variable. This could be an actual variable in a mathematical expression or programming context, an identifier representing a constant, a symbol identifying a physical quantity, a function parameter, or just be a term used as a placeholder in prose.”

There are many use cases where MathML would be a better choice for your markup (math equations more complex than your second-grade stuff). But MathML support is pretty much worthless, so.

4.5.14 The samp element

“The samp element represents (sample) output from a program or computing system.”

Wait, so…could this be used to show output from web languages? Probably not, as the element is only allowed to contain phrasing content. BUT THAT WOULD HAVE BEEN COOL.

4.5.15 The kbd element

“The kbd element represents user input (typically keyboard input, although it may also be used to represent other input, such as voice commands).”

Where you place the kbd element changes its semantic meaning, which I don’t think I’ve come across yet. I don’t think I can adequately explain that without re-stating the spec, so maybe just read the original.


My blog uses Webmentions. Responses from sites which likewise support Webmentions, such as Twitter or people’s personal sites, will show up here.

No Webmentions have been sent to this post yet.