I'm currently reading the HTML tutorial on w3schools (no CSS or JavaScript yet) and I wonder why are there so many different tags that look the same after all?
For example I don't see any (optical) difference between kbd
, samp
and code
except the "meaning" of each tag.
So my question: Is it just the meta information that differs these tags?
Correct. The semantic meaning is different. The default rendering is to use a monospace typeface because that's the most appropriate.
<kbd>
represents keyboard input, though StackOverflow renders it like real keys.
<samp>
represents sample computer output, and originally computers were monospaced :)
<code>
represents programming code input, and the vast majority of programming languages are designed to assume a monospaced editor font - excepting C++'s book which prefers variable-width, for some reason, and some breeds of Python. Note that <code>
is an inline element, whereas <pre>
is used for block-level markup (i.e. paragraphs) of code.
The fact that default rendering is the same does not mean you cannot assign your own rendering styles like StackOverflow does.