</rr>
-------------------------------------------------------------------------
O'Reilly & Associates would like to solicit comments from the WWW online
community on the following proposal to include support for 'stylesheets'
in HTML documents.
Date: June 6 1993
Title: Stylesheets for HTML
Author: Robert Raisch
Manager, Online Systems
O'Reilly & Associates
Abstract:
Many interesting documents in the WWWeb are now being
designed to support features or attributes of specific
browsers/renderers. While this is not, in itself, a
bad thing, the optimal state would be one where the
document carried with it information which allowed
browsers to make 'appropriate' decisions which were
aligned with the intent of the original author.
This RFC proposes an easily parsable format to deliver
stylistic information along with Web documents. While
the actual format of this information is of little
general interest to the Web community, an attempt has
been made to support a simple subset of generally useful
style HINTS or SUGGESTIONS. This is not meant to be an
exhaustive list and suggestions for improvement would
be most welcome.
In no way should this proposal be considered an attempt
to stipulate *required* behavior. The sole purpose of
the included format is to suggest behavior which will
allow a browser to render a specific document in a form
which more closely resembles the document as envisioned
by it's creator.
The author is indebted to the Global Network Navigator Project and
Digital Media and Design Groups of O'Reilly and Associates.
Please direct comments to the newsgroup, or to '[email protected]'
--------------------------------------------------------------------------
NOTE:
The format described is supported in libWStyle, a stylesheet parser
library which will be released to the WWW developer community, REAL
SOON NOW.
This document will be made available through the Web. Due to
the nature of certain discussions on the net, it is published here
as a plain text document. Apologies to Web purists. </rr>
--------------------------------------------------------------------------
WWW HTML STYLE GUIDE RECOMMENDATIONS - Robert Raisch
O'Reilly & Associates
02 June 1993
Need
----
There is a need within the WWW to be able to specify rendering
specific information along with the content tagging in a WWW document.
It is not appropriate to use HTML for this purpose, since one of the
first principles of HTML is to encode objects within a document, not how
they might be rendered in a particular environment.
Executive Summary -- The Short Form
-----------------------------------
o HTML documents would include a LINK STYLE tag which would
point to a stylesheet associated with the current
document.
o Stylesheet literate browsers or renderers would use this
tag to retrieve the actual stylesheet.
o Multiple stylesheets could be used per document to include
stylistic changes. Once a new stylesheet was loaded it
would hide, not overwrite, the previous stylesheet. The
previous stylesheet would become visible once an empty
LINK STYLE tag was encountered.
o Stylesheets are defined in a easy to parse, compact form
to minimize the time required to retrieve and interpret
them.
o Styles are suggestions or hints about behavior, not rules.
What we're doing here
---------------------
This document is an attempt to codify those rendering aspects
which would be most useful in the specification of an HTML object. This is
not meant to be an exhaustive list of rendering possibilities, nor is it
a set of "rules set in stone" which must be obeyed. Rather, this is really
a set of HINTS or SUGGESTIONS to the renderer which might be used to display
particular HTML objects in the fashion the author of a document originally
intended.
It is suggested that renderers which cannot adhere to some style
specified in this document might make an attempt to remain true to the
spirit of the author's original intent. (Few renderers short of a true
X-terminal will be able to implement the full set of styles defined here.)
An example of this might be the use of a 'o' (small-oh) to represent
the 'round mark', or the interpretation of a color style specifying red on
white characters as a "reverse video" or "blinking" attribute on terminals
which do not support color.
The Styles
----------
The styles defined specify the recommended behavior of HTML objects
in terms of:
Category Style Name
----------------------- ----------
character rendering font
object justification justify
page layout column
break behavior break
special marks mark
vertical object layout vert
horizontal object layout indent
links contained in objects link
Each style has a number of arguments or attributes which can be
specified per HTML object, and in the general case, as a default for all
HTML objects which are not further refined.
Stylesheet Identification
-------------------------
HTML specifies a header element called <LINK> which can be used for a
wide variety of purposes. I suggest that the following form be followed:
<LINK STYLE={URL}>
It is expected that stylesheet literate browsers would retrieve the
stylesheet from it's URL, and use the information contained therein to make
appropriate rendering decisions. (See Appendix II and III)
-----------------------------------------------------------------------------
Definition of Recommended Styles, Attributes and Values
-----------------------------------------------------------------------------
font(family,spacing,size,weight,slant,foreground,background,line,longname)(fo)
Describes the characteristics of character representation.
(fa) family= FAMILY (ti,he,sy,ty) DEFAULT:ti
Describes the 'subjective' style of a font. This is not
meant as a font name, per se. Rather it is a suggestion
of a particular style of character representation.
Recommended values are:
times, -- in the style of Serif Times Roman
helvetica, -- in the style of Sans Serif Helvetica
system, -- default system font style
typewriter -- default "tty" font style
(sp) spacing= SPACING (mo,pr) DEFAULT:mo
Describes the intra-character spacing rule for a particular
character representation. Recommended values are:
monospaced, -- each character takes up same space
proportional -- each character takes up diff space
(si) size= UNITS point size DEFAULT:14
Describes the size of the character representation in
general UNITS, which could be interpreted as a typographic
'point' size. Recommended values are: 1-n
(we) weight= WEIGHT (ul,li,me,de,bo) DEFAULT:me
Describes the general weight of a character representation
in the following recommended terms:
ultralight, -- lightest
light, -- lighter than "normal"
medium, -- "normal" weight
demibold, -- heavier than "normal"
bold -- heaviest
(sl) slant= SLANT (ro,it,ob) DEFAULT:ro
Describes the slant or angle of a character representation
in the following terms:
roman, - normal upright representation
italic, - forward inclination
oblique - backward inclination (???)
(fo) foreground= COLOR DEFAULT:''
Describes the recommended foreground color representation
for a character. Colors are specified as 'inherit', text
names, (eg. black, white, magenta), or as RGB color
values in hexidecimal, (eg. 0x000000, 0xffffff, 0xff00ff)
(ba) background= COLOR DEFAULT:''
Describes the recommended background color representation
for a character. Colors are specified as 'inherit', text
names, (eg. black, white, magenta), or as RGB color
values in hexidecimal, (eg. 0x000000, 0xffffff, 0xff00ff)
(li) line= LINE (no,un,th,ov) DEFAULT:no
Describes the recommended representation of attendant
lines in the character style. Recommended values are:
none, -- no line highlighting object
under, -- line under object (underline)
through, -- line through object (strikeout)
over -- line over object (overline)
(nu) number= UNITS number of lines DEFAULT:1
Describes the recommended number of attendant lines in
the character style. Recommended values are: 1-n
(lo) longname= STR platform specific font name DEFAULT:''
Describes, in a platform specific fashion, the recommended
font name for a character representation. A possible
value might be:
-adobe-courier-bold-r-normal--0-190-75-75-m-110-iso8859-1
-----------------------------------------------------------------------------
justify(style,hyphen,kern) (ju)
Describes the characteristics of character and line justification.
(st) style= JUST style of justification (no,le,ce,ri,fu) DEFAULT:le
Describes the recommended justification of an object.
Recommended values are:
none, -- no justification (PRE)
left, -- justify object to the left
center, -- center object
right, -- justify object to the right
full -- fully justify object
(hy) hyphen BOOL words can be hyphenated if possible DEFAULT:0
Describes the recommendation that words which cross line
boundaries may be hyphenated to better represent the
object. Recommended values are either:
FALSE (0) or TRUE (not FALSE)
(ke) kern BOOL words can be kerned if possible DEFAULT:0
Describes the recommendation that characters may be kerned
to better represent the object. Recommended values are
either:
FALSE (0) or TRUE (not FALSE)
-----------------------------------------------------------------------------
column(num) (co)
Describes the characteristics of columnar layout.
(nu) num= UNITS number of columns to display DEFAULT:1
Describes the maximal number of legal columns. Recommended
values are: 1-n
(wi) width= UNITS width of a column DEFAULT:0
Describes the maximal number of UNITS per column. In the
case of a text object, UNITS might represent characters,
while in the context of a graphical object, UNITS could
represent picture elements (pixels.) Recommended values
are: 1-n
-----------------------------------------------------------------------------
break(location,object) (br)
Describes the suggested behavior of an object in terms of it's
"breakability." (Break in the sense that the current object is
broken, and the cursor or point of attention returns to the left-
most point of reference.)
(st) style= BREAK how to break (be, af) DEFAULT:af
Describes the recommended style of breakage for the
object. Recommended values are:
before, -- break appears before object
after -- break appears after object
(ob) object= OBJ what to break (no,it,li,ch) DEFAULT:no
Describes the recommended element of the object upon
which to break. (For example, paragraphs traditionally
break upon the paragraph itself (item), while titles
or headers break upon each line. Recommended values
are:
none, -- do not break
item, -- break on the object itself
line, -- break on each logical line
character -- break on each character
(included for completeness)
-----------------------------------------------------------------------------
mark(object,preceed,before,replace,succeed,after) (ma)
Describes a mark or signal which can appear with an object.
(NOTE: a "mark" can be specified in a number of ways. Recommended
values for the mark are:
none, -- no not mark
{string}, -- text which marks the object
{icon}, -- a graphical element or icon
arabic, -- arabic numerals
alpha, -- alphabetic numerals
roman, -- roman numerals
vert, -- vertical bar
horz, -- horizontal bar
round, -- bullet or circle
square, -- square mark
check, -- check mark
star, -- star or asterix
north, -- northward pointing arrow
south, -- southward pointing arrow
east, -- eastward pointing arrow
west -- westward pointing arrow
It is recommended that numeric marks (arabic,alpha,roman) be
incremented based on each instance of a particular object, eg.
the first instance of an object with the 'alpha' style of mark
could be marked with 'A', and the succeeding elements markes
with 'B', 'C', 'D', etc. It is also recommended that upon a
change of mark, eg. from alpha to roman, could reset the
current counter.
)
(ob) object= OBJ what to mark (no,it,li,ch) DEFAULT:no
Describes what element within an object gets the mark.
Recommended values are:
none, (as above)
item,
line,
character
(pr) preceed= MARK preceeding mark DEFAULT:no
Describes the mark or signal which could appear before
the previously mentioned element.
(be) before= UNITS space btw mark and item DEFAULT:0
Describes the recommended amount of space before an object
the mark appears. (A UNIT takes on different interpretation
depending on the context, textual or graphical.) Recommended
values are: 1-n.
(re) replace= MARK mark which replaces content DEFAULT:no
Describes the mark or signal which could replace the
previously mentioned element.
(su) succeed= MARK succeeding mark DEFAULT:no
Describes the mark or signal which could appear after
the previously mentioned element.
(af) after= UNITS space btw item and mark DEFAULT:0
Describes the recommended amount of space after an object
the mark appears. (A UNIT takes on different interpretation
depending on the context, textual or graphical.) Recommended
values are: 1-n.
-----------------------------------------------------------------------------
vert(before,after,spacing,offset) (ve)
Describes the characteristics of an object in terms of vertical
geometry.
(be) before= UNITS vertical space before object DEFAULT:0
Describes the amount of space in UNITS before an object.
(UNITS takes on different meaning depending on current
context. See "column.width")
(af) after= UNITS vertical space after item DEFAULT:0
Describes the amount of space in UNITS after an object.
(UNITS takes on different meaning depending on current
context. See "column.width")
(le) leading= UNITS vertical spacing between lines DEFAULT:0
Describes the amount of space in UNITS between objects.
(UNITS takes on different meaning depending on current
context. See "column.width")
(of) offset= UNITS vertical spacing from baseline DEFAULT:0
Describes the amount of space in UNITS between an object
and the baseline. (Allows supscripting and superscripting.)
(UNITS takes on different meaning depending on current
context. See "column.width")
-----------------------------------------------------------------------------
indent(left,right,first) (in)
Describes the characteristics of an object in terms of horizontal
geography.
(le) left= UNITS horizontal space before item DEFAULT:0
Describes the amount of space, in UNITS, before or to the
left of the object.
(ri) right= UNITS horizontal space after item DEFAULT:0
Describes the amount of space, in UNITS, after or to the
right of the object.
(fi) first= UNITS indent for object DEFAULT:0
Describes the amount of space, in UNITS, before the first
line of an object.
-----------------------------------------------------------------------------
link(location,mark,line,number,before,after,hide) (li)
Describes the special characteristics of a link or selectable
object.
(lo) location= TOKEN (no,in,ri,le) DEFAULT:of
Describes where a link might appear. Recommended values
are:
none, -- suppress link marking
inline, -- mark links inline
right, -- mark links in right margin
left, -- mark links in left margin
start, -- collect links at start of object
end -- collect links at end of object
(ma) mark= MARK mark to display as link DEFAULT:no
Describes the mark to display, highlighting this link.
(See mark previously for explanation of mark types.)
(li) line= LINE (no,un,th,ov) DEFAULT:un
Describes the line characteristics of a link. Recommended
values are:
none, -- no line highlighting link
under, -- line under object (underline)
through, -- line through object (strikeout)
over -- line over object (overline)
(nu) number= UNITS number of lines DEFAULT:1
Describes the number of lines to use to highlight a link.
Recommended values are: 1-n
(be) before= MARK mark to display before link DEFAULT:no
Describes the mark to display before the link. (See mark
previously for explanation of mark types.)
(af) after= MARK mark to display after link DEFAULT:no
Describes the mark to display after the link. (See mark
previously for explanation of mark types.)
(hi) hide= BOOL hide link content DEFAULT:0
Describes the intent to hide the content of a link. This
is included to handle the possibility of an object having
a graphical mark which signifies a link where the actual
textual component of the link (the text held between the <A>
and it's matching </A>) is not intended to be displayed.
On a text-only display, the graphic might be ignored and
the text might be displayed in it's place. Recommended
values are:
FALSE (0) and TRUE (not FALSE)
-----------------------------------------------------------------------------
APPENDIX I
EXAMPLE STYLESHEET FOR AN IMAGINARY HTML DOCUMENT
-----------------------------------------------------
# DEFAULT for all succeeding objects..
@DEFAULT fo(fa=ti,sp=pr,si=14,we=me,sl=ro,fo=in,bo=in,li=no,nu=1,fn='')
ju(st=le,hy=0,ke=0) co(nu=1,wi=80) br(lo=af,ob=it)
ma(ob=it,pr=no,be=0,re=no,su=no,af=0)
ve(be=0,af=0,sp=0,of=0) in(le=0,ri=0,fi=0)
li(lo=in,ma=no,li=un,nu=1,be=no,af=no,hi=0)
# TITLE object style (font size becomes 24)
@TITLE fo(si=24)
# BODY object style (font family becomes helvetica, font size becomes 18)
@BODY fo(fa=he,si=18)
# PARAGRAPH SEPERATOR object style (break after item, vertical space after =1)
@P br(lo=af,ob=it) ve(af=1)
# Headers
@H1 fo(si=32,we=bo) ve(be=1,af=2) @H2 fo(si=24,we=bo) ve(be=1,af=2)
@H3 fo(si=18,we=bo) ve(be=1,af=2) @H4 fo(si=16,we=bo) ve(be=1,af=2)
@H5 fo(si=14,we=bo) ve(be=1,af=2) @H6 fo(si=12,we=bo) ve(be=1,af=2)
# Some List Stuff
@UL in(le=5)
@LI ma(pr=ro,be=4) in(le=10,ri=10)
# Standards
@B fo(we=bo) @I fo(sl=it) @U fo(li=un, nu=1)
# Anchors with some colour
@A fo(fo='yellow',ba='black')
-----------------------------------------------------------------------------
APPENDIX II
Stylesheet Layout and Parsing Considerations -- (TECHNICAL DETAIL)
--------------------------------------------
An example stylesheet follows the discussion of the various styles,
and details the recommended layout of a stylesheet.
Each element of the stylesheet is uniquely marked and the name of
each style and style attribute has been chosen to be unique to the first
two letters, which makes parsing the style-sheet a simple task.
Parsing Rule #1:
Lines which do not have as their first non-whitespace character
either an '@' which signals the beginning of a new object definition
or an alphabetic [a-zA-Z], will be ignored to the end of the line.
Parsing Rule #2:
Next we throw out all the newlines and scan the remaining buffer.
An '@' (at-sign) signals the beginning of a new HTML object definition.
Parsing Rule #3:
After the '@' and possible intervening whitespace, we expect the name
of an HTML object (eg. TITLE, H1, B, STRONG, etc.)
Parsing Rule #4:
After the name, and intervening whitespace, we expect at least two
characters which signal the beginning of a style. Legal values are:
fo, ju, co, br, ma, ve, in, li
Parsing Rule #5:
After the two character style specifier, scan to the '(' (open-paren)
and ignore intervening data or whitespace.
... (I think you get the idea, but I'll fill this in later if necessary)
-----------------------------------------------------------------------------
APPENDIX III
Use of Stylistic Hints or Suggestions - Typical Scenario -- (MUY TECHNICAL!!)
--------------------------------------------------------
A renderer which understands the <LINK STYLE> tag would use the URL
to retrieve the stylesheet, and run it through the WWW style library,
(libStyle.a -- to be supplied, currently in development.)
Once the stylesheet has been loaded, when an HTML element is
encountered within the document, the renderer has the option of calling the
style library, asking for advice on how to render the specific element.
For example: (scans all styles and renderer sets attributes)
***Renderer begins to scan document***
***Renderer recognizes <LINK STYLE={URL}>***
loadStyleSheet( {URL});
***Renderer sees a <TITLE> tag in the document***
current = firstStyle( styles = queryStyleSheet( TITLE));
while( current) {
switch( styleName( current)) {
case FONT: {
while( nextAttr( current)) {
switch( attr) {
case FAMILY:
switch( attrValue(attr)) {
case TIMES:
***Renderer decides what to do here***
case HELVETICA:
case SYSTEM:
case TYPEWRITER:
default:
}
case SPACING:
case SIZE:
case WEIGHT:
case SLANT:
case FOREGROUND:
case BACKGROUND:
case LINE:
case LONGNAME:
default:
}
}
break;
}
case JUSTIFY:
break;
case COLUMNS:
break;
case BREAK:
break;
case MARK:
break;
case VERTICAL:
break;
case INDENT:
break;
case LINK:
break;
default:
***Ignore -- Illegal style***
}
current = nextStyle( styles);
}
Another example: (renderer sets attributes only for styles needed)
***Renderer begins to scan document***
***Renderer recognizes <LINK STYLE={URL}>***
loadStyleSheet( {URL});
***Renderer sees a <TITLE> tag in the document***
switch( getValue(TITLE, FONT, FAMILY)) {
*** renderer decides what to do here***
case UNKNOWN:
case TIMES:
case HELVETICA:
case SYSTEM:
case TYPEWRITER:
}
***Renderer sees a <H1> tag in the document***
switch( getValue( H1, BREAK, STYLE)) {
case UNKNOWN:
case BEFORE:
case AFTER:
}
etc.