Discussion:
Element type names - short overview
(too old to reply)
Stefan Ram
2024-04-09 11:23:26 UTC
Permalink
I created a short overview of a selection of names of element
types of the current WHATWG HTML for myself. Maybe other people
can use it too?

html root
head metadata collection of document
title title
meta metadata item of document
body contents of document
article composition - may start with h(n)
section section - may start with h(n)
nav navigation section
aside a tangent section
hgroup <hgroup><h(n)>heading</h(n)><p>subheading</p></hgroup>
header header for document
footer footer for document/section
address contact information for nearest article or body element
p paragraph
hr thematic break
pre preformatted ("mono") (xml:space="preserve") >code >samp >kbd
blockquote long quotation
ol ordered list
ul unordered list
menu toolbar unordered list of commands
li list item
dl association list
dt association term
dd assiciation data
figure separated unit
figcaption figure caption
main main content
search UI for searching
div generic flow container
em passive emphasis
strong active emphasis
small small print
s deleted
cite work title
q a quotation
dfn term being defined
abbr abbreviation or acronym
rt ruby text
data data in attributes
time time in datetime attribute
code code ("monospaced") (use xml:space="preserve" too!)
var formal name
samp system output
kbd input (samp>kbd=inp echo, kbd>samp=inp of outp, kbd>kbd=key)
sup superscript
sub subscript
i alternate voice ("italic") (taxon/tech term, foreign text)
b attention grabbing ("bold", active) keyword, name, lede
u unarticulated (misspelled, not clearly artic.) ("underl.")
mark highlighted text
bdi bidirectional text
bdo text directionality formatting
span generic phrase container
br a line break (p>br=blank line)
wbr line break opportunity
ins inserted
del deleted
picture container for img variants
img image
iframe external content inserted
video video
audio audio
map clickable image
area image area
table table
caption table title
tbody table body
thead table head
tfoot table footer
tr table row
td table data
th table header
form a UI
label UI text (one line)
input UI input
optgroup UI options
option UI option
textarea UI text (multiple lines)
output UI output
progress UI progress bar
meter value from a range
fieldset UI group
legend fieldset legend
details hidden information
summary summary of details
dialog UI dialog
noscript for disabled scripting
slot placeholder type
Arno Welzel
2024-04-09 19:13:57 UTC
Permalink
Post by Stefan Ram
I created a short overview of a selection of names of element
types of the current WHATWG HTML for myself. Maybe other people
can use it too?
This would be easier, if you would put this list on a public accessible
URL. But what is wrong with the official documentation?

See <https://html.spec.whatwg.org/multipage/#toc-semantics>
--
Arno Welzel
https://arnowelzel.de
Arno Welzel
2024-04-09 19:14:44 UTC
Permalink
Post by Arno Welzel
Post by Stefan Ram
I created a short overview of a selection of names of element
types of the current WHATWG HTML for myself. Maybe other people
can use it too?
This would be easier, if you would put this list on a public accessible
URL. But what is wrong with the official documentation?
See <https://html.spec.whatwg.org/multipage/#toc-semantics>
In addition: <https://devdocs.io/html-elements/>
--
Arno Welzel
https://arnowelzel.de
Jukka K. Korpela
2024-04-11 07:12:52 UTC
Permalink
Post by Arno Welzel
Post by Arno Welzel
See <https://html.spec.whatwg.org/multipage/#toc-semantics>
In addition: <https://devdocs.io/html-elements/>
These do not show short descriptions as in Stefan’s list. But there are
almost as short descriptions at
https://html.spec.whatwg.org/multipage/indices.html#elements-3
It’s not “official”, though: “This section is non-normative.”
Stefan Ram
2024-04-11 08:25:11 UTC
Permalink
Post by Jukka K. Korpela
These do not show short descriptions as in Stefan’s list. But there are
almost as short descriptions at
https://html.spec.whatwg.org/multipage/indices.html#elements-3
It’s not “official”, though: “This section is non-normative.”
Ah, much obliged! I wasn't aware of that little nugget of
information. Why, there are all sorts of sections, like this
here "4.5.29 Usage summary" for instance.

Now, my list here contains a mite of my own interpretation,
like this "formal name" business.

var formal name

Consarn it, what in tarnation is a "formal name" supposed
to be, anyhow? Why, I was referring to a name in a formal
language, you see - a language with a proper, formal grammar
(like that Backus-Naur business, for example).

And another thing, I've been calling "strong" an "active emphasis".

strong active emphasis

That HTML5 specification goes out of its way to avoid using
the word "emphasis" there and talks about "importance" instead.
Hmph, kids these days and their newfangled terminology!

