Most of my readers have a better understanding of formal English language than that which I use. I’ve used redundant statements in articles or cited Wikipedia pages for larger references when making vague allusions. However, one thing has always bothered me: inline definitions. I do not generally follow links and I'd wager that most site visitors do not either. I wanted an inline definition rollover for Universality which for me includes editorial content that includes slang, vague references and allusions that may be understood by all.
This was the first pun I learned but did not understand until my father explained it to me:
“Two old ladies went for a tramp in the woods but he got away.”
Most readers will understand that “tramp” means a hobo or—these days—a homeless gent. However, the joke arises when “tramp” is first understood to be walking or promenading.
And, that’s where my frustration rose. Web pages offer interactive elements. And, I wanted a simple mechanism to display inline definition.
HTML 4.01 Specification, 9 Text, 9.2 Structured text, 9.2.1 Phrase elements: EM, STRONG, DFN, CODE, SAMP, KBD, VAR, CITE, ABBR, and ACRONYM
“DFN: Indicates that this is the defining instance of the enclosed term.”
That would work.
And, the funny thing about the “title” attribute: it works on all HTML elements even if not all browsers acknowledge it.
A previous article Shakespeare knew Latin had a malaprop with a homophone between “heals” and “heels” that required an explanation. Or, definition. I wrote my HTML appropriately for my need.
“Time wounds all <dfn title="An unscrupulous person usually male" class="definition">heels</dfn>”.
The definition class is added for styling a different bottom border than what the abbreviation renders. I didn’t like the “title” display and it does not allow enough characters for long definitions, e.g., sixty-five characters in FireFox.
Sweet Titles Finalized by Dunstan Diaz was my first selection after perusal of Smashing Magazine’s 40+ Tooltips Scripts With AJAX, JavaScript & CSS and jQuery plugin: Tooltip by Jörn Zaefferer was my second selection (and, what — Presently — is used on this site). Each “Tooltip” script has distinct uses on a website. For each all that is needed is to add cursor: help and visual identification for the definition tooltip somewhere in the stylesheet as another level of differentiation.
I have my inline definitions. Semantic or not. And, it degrades gracefully when Javascript has been shutoff.
Further, albeit semantic nonconformance resulting, I have extended the above use for quote translations.
I hope these DFN Titles are found useful. And, if I ever write about wordplay and cite L.H.O.O.Q. by Marcel Duchamp, then you’ll know what his joke was.