POSH Reference in a Nutshell

A quick fire list of semantic (X)HTML elements with brief notes on usage. POSH is the acronym for Plain Old Semantic HTML. POSH gives us an easy to remember acronym that encapsulates the simplicity, best practice and benefits of using semantic markup. You can learn more about POSH on microformats.org.

Block Elements

div
Provides meaningful divisions. Frequently nested and used to group related elements and content such as headers, sidebars, content area and footers.
h1-h6
The six levels of headings are used to introduce and describe sections of content. It is common practice to use only one h1 element on any one page—a page has one main heading and many sub sections with h2 and/or h3 headings.
p
The paragraph element is used to markup and deliniate a block of text.
blockquote
Indicates a large or substantial quote.
address
Indicates contact information for a document or a major part of a document. May be used in conjuction with the hCard microformat.

List Elements

ul
ol
li
Lists are used to represent grouped information best represented as a list. Often used to markup menus (a list of links). ol represents ordered list while ul represents unordered lists. li represents a single list item. Lists can be nested.
dl
dd
dt
Indicates a list of terms (dt) with their accompanying definitions (dd). Often used to markup FAQ's.

Inline Elements

a
Typically used with an href attribute to indicate an external resource or an anchored location within the same document.
abbr
Indicates a shortened form of a term or phrase. Often attributed with a title.
acronym
Used to markup acronyms, initialisms, and alphabetisms. Often attributed with a title.
em
Used to indicates emphasis. Emphasised text is in some way more significant than the text surrounding it.
strong
Used to indicate stronger emphasis. Similar to em but stronger.
cite
Indicates bibliographical information, personal quotations or references.
code
Indicates a sample of computer programming code.
dfn
Defines the first instance of a term in a document. The semantic value of dfn is debatable.
del
Indicates information which has been deleted from a document. Semantic replacement for the deprecated strike element.
ins
The opposite of del. Indicates inserted text added during revisions.
samp
Sample output from computer programs or scripts. Sample output may or may not be code.
span
Generic inline element used where a semantic element would be inappropriate. Span elements are considered to have no semantic value.
q
Indicates a inline quotation.
kbd
Indicates text to be entered by the user. Rarely used, but useful in circumstances where you are demonstrating the use of a program, along with code and samp.
sub
sup
Superscripting and subscripting of text. Often used to indicate footnote references.
var
Along with code, samp, kbd, the “variable” element indicates a variable (or program argument).

Form Elements

label
The label element is used to describe form elements.

Table Elements

table
Used to markup indicate tabular data.
thead
Defines a header region for a data table, which would normally contain the headers (th) for each column.
tfoot
Defines a footer region for a data table, which should include information referential to the columns of data.
tbody
The content region of a table.
caption
Describes the table. Essentially a heading for the table.
th
Table heading for rows columns. Indicate the type of information within the row or column.
td
A data cell, in which content is placed which corresponds to both the headers for the row and column.

Last updated 25th April, 2009 - 10:08pm

Authored by Jeff Burnz on