Yep, there's always more to learn in this here world of ours. But
I'll be darned if I don't enjoy the challenge of unraveling these
linguistic puzzles, one piece at a time. Now, where was I? Ah yes,
let me take another gander at that short descriptions of your link!
JJ
2024-04-10 01:27:07 UTC
Permalink
Post by Stefan Ram
I created a short overview of a selection of names of element
types of the current WHATWG HTML for myself. Maybe other people
can use it too?
html root
head metadata collection of document
title title
meta metadata item of document
body contents of document
article composition - may start with h(n)
section section - may start with h(n)
nav navigation section
aside a tangent section
hgroup <hgroup><h(n)>heading</h(n)><p>subheading</p></hgroup>
header header for document
footer footer for document/section
address contact information for nearest article or body element
p paragraph
hr thematic break
pre preformatted ("mono") (xml:space="preserve") >code >samp >kbd
blockquote long quotation
ol ordered list
ul unordered list
menu toolbar unordered list of commands
li list item
dl association list
dt association term
dd assiciation data
figure separated unit
figcaption figure caption
main main content
search UI for searching
div generic flow container
em passive emphasis
strong active emphasis
small small print
s deleted
cite work title
q a quotation
dfn term being defined
abbr abbreviation or acronym
rt ruby text
data data in attributes
time time in datetime attribute
code code ("monospaced") (use xml:space="preserve" too!)
var formal name
samp system output
kbd input (samp>kbd=inp echo, kbd>samp=inp of outp, kbd>kbd=key)
sup superscript
sub subscript
i alternate voice ("italic") (taxon/tech term, foreign text)
b attention grabbing ("bold", active) keyword, name, lede
u unarticulated (misspelled, not clearly artic.) ("underl.")
mark highlighted text
bdi bidirectional text
bdo text directionality formatting
span generic phrase container
br a line break (p>br=blank line)
wbr line break opportunity
ins inserted
del deleted
picture container for img variants
img image
iframe external content inserted
video video
audio audio
map clickable image
area image area
table table
caption table title
tbody table body
thead table head
tfoot table footer
tr table row
td table data
th table header
form a UI
label UI text (one line)
input UI input
optgroup UI options
option UI option
textarea UI text (multiple lines)
output UI output
progress UI progress bar
meter value from a range
fieldset UI group
legend fieldset legend
details hidden information
summary summary of details
dialog UI dialog
noscript for disabled scripting
slot placeholder type
For most, I prefer straight forward overview and/or literal expansion of the
tag names, as mentioned in the HTML specification (unless they may be
misleading; e.g. HR), since it's easier to remember.
Stefan Ram
2024-04-10 10:24:18 UTC
Permalink
Post by Stefan Ram
I created a short overview of a selection of names of element
types of the current WHATWG HTML for myself. Maybe other people
can use it too?
New version:

CONTENT TYPES

flow content of body and similar containers
phrasing content of paragraphs and similar containers
palpable (=perceptible) makes elements to be considered "non-empty"

PHRASES

i alternate voice ("italic") (taxon/tech term, foreign text)
em passive emphasis
b attention grabbing ("bold", active) keyword, name, lede
strong active emphasis
mark highlighted text
span generic phrase container
small small print
cite work title
dfn term being defined
abbr abbreviation or acronym
code code ("monospaced") (use xml:space="preserve" too!)
var formal name
samp system output
kbd input (samp>kbd=inp echo, kbd>samp=inp of outp, kbd>kbd=key)
u wrong (misspelled, not clearly artic.) ("underlined")
sup superscript
sub subscript
ins inserted
del deleted (for document edits) (cf. s)
s obsolete content (cf. del)
data data in attributes
time time in datetime attribute
meter value from a range
q quotation

BLOCKS: LISTS

ol ordered list
ul unordered list
li list item
dl association list
dt association term
dd assiciation data

BLOCKS: DOCUMENT PARTS

main main content
div generic flow container
article composition - may start with h(n)
section section - may start with h(n)
nav navigation section
header header for document
footer footer for document/section
title title
hgroup <hgroup><h(n)>heading</h(n)><p>subheading</p></hgroup>

BLOCKS: BOXES

blockquote long quotation
aside a tangent section
figure separated unit
figcaption figure caption
pre preformatted ("mono") (xml:space="preserve") >code >samp >kbd
address contact information for nearest article or body element
menu toolbar unordered list of commands
details hidden information
summary summary of details
p paragraph
hr thematic break
br a line break (p>br=blank line)
wbr line break opportunity

BLOCKS: TABLES

table table
caption table title
tbody table body
thead table head
tfoot table footer
tr table row
td table data
th table header

UIs

map clickable image
area image area
form UI
search UI for searching
label UI text (one line)
input UI input
optgroup UI options
option UI option
textarea UI text (multiple lines)
output UI output
progress UI progress bar
dialog UI dialog
fieldset UI group
legend UI fieldset legend

DOCUMENT ORGANISATION

html root
head metadata collection of document
meta metadata item of document
body contents of document
noscript for disabled scripting

MEDIA

img image
iframe external content inserted
video video
audio audio
picture container for variants of the same picture

DIRECTIONALIY-RELATED

rt ruby text
bdi bidirectional text
bdo text directionality formatting

OTHERS

slot placeholder type
Loading...