The <q> element is an "inline version" of the more well-known <blockquote>. Interestingly, the browser will add quotes around it, so that Devs say <q>HTML is hard</q> gets rendered as:
Devs say “HTML is hard”
The quote characters depend on the page language (lang attribute on the main <html> element), and change if you nest the elements. For example, <html lang="de"><body>Devs say <q>HTML <q>is</q> hard</q></body></html> renders, at least in Chrome, as:
Devs say „HTML ‚is’ hard“
These can also be changed with CSS, where you can specify pairs of characters for each depth level:
quotes: '\201C' '\201D' '\2018' '\2019'; /* double quotes, then single quotes, and you can keep adding more pairs */
}
One drawback of using <q> is that the quote characters can't be selected or copied, which I think makes this element pretty useless for regular text. There's also a cite attribute you can use to provide a link to the "source" of the quote, but the browsers don't seem to do anything with it, so, again, useless.