Le code HTML est interprété différemment sous Netscape, Internet Explorer, Mozilla et autres lecteurs, ne parlons même pas des différentes versions... je rassemble ici les éléments stables

Stable Element

HTML / Javascript 1.0

Le code HTML est interprété différemment sous Netscape, Internet Explorer, Mozilla et autres lecteurs, ne parlons même pas des différentes versions....

Ici j'ai rassemblé les éléments qui fonctionnent indifféremment sous

L'usage de ces composants stables couplés aux conseils de la W3C garanti un fonctionnement uniforme des pages
 

Probleme depuis l'avenement de Internet Explorer 5 et Netscape 6 les choses ont évolué...
plusieurs éléments ne sont plus gérés par ces nouvelles  versions...
plus d'info à la rubrique "upgrade"...

Index

Anchors
ADDRESS
APPLET
AREA   (inside MAP)

B
BASE  (inside HEAD)
BASEFONT
BGSOUND (inside HEAD, try to avoid cannot be suspended ....)
BIG
BLINK
BLOCKQUOTE
BODY  (inside HTML)
BR

CAPTION (T)  (inside TABLE )
CENTER
COL (a) .or. \
COLGROUP    (inside TABLE )

DD      (inside DL)
DEL
DIV
DL
DT   (inside DL)

EM
EMBED

FONT
FORM
FRAME (inside FRAMESET)/ NOFRAMES
FRAMESET

H1...H6
HEAD (inside HTML)
HR
HTML

I
IFRAME  (A EVITER)
ILAYER  (see LAYER) (A EVITER)
IMG
INPUT

LABEL
LAYER (absolute) .or. ILAYER  (A EVITER)
LI
LINK

MAP
MARQUEE
META

NOBR
NOEMBED
NOFRAMES  (inside FRAMESET) (uv contingency for FRAME)
NOLAYER   (uv contingency for LAYER)
NOSCRIPT   (uv contingency for SCRIPT)
NOTOUCH

OBJECT
OL
OPTION  (inside SELECT)

P
PARAM   (inside APPLET or OBJECT)
PRE

S
SCRIPT   (uv contingency is NOSCRIPT)
SELECT
SMALL
SPACER
SPAN
STYLE   (often inside HEAD)
SUB
SUP

TABLE
THEAD .or. \  TFOOT .or. TBODY  /  (visually groups rows)
TD .or. TH
TEXTAREA  (inside FORM)
TH
TITLE     (inside HEAD)
TR
TT

U
UL

WBR


Layout / TAG  /
Terminology
Online function
URL Characters
Filename extension
 

all the different elements

TAGS, ATTRIBUTES, VALUES


!-- (XX-comment)

!--# (?M)
     (SSI..)

!DOCTYPE (X-SGML)
     html
     public

![CDATA[ (X) (XHTML escape for wrapping scripts and stylesheets)

?XML
     version
     encoding

A (O),(Ms) (c)
     href=(url) (hyperlink) (!M)
     target/frame::="theframe"
         _top (whole browser)
          _blank (popup)
          _self (same frame) (d)
          _parent (outer)
          AtTheNameYouGive
          (or corresponds to href'd FRAME:name)
     name (-W-id) (FrontPage "bookmark")
          (corresponds to the '#aname' part of a URL)
     id (target for url #suffix?)
     onmouseover \ (for active cursor hinting)
     onmouseout  /
 

ADDRESS (Y)(?C) (b) (italics?, I and EM are more common, also CITE, DFN, VAR)
    best is to redefine in a CSS style

APPLET (P) (c) (-W-OBJECT) (Java)
     (only Java 1.1 is stable and behave correctly on all java machines in any browser)
     (uv element content is displayed on non-Java browsers only)(WO?)
     code=filename.class
     align/inline ... (same as IMG)
     alt (-IE) (v)
     archive=jar_url
     codebase=dir_url
     width/rectangle:... (**IE)
     height/rectangle:... (**IE)
     hspace=(n) (pixels)
     vspace=(n) (pixels)
     mayscript (NO)
     name
     (contains PARAM)
     (transitioning to OBJECT, but APPLET is more common)
     ( comment are between a double dash in java // comments  //)
     ( comment are between a  dash in javascript /*  comments */)
     (when including a script it is safer to place it between
         <!--   --> so that it is not indexed by robots)
     (and to add a NOSCRIPT substitute)

AREA (Mc) (a)
     shape
          rect (!)       .aka. \
          circle (!)       /
          poly
     coords
          (rect) left,top,right,bottom
          (circle) xcenter,ycenter,radiusx,radiusy
          (poly) x1,y1,x2,y2,...
     href=(url)
          (~N requires href="#" for onmouseover to work)
     target/frame:...
     nohref (-N) (?strange?)
     alt (-N)(tooltip) (transitioning to title)
     onmouseover
     onmouseout
     onclick
     (inside MAP)

B (Y) (c) (--W-CSS) (!) (boldface, more common than STRONG)

BASE (S) (a)
     href=dirurl (default directory for A:href, AREA:href, FORM:action)
     target/frame... (default frame for A, AREA, FORM)
     (inside HEAD)

BASEFONT (Y) (-W-CSS) (a)
     size
     face
     color
     (...see FONT)
 
 

BGSOUND (A) (IEO) (a)
     src=audiourl
     loop=(n) (-1 forever)
     volume (-10000 for mute or 0 for full volume) (IE4O)
     balance (-10000 for all left, 0 for center, +10000 for all right) (IE4O)
     (inside HEAD, try to avoid cannot be suspended ....)
 

BIG (Y) ((c)4) (--W-CSS)
     (first level may be merely boldface)
     (FONT:size=+1 is more common)

BLINK (Y) (NO) (c)

BLOCKQUOTE (Y)(C?) ((b)) (indent, more common than DL) (FrontPage prefers)
     (~N adds vertical space before)

BODY (S)
     bgcolor=#rrggbb (-W-CSS)
     link=#rrggbb (never seen) (d-the wild blue yonder) (-W-CSS)
     alink=#rrggbb (clicking) (d-red) (-W-CSS)
     vlink=#rrggbb (already seen) (d-purple) (-W-CSS)
     text=#rrggbb (d-black) (-W-CSS)
     background=imageurl (-W-CSS)
     bgproperties (IEO)
          (empty string means background image scrolls when page content scrolls)
          fixed (background image doesn't scroll)
     topmargin=npixels (IE4O)
     leftmargin=npixels (IE4O)
     rightmargin=npixels (IE4O)
     bottommargin=npixels (IE4O)
     onload
     onunload
     nowrap (IE4O)
     (inside HTML)

BR (Y) (a)
     clear (-W-CSS)
          none (d)
          all
          left (stop flow around an align=left image and jump below it)
          right
 

CAPTION (T) (a)
     (inside TABLE)
     align/caption::= (-W-CSS)
          top (d)
          bottom
          center (IEO)
          left (-N)
          right (-N)
     valign (IE4O)
          top    (above table)
          bottom (below table)

CENTER (Y) (b) (a) (-W-CSS) (horizontally)
 

COL (a) .or. \

COLGROUP     / (T) (-N) (-IE3) (attributes by column) (inside TABLE)
     span (columns)
          1 (d)
     width
          (n)  (pixels)
          (n)% (of window frame)
          *    (remainder)
          (n)* (relative portion)
     align/cell:...
     valign/cell:... (-IE3)
     bgcolor=#rrggbb

     (before TR)
 

DD ((L)?)(?C) (paragraph in a phrase-paragraph list) (b~)
     nowrap (IE4O)
     (inside DL)

DEL (Y)(?C) (c) (-N) (strike-out, STRIKE is more common, also S)
 

DIV (E) ((b)) (commonly used for: align, class, id, style)
     align/paragraph:... (-W-CSS)
     nowrap (IE4O)

DL (L)(?C) (b) (phrase-paragraph list)
     compact (DT's and DD's on same line)
     (contains DT, DD)
     (BLOCKQUOTE is more common to indent)
     (may be more common, and certainly more visually flexible, to make a
     two-column table, with the first column align=top)

DT (L)(?C) (b) (phrase in a phrase-paragraph list)
     nowrap (IE4O)
     (inside DL)

EM (Y)(?C) (c) (italics, more common than I, also ADDRESS, CITE, DFN, VAR)
     (preferred by FrontPage) (-!-I)
     verry powerfull when combined with CSS
    EM Class=element

EMBED (P) (c) (-W) (-IE3) (a) (uv contingency is NOEMBED)
     (Netscape plugin / RealAudio plugin / Shockwave Flash plugin)
     src=dataurl
     pluginspage=programurl
     width/rectangle:...
     height/rectangle:...
     units
          pixels (NO) or px (IE4O) (d)
          en
     type=(mimetype) (NO)
          audio/x-pn-realaudio-plugin (for RealAudio(R)...)
               autostart (tf)
               controls
                    ControlPanel
                    StatusBar
                    ImageWindow
               console
               nojava (tf)
               border
                    0
          application/x-shockwave-flash (for Shockwave Flash(R)...)
               menu (tf)
               quality
                    high
               loop (tf)
               swLiveConnect (tf)
               bgcolor
               width
               height
               border
          netscape plug-in (NO)
               border
               frameborder/frame:...
               hidden (tf)
               hspace
               vspace
               name
               pluginurl=jarurl
               palette
                    foreground
                    background
     align/inline:... (Netscape may support only left, right, top, bottom)
 
 

FONT (Y)(E) ((c)) (-W-CSS) (!)
     size
          (n)  (1=smallest, 3=normal, 7=biggest)
          +(n) (more common than BIG)
          -(n) (more comon than SMALL)
     face (typeface)
          arial
          geneva,arial,helvetica
     color=#rrggbb
     point-size (N4O)
     weight (N4O)
          (100=least bold, 900=most bold)
     onmouseover (hover: active cursor hinting)
     onmouseout

FORM (O) (b)
     action=submiturl (r) (FORM:action is like A:href except data goes up)
     method
          get (d) (submit data by appending to URL -- visible to user)
          post (submit data in HTTP request body -- hidden from user) (!)
               (required by INPUT:type=file)
     target/frame...
     enctype=(mimetype) (upload technique)
          application/x-www-form-urlencoded (d)
          multipart/form-data (required by INPUT:type=file)
     name (-W-id) (useful in scripts)
     onsubmit
          return false (prevents submission)
     (contains, INPUT, TEXTAREA, SELECT BUTTON)

FRAME (F) (a) (browser window partitioning) (uv contingency is NOFRAMES)
     src=pageurl
     name (-W-id)
          (corresponds to A:target, AREA:target, BASE:target or FORM:target value)
     scrolling/frame::= (scroll bars)
          no (never)
          auto (d) (if big contents)
          yes (always)
     marginwidth=(n) (pixels)
     marginheight=(n) (pixels)
     frameborder/frame:...
     noresize (-IE3) (prevents edge dragging)
     bordercolor=#rrggbb
     longdesc=pageurl (WO)
     width/rectangle:... (IE5.5O)
     height/rectangle:... (IE5.5O)
     framespacing (-) (apparent red herring, no one supports yet many use
          in the arduous struggle to make frames seamless and invisible)
     application=(yn) (IE5O-HTA) (yes=trust content)
     (inside FRAMESET)

FRAMESET ((F)) ((inner attributes usually prevail))
     (~N reveals frameset nesting subtly in the 3D border graphics, ~IE hides)
     (~N reloads HTML and redraws borders when resizing browser window,
          but NOT when hitting Reload button)
     (~IE reloads HTML and redraws borders when hitting Refresh button,
          but NOT when resizing browser window)
     (~IE borders may be invisible when border < 5)
     (~N3 may show narrower borders after repaint than after resize)
     (~N displays thin black box around frame when it's clicked on)
     (~IE3 supports framespacing)
     (~IE4+ supports framespacing or border, but framespacing is dominant)
     (~N border attribute works on outermost frameset only)

     cols .or. \
     rows      / (comma-separated list of the following)
          (n)  (pixels)
          (n)% (of window frame)
          *    (remainder)
          (n)* (relative portion)

     border=(n) (-W) (-IE3)  \ (border   \
     framespacing=(n) (IEO)  /  pixels)   > (zero all 3 for seamless frames)
     frameborder/frame::= (border style) /
          0 (**N) (flat borders)
          1 (**N) (3D borders) (d)
          yes (-W)
          no (-W)

     bordercolor=#rrggbb
     onload
     (either in place of BODY or inside another FRAMESET)

H1-H6 (Y) (b)
     align/paragraph:... (-W-CSS) (-IE3)

HEAD (S)
     profile=(url) (WO) (vague, defines META:scheme's and LINK:rel's)
     (inside HTML)

HR (Y) (b)
     align (-W-CSS)
          center
          left
          right
     color=#rrggbb (IEO)
     noshade (flat) (-W-CSS)
     size=(n) (thickness) (d 2) (-W-CSS)
     width/rectangle:... (-W-CSS)

HTML (S)
 

I (Y) (c) (--W-CSS) (italics, EM is more common, also ADDRESS, CITE, DFN, VAR) (!)

IFRAME (F) (c) (-N) (inline frame, included page)
     src=pageurl
     width/rectangle:... (**IE)
     height/rectangle:... (**IE)
     hspace=(n) (pixels) (IEO)
     vspace=(n) (pixels) (IEO)
     marginwidth=(n) (pixels)
     marginheight=(n) (pixels)
     scrolling/frame:... (~IE horizontal scrollbar always auto)
     frameborder/frame:...
     name (corresponds to A:target, other targets)
     align/inline:... (-W-CSS)
     bgcolor=#rrggbb (IEO)
     application=(yn) (IE5O-HTA) (yes=trust content)
     (uv element contents displayed on non-IFRAME browsers only --
     without a closing tag the rest of your document may not appear!)

Netscape 6 silently ignores the <LAYER>, </LAYER>, <ILAYER>, </ILAYER>, <NOLAYER>, and </NOLAYER> tags and renders the HTML page as if those 6 tags were not present (i.e. as if the file had been edited to remove those 6 tags only). DIV will be rendered, but the SRC= attribute if present will be ignored. The contents of LAYER, ILAYER, and NOLAYER (any tags inside them) will be rendered as content.

For a full set of test cases illustrating the different combinations, see  http://sites.netscape.net/ekrock/tests/matrix.html. Here is a summary of some techniques for achieving cross-browser and backward compatibility:


 

ILAYER (?L) (NO) (c) (see LAYER)

IMG (G) (Ms) (Mc) (c) (a) (contrast INPUT:type=image)
     src=imageurl
     width/rectangle::= (-W-CSS)
          (n)  (pixels)
          (n)% (of window frame)
     height/rectangle::= (-W-CSS)
          (n)  (pixels)
          (n)% (of window frame)
     border=npixels (hyperlinked?) (-W-CSS)
     alt="short description" (tool tip (-N3)) (ub) (visible while image loading)
     align/inline::= (-W-CSS) (f)
          (inconsistencies abound, especially where different values are near)

          texttop (font - high as it can go)     \ identical
          top     (font - high as it can go) (!) /

          absmiddle (font - center of text range) (!) \ identical
          abscenter (NO) (**N)                        /

          baseline (font - same bottom as non-descenders)               \ identical
          bottom   (font - same bottom as non-descenders)(*IE) (d)(*IE) /
 

          middle (font - center image = baseline of text)     \ identical
          center (**IE) (**N)                                 /

               (~IE middle & center act like absmiddle)

               (~~IE creates long descenders when middle (or center) & bottom
                    are near each other, as if it were reserving space,
                    but then the middled images are placed in the middle of
                    the open space created by the bottomed-image's ascender,
                    and there's a big vertical gap below that line)

               (~~IE absmiddle combined with bottom, absmiddle becomes
                    almost identical to bottom but slightly lower in big
                    picture-size images and higher in small font-size
                    images)

          absbottom (font - low as lowest descenders)                 (!)

          left (picture - picture on left, flow text around on right  (!)
          right (picture - picture on right, flow text around on left (!)
               (~~ overlap possible when right and left images are near each other)

          (to center horizontally, put inside CENTER or DIV:align=center)

     hspace=(n) (pixels) (-W-CSS)
     vspace=(n) (pixels) (-W-CSS)
     name (-W-id)
     ismap (Ms)
     usemap=htmlurl#mapname (Mc) (part after # corresponds to MAP:name)
     lowsrc=imageurl (smaller file version)
     dynsrc=videourl (video,VRML)
     loop=(n) (-1 forever)
     supress (NO) (tool tip alt & image icon)

INPUT (O) (c) (a)
     name (invisible) \ ('name=value' submitted to server)
     value (visible)  /
     type
          text (1 line) (d)  .or. \
          password ("******")     /
               size (visible)
               maxlength (typable)
               autocomplete (IE5O) (suggest while typing)
               name                     \ (name=typedvalue submitted to server)
               value (default for user) /
          checkbox
               checked (initially)
               name         \ (name=value submitted to server if checked)
               value (d ON) /
          radio (multiple choice) (contrast SELECT and OPTION pull-down)
               (to group mutually exclusively: use same names, different values)
               checked (initially chosen)
               name  \ (name=value submitted to server for one chosen)
               value /
          file (user picks local file, uploaded on submit)
               (requires FORM:enctype=multipart/form-data and FORM:method=post)
               name                     \ (name=filepath submitted in addition
               value (default for user) / to the file itself?)
          hidden (from user)
               name  \ (name=value submitted to server)
               value /
          button (contrast BUTTON)
               name                  \ (sent to server as name=value)
               value (button label)  /
               onclick
          reset (clear-form button)
               value (button label)
          submit (send form to server button)
               name                  \ (submitted to server)
               value (button label)  /
          image (custom submit button)
               src=imageurl
               align/inline:... (-W-CSS)
               width/rectangle:... (**IE) (**N)
               height/rectangle:... (**IE) (**N)
               border (**NO)
               name (submits 'name.x=(n)' & 'name.y=(n)' for pixel clicked)
               alt="description"  (ub)
               usemap
               ismap
               (contrast IMG inside A:href)
     id (corresponds to LABEL:for)
     (an INPUT is either inside a FORM or its on-events are scripted)
 
 

LABEL (O) (-N) (-IE3) (c) (click zone for an INPUT control)
     for
          (corresponds to INPUT:id, not INPUT:name)
     (example: <LABEL for=box><INPUT type=checkbox id=box> I luv junk mail</LABEL>
     clicking on 'junk' checks and unchecks the box)

LAYER (absolute) .or. \

ILAYER (relative)     / (?L) (c) ((NO))(nesting means htmlurl contains layers)
     src=htmlurl
     left=(n) \ (pixels, absolute for LAYER, relative for ILAYER)
     top=(n)  /
     pagex=(n) \ relative to browser window
     pagey=(n) /
     z-index=(n) (stacking order, low=below, high=on top) ---.  use one
     above=layerid \ (stacking relationship)             \    > or the
     below=layerid / (corresponds to another layer's id)  >--'  other
     id (corresponds to another layer's above or below)  /
     width/rectangle:...
     height/rectangle:...
     clip=(n),(n),(n),(n) (viewable area, pixel coordinates)
     visibility
          show
          hidden
          inherit
     bgcolor=#rrggbb
     background=imageurl
     (uv contingency is NOLAYER)

Netscape 6 silently ignores the <LAYER>, </LAYER>, <ILAYER>, </ILAYER>, <NOLAYER>, and </NOLAYER> tags and renders the HTML page as if those 6 tags were not present (i.e. as if the file had been edited to remove those 6 tags only). DIV will be rendered, but the SRC= attribute if present will be ignored. The contents of LAYER, ILAYER, and NOLAYER (any tags inside them) will be rendered as content.

For a full set of test cases illustrating the different combinations, see  http://sites.netscape.net/ekrock/tests/matrix.html. Here is a summary of some techniques for achieving cross-browser and backward compatibility:


LI (L) (b) (list item, numbered or bulleted paragraph)
     type/bulleting:... (inside UL) (contrast UL:type) \ /  (~N from here on)
     type/numbering:... (inside OL) (contrast OL:type) / \  (~IE this LI only)
                                                          \ (-W-CSS
     value=(n) (renumbers sequence from this point on) (inside OL) (-W-CSS)
          (contrast OL:start)

LINK (S) (ss) (a) (relationship to a resource) (-N3)
     rel (relationship)             .or. \
     rev (reverse relationship) (-N)     /
          stylesheet
          fontdef (N4O?)
          alternate (used with hreflang, media)
          start (for search engines)
          next
          prev (!) .aka. \
          previous       /
          contents (!) .aka. \ (table of contents)
          toc                /
          index
          glossary
          copyright
          chapter
          section
          subsection
          appendix
          help
          bookmark
          made (--)
          owner (--)
          (defined via HEAD:profile)

     type=(mimetype) (-IE)
          text/css
          text/javascript
     href=(url) (-N)
     media/output::= (-N) (-IE3) (media-specific versions)
          screen /d W)
          print
          all (d IE)
          tty
          tv
          projection
          handheld
          braille
          aural
     target/frame:... (WO) (corresponds to href'd FRAME:name)
     charset=(charset) (WO)
     (inside HEAD)

MAP (Mc) (nva)
     name (corresponds to part after # in IMG:usemap)
     (contains AREA)
     (higher priority AREA's first)

MARQUEE (?A) (c) (IEO) (text in motion)
     bgcolor=#rrggbb
     width/rectangle:... (d 100%)
     height/rectangle:...
     hspace=(n) (pixels)
     vspace=(n) (pixels)
     scrollAmount=(n) (pixels)      (d 6) (higher=faster) \
     scrollDelay=(n) (milliseconds) (d 85) (lower=faster)  \ (speed tinkering)
     truespeed                                             /
          false (smooth)                                  /
          true (accurate)                                /
     loop=(n) (-1 forever)
     behavior
          scroll (d) (around and around)
          alternate (back and forth)
          slide (once)
     direction
          left (d)
          right
          up
          down
 

Note prefer a javascript or a script for compatbility...
 

META (?M) (a)
     name
          robots (search engines)
               content
                    noindex (exclude page's content from searches)
                    nofollow (exclude page's links from spiders)
                    none (robots should ignore entirely)
                    all (searchable and spiderable) (d)
          description \ (for search
          keywords    /  engines)
          generator (software tool)
     content
     http-equiv
          content-type=(mimetype)
               content
                    (mimetype); charset=(charset)
          pragma
               content
                    no-cache
          expires
               content
                    0 (don't cache)
                    "Sun, 28 Dec 1997 09:32:45 GMT" (example RFC850 format)
          refresh
               content
                    (n);url=(url)  (n=seconds delay before jumping to url)
                         (--W-server redirects)
          pics-label (offensiveness rating, www.icra.org)
     (inside HEAD)

NOBR (Y) (c) (no wrap, all on one line) (-W) (-IE3)

NOEMBED (P) (b?) (NO) (uv contingency for EMBED)

NOFRAMES (F) (b?) (inside FRAMESET) (uv contingency for FRAME)

NOLAYER (?L) (b?) (NO) (uv contingency for LAYER)

NOSCRIPT (X-JS) (b?) (uv contingency for SCRIPT)

NOTOUCH (?M) (c) (some editors treat as opaque) (from MiniVend documentation)

OBJECT (P) (c) (a) (e.g. Shockwave Flash)
     (w3 prefers OBJECT over APPLET, but APPLET is more common)
     classid
     code?
     codebase
          (IEO: #n,n,n,n suffix for version information)
     codetype=(mimetype) (of code)
     hspace
     data=(url)
     type=(mimetype) (of data)
     width/rectangle:...
     height/rectangle:...
     usemap (WO)
     (contains PARAM?)

OL ((L)) (b) (numbered list)
     type/numbering::= (-W-CSS) (contrast LI:type)
          1 (d)
          a
          A
          i
          I
     start=(n) (d 1) (contrast LI:value)
     (contains LI)

OPTION (O) (a)
     (inside SELECT)

P (Y) (b) (paragraph, vertical space) (~N may be ignored if empty)
     align/paragraph::= (-W-CSS)
          center
          left (d)
          right
          justify (-N)

PARAM (P) (a)
     (inside APPLET or OBJECT)

PRE (X-TXT) (b) (monospace, white space matters)
     width (WO?)

S (Y) (c) (-W-CSS) (!)
     (STRIKE is more common, also DEL)

SCRIPT (X-JS,VBS) (nva) (uv contingency is NOSCRIPT)
     charset=(charset) (WO)
     defer (-N) (no document.write()'s)
     event (IEO)
     htmlfor (IEO)
     language (-W-type)
          JScript
          javascript
          javascript1.1
          javascript1.2
          vbs
          vbscript
          XML
     src=scripturl
     type (-N) (IE4)
          text/ecmascript
          text/Jscript
          text/javascript
          text/tcl (WO)
          text/vbs
          text/vbscript
          text/xml

SELECT (O) (c) (multiple choice drop-down)
     size=(n) (visible rows)
     (inside FORM)
     (contains OPTION)

SMALL (Y) ((c)2) (--W-CSS)
     (FONT:size=-1 is more common)

SPACER (Y) (b?) (NO)
     type
          block
               width/rectangle:...
               height/rectangle:...
          vertical
               size
          horizontal
               size
     align

SPAN (E) (c) (ss)
     lang

STYLE (X-CSS) (ss) (nva?)
     media/output:... (-IE4)
     (often inside HEAD)

SUB (Y) (c) ((N))

SUP (Y) (c) ((N))

TABLE (T) ((b))
     align (-W-CSS)
          center
          left
          right
     background=imageurl
     bgcolor=#rrggbb, namecolor (-W-CSS)
     border (around entire table)
     bordercolor=#rrggbb, namecolor  (-N)
     cellpadding (margin inside each cell)
     cellspacing (width of border between cells)
     cols (-W) (number of columns) (?strange?)
     width/rectangle:...
     height/rectangle:...
     hspace (NO) (margin outside)
     vspace (NO) (margin outside)
     rules (lines between cells) (-N)
          none
          groups (THEAD,TFOOT,TBODY, COLGROUP,COL)
          cols
          rows
          all
     summary (ub) (WO)
     frame (around table) (-N)
          void
          above
          below
          hsides
          lhs
          rhs
          vsides
          box
          border

THEAD .or. \  (in this order)

TFOOT .or.  > (T) (-N) (nva?)

TBODY      /  (visually groups rows)
     align/cell:...
     valign/cell:... (-IE3)
     (inside TABLE)

TD .or. \

TH      /
(T) (b) (cell)
     (inside TR)
     align/cell::= (f)
          left
          right
          center
          justify (-N) (~~IE)
          char (WO)
               (line up a character in content, like "." in a column of numbers)
     valign/cell::= (f)
          top
          center (same as middle) (-!-middle)
               (tacit support in Netscape -- middle is the default)
          middle (d)
          bottom
          baseline (line up 1st lines of cells in a row) (~~N4) (-!-top)
               (virtually identical to top)
     background=imageurl (-N3) (**N4)
     bgcolor=#rrggbb (-W-CSS)
     bordercolor=#rrggbb (-N)
     colspan=(n) \ (0=all remaining)(WO-HTML4.01)
     rowspan=(n) /
     nowrap (all 1 line) (-W-CSS)
     width/rectangle:... (-W-CSS)
     height/rectangle:... (-W-CSS)
 

TEXTAREA (O) (c) (2D text editor)
     (inside FORM)

TH (T) (b)
     (inside TR)
     bgcolor=#rrggbb (-W-CSS)
     align/cell:...
     valign/cell:...
     width/rectangle:...
     height/rectangle:...

TITLE (S) (W: must be in every document) (browser title bar)
     (not to be confused with title attribute -- tool tip)
     (inside HEAD)

TR (T) (row) (b)
     (inside TABLE, THEAD, TFOOT, TBODY)
     (only contains TD)
     align/cell:...
     valign/cell:...
     bgcolor=#rrggbb (-W-CSS)
     width/rectangle:...
     height/rectangle:...

TT (T) (c) (--W-CSS) (monospaced, TT is more common, also CODE, KBD and SAMP) (!)

U (Y) (c) (-W-CSS) (underline, more common than INS) (!)

UL ((L)) (b) (bulleted list)
     type/bulleting::= (-W-CSS) (contrast LI:type) (-IE3)

          disc (filled-in bullet) (d 1st level)
          circle (outline)        (d 2nd level)
          square                  (d 3rd,4th,5th... levels)
     (contains LI) (~IE case sensitive: "SQUARE" not understood)
 

WBR (Y) (a) (NO) (soft CR)
     (inside NOBR)


 
 

How Do I Upgrade an Existing Web Page That Uses Proprietary Features to Support the W3C Specifications?

Map Navigator 4-only and Internet Explorer-only features to W3C specification features as follows:

excerps of :Transitioning from Proprietary DOMs and Markup to W3C Standards:

Enhancing Pages That Use LAYER, document.layers[], and document.all to Support Standards

by Eric Krock, Group Product Manager, Tools and Components, Netscape Communications

http://sites.netscape.net/ekrockhome/standards.html
Proprietary Feature W3C Specification Feature
Nav4 LAYER HTML 4.0 DIV
Nav4 ILAYER HTML 4.0 IFRAME
Nav4 LAYER SRC=, ILAYER SRC=, DIV SRC= HTML 4.0 IFRAME SRC=
IE3/4/5 MARQUEE HTML 4.0 DIV with content string rotated over time by JavaScript via the DOM level 1
Nav2/3/4/5 BLINK CSS1 text-decoration:blink (Note: user agents are required by the CSS1 specification to recognize the blink keyword, but not to support the blink effect, so CSS1-compliant browsers may or may not make the text blink on the screen. The best approach is to not make content blink at all.)
IE 3/4/5 BGSOUND Use either HTML 3.2 EMBED (which has been deprecated in HTML 4.0 but will still be supported) for backward compatibility with Nav3/4, or HTML 4.0 OBJECT if you only require compatibility with Netscape 6 and IE 5 and above. Most people use EMBED in order to provide backward compatibility with as many browsers as possible.
Nav4 document.layers[] 
IE4/5 document.all 
Nav4/IE4-5 document.elementName		 DOM level 1 document.getElementById()
Nav4 element.visibility = value; 
IE4/5 element.style.visibility = value;		 DOM level 2 element.style.visibility = value;
Nav4 element.left 
IE4/5 element.style.pixelLeft		 DOM level 2: parseInt (element.style.left)
Nav4 element.top 
IE4/5 element.style.pixelTop		 DOM level 2: parseInt (element.style.top)
Nav4 element.moveTo(x, y); 
IE4/5 element.style.pixelLeft = x; element.style.pixelTop  = y;		 DOM level 2: element.style.left = value + "px"; 
DOM level 2: element.style.top = value + "px";
Nav4 document.tags, document.ids, document.classes, document.contextual() 

IE4/5 document.styleSheets[].addRule (selector, declaration);

 Use the DOM level 2 CSS interface to add the appropriate rule to a style sheet in the document's HEAD. For example: 

<HTML><HEAD><TITLE>Demo</TITLE> 
<STYLE ID="ietssxyz" TYPE="text/css"></STYLE> 
<SCRIPT LANGUAGE="JavaScript"><!-- 
var targetStyleSheetID = "ietssxyz"; 

function addRuleToStyleElement (name, selector, declaration) 
{  var styleSheetElement = document.getElementsByID(name); 
    var styleSheetLength = styleSheetElement.length; 
   styleSheetElement.insertRule (selector + " { " + declaration + " } ", styleSheetLength); 
} 

addRuleToStyleElement (targetStyleSheetID, "H1", "font-size:44pt"); 
//--></SCRIPT> 
 
Nav4 handleEvent() W3C DOM Level 2 dispatchEvent()
IE 4/5 element.innerHTML The same effect can be achieved using W3C standards by using DOM methods to set the contents of the element. (Note: because of requests from web developers, element.innerHTML is in fact supported as a DOM convenience extension by Gecko, Mozilla, and Netscape 6. However, developers using this DOM extension should be aware that this is not part of the W3C standards, and by using this they are restricting their content to IE4+, browsers/devices that embed the Gecko browser engine, and any other browser engines that emulate this proprietary IE feature.)
Legacy Feature Feature Supported in Mozilla
Nav4 .jar files for SmartUpdate of binaries 
IE4+ .cab files for download of binaries		 .xpi files to support XPInstall of files of all kinds. See Jar Packaging for more information.
If you have plug-in content that calls a plug-in's Java API from JavaScript via LiveConnect, be aware that the plug-in vendor must upgrade their plug-in to support the Mozilla Plug-in API. Until then, these JavaScript calls within the content will fail silently. Contact the plug-in vendor to find out their schedule for releasing an upgraded plug-in. Mozilla plug-in API documentation: http://www.mozilla.org/docs/plugin.html

Note on W3C DOM2 Reflection of an Element's CSS Properties

See the W3C DOM2 Working Draft (work in progress) section 4.4, Extensions to Level 1 Interfaces. Keep in mind that according to this working draft, the values returned by the style property of an element reflect static settings in the element's STYLE attribute only, not the total "computed style" that includes any inherited style settings from parent elements. Therefore, if you wish to read and write these properties from JavaScript through the DOM2, use one of these two approaches: If you must create a single page that supports both Navigator 4 and Netscape 6, use the following techniques.

How Do I Support Internet Explorer If It Doesn't Support Standards?

If you have web content or a web application that must use proprietary Internet Explorer 4/5 features in order to support Internet Explorer 4/5, the simplest solution is to: If you must create a single page that supports both Internet Explorer 5 and Netscape 6, use a client sniffer (such as Netscape's Ultimate Client Sniffer at  http://developer.netscape.com/docs/examples/javascript/browser_type.html ) to determine which client the code is running on. Then include conditional forks in your code that execute W3C DOM code when running on Netscape 6 and proprietary IE DOM code when running on Internet Explorer.   (With thanks to the folks at Netscape...)
 
 

How Do I  modify my HTML code to the  Support Standards?

N 4 iCab Pre2.2  WebTV Hotjava 3, IE 4 IE 5 IE 5.5 IE 5 Mac Op5  Konq N 6 DOM 1
self.screenX &
self.screenY		 Gives the width and height of a frame or window N 4 ,  ? Konq N 6 DOM 1
self.innerHeight &
self.innerWidth		 Gives the width and height of the entire browser window N 4 iCab Pre2.2  Op5  Konq N 6 DOM 1
self.outerHeight &
self.outerWidth		 Gives the width and height of the entire browser window N 4 WebTV Hotjava 3, IE 5 Mac Op5  Konq N 6 DOM 1
self.pageXOffset &
self.pageYOffset		 Gives the amount of pixels the page has scrolled down or left WebTV Hotjava 3, IE 5 IE 5.5 Op5  Konq N 6 DOM 1
self.screen.height &
self.screen.width		 Gives the resolution of the part of the screen that can actually be used by applications (= entire screen minus taskbars and such) N 4 iCab Pre2.2  WebTV Hotjava 3, IE 4 IE 5 IE 5.5 IE 5 Mac Op5  Konq N 6 DOM 1
document.body.clientHeight &
document.body.clientWidth		 Gives the width and height of a frame or window iCab Pre2.2  WebTV Hotjava 3, IE 4 IE 5 IE 5.5 IE 5 Mac Op5  N 6 DOM 1
document.body.scrollHeight &
document.body.scrollWidth		   IE 4
Lowest position on page		 IE 5
Lowest position on page		 IE 5.5
Lowest position on page		 IE 5 Mac
First-scroll position		   DOM 1
document.body.offsetHeight &
document.body.offsetWidth		 IE 4
First-scroll position		 IE 5
First-scroll position		 IE 5.5
First-scroll position		 IE 5 Mac
Lowest position on page		   Konq

??

 N 6
Lowest position on page		 DOM 1
Lowest position on page

I created functions to handle  the different browsers :
 
 
NE4 IE 4, IE 5, Icab  Opera 4, 5 IE 5.5 IE 6 NE6 Konq
Fget(elem); eval(document.elem); eval(document.all.elem); document.getelemtById(elem);
Fmoveto(elem,x,y);
(with x,y as numerical values)		 elem.moveTo(x,y); elem.style.pixelLeft=x;
elem.style.pixelTop=y;		 elem.style.left=x+"px";
elem.style.top=y+"px";
Fget(elem,x,y); x=elem.left;
y=elem.top;		 x=elem.style.pixelLeft;
y=elem.style.pixelTop;		 x=ParseInt(elem.style.left);
y=ParseInt(elem.style.top);
FShow(elem,view); var inview=(view)?'show':'hide';
elem.visibility=inview;		 var inview=(view)?'visible':'hidden';
elem.style.visibility=inview;		 var inview=(view)?'visible':'hidden';
elem.style.visibility=inview;
FDisplay(elem,view); ------------- var inview=(view)?'block':'none';
elem.style.display=inview;		 var inview=(view)?'block':'none';
elem.style.display=inview;
FsetZorder(elem,z); doument.elem.zIndex=z; doument.all.elem.zIndex=z; elem.style.zIndex=z;

You can help me with performing this simple test :" How do I determine the browser type ? " on your computer and emailing the cotent of the displayed page (with copy and paste) into a single txt mail at ipo3api@advalvas.be
 

Thanks a lot...
 
 


 

Layout

------
TAG
<TAG attribute=value> value param </TAG>
 
 

Terminology

-----------
Redundancy
     (...is more common...)
     (...are more common...)
     (...is more common, also...)
     (...are more common, also...)
     (...more common than...)
     (...more common than..., also...)

Element nesting
     (inside ...)        \ in this
     (contains ...)      / order

Same options
     (required by ...)
     (requires ...)

Same names
     (...corresponds to...)

Relationships & similarities
     (contrast ...)

User control disabled
     (...prevents...)
 
 

Consistencies

-------------
horizontal followed by vertical (as in 8.5x11, 800x600)
     width
     height

     align
     valign

     hspace
     vspace

     colspan
     rowspan

     cols
     rows

order attributes most common or important first

mutually exclusive
     (c)                 e.g. B
     (b)                 e.g. TABLE
     (c) (a)             e.g. IMG
     (a)                 e.g. BR (AREA?)
     (a) (inside ...)    e.g. COL
     (inside ...)        e.g. COLGROUP
     (S)                 e.g. BODY
     (F)                 e.g. FRAMESET
     (nva)               e.g. SCRIPT (not visually anchored)
 

Attribute Classification (complex same-named attributes used by a few tags)
------------------------
attribute/purpose:... (reference)
attribute/purpose::= (definition)

align/inline (*IMG*,APPLET,INPUT:type=image,OBJECT,IFRAME,EMBED,FIELDSET,SELECT)
align/paragraph (DIV,H1-6,*P*)
align/cell (COL,COLGROUP,TH,*TD*,TR,THEAD,TFOOT,TBODY)
align/caption (*CAPTION*,LEGEND)
valign/cell (COL,COLGROUP,*TD*,TR)
valign/caption (*CAPTION*,LEGEND?)

width/rectangle (APPLET,COL,COLGROUP,EMBED,FRAME,HR,IFRAME,*IMG*,MARQUEE,
                 OBJECT,SPACER,TABLE,TD,TH,TR)
height/rectangle (APPLET,EMBED,FRAME,IFRAME,*IMG*,OBJECT,SPACER,TABLE,TD,TH)

frameborder/frame (FRAME,*FRAMESET*)
scrolling/frame (*FRAME*,IFRAME)
target/frame (*A*,AREA,BASE,FORM,LINK)

type/numbering (*OL*,LI)
type/bulleting (*UL*,LI)

media/output (*LINK*,STYLE)
 
 

SYMBOLS

=======

Functional Category
-------------------
(T) Tables
(F) Frames
(I) International or multilingual
     (IC) character sets, Unicode, etc.
     (ID) character direction flow (ltr or rtl)
     (IL) human language support
(L) Lists
(S) Document level structure
(E) Empty of effect, attribute mouthpiece (no effect if no attributes present)
(O) Forms and other interactive devices (e.g. hyperlinks)
(Mc) Image map, client side
(Ms) Image map, server side
(P) Programmed intelligence (often includes (A) and (G) and (DB))
(DB) Database tools (e.g. IE4 Data Binding)
(Y) Style, layout (form over function)
(?) Misc
     (?M) Meta content, outside the scope of browsing
     (?C) Content enrichment (machine-readable)
     (?L) Layers
     (?A) Annoying attention-getter
(G) Graphics
(A) Audio
(X-xxx) Syntax escape, element format is xxx (file extension)
 

Notations
---------
(c) Character level visual displacement
(b) Block level visual displacement (commandeers left and right margin)
(a) Atomic (tag has no close tag, no element content) (attribute has no value)
(( )) Recursive, nestable
     ((N)) nestable only on Netscape
     ((c)2) character level, nestable 2 levels deep (more are ignored)
          So:  (( )1) is the same as ( )
(v) No visible effect, ignored by most browsers, meaning only
(ss) Stylesheet usage prominent
(r) Attribute required in Tag, or Tag required in Document
(f) Figure will show this point
(d) Default value
(d ...) Default value with conditions
(u) Unversal support (braille, etc.)
     (ub) for the blind
     (uv...) for older browsers
...(R) Registered trademark
(?strange?) and mysterious

.or. \  two or more tags have the same attributes (COL, COLGROUP)
     /  two attributes have the same value format (FRAME:cols, FRAME:rows)
        two values, same associations (INPUT:type=text, INPUT:type=password)

.aka. \ two value spellings, functions identical if supported at all
      / (LINK:rel=prev, LINK:rel=previous)
        one is always marked (!) for wider support

Support, Compatibility, Recommendations
---------------------------------------
(-W) Undefined by w3.org or HTML standard
(-W-xxx) Deprecated in favor of xxx / use xxx instead / we may use xxx someday
(--W-xxx) Discouraged (more mild than deprecated) in favor of xxx
(WO) Defined by w3.org only, nobody supports, nobody uses
(NO) Netscape Only
(N#) Netscape support starts with version # (nothing before 3.0 considered)
(-N) Not documented by Netscape
(-N3) Not supported by Netscape 3 or earlier
(-IE) Not supported by Internet Explorer
(IEO) Internet Explorer Only
(IE#) Internet Explorer support starts with version # (nothing before 3.0 considered)
(*IE) Contradicts IE documentation
(**N) Undocumented Netscape feature
(**N4) Undocumented Netscape feature, supported in version 4 and later
(~IE...) inconsistency among browsers and standards, IE is odd man out
(~~IE...) buggy or inconsistent within IE implementation
(~~...) bugginess in all browsers
(!) Common, VisiBone recommends using
(-!-...) VisiBone recommends not using, instead use ...
(!M) Mighty feature, master it
(--) Not defined anywhere but in use, perhaps for an actual reason
 

Value-Type Symbols
------------------
#rrggbb
     #nnnnnn (hex number)
          websafe:  #3366CC
          nonsafe:  #F0E68C
     name
          vganame:  black, white, red
          advname:  aliceblue, ivory, forestgreen
          osname:   activeborder, buttonface, windowframe, ... (IEO)

(url)      any URL at all, as for A:href, AREA:href, LINK:href
imageurl   e.g. ending in .gif, .jpg, as for IMG:src
pageurl    anything that fills a page, often HTML, can be text, jpeg, gif, ...
dirurl     directory url, e.g. http://host.com/, http://host.com/subdir/
submiturl  as for FORM:action, can be mailto
scripturl
dataurl
programurl
audiourl
jarurl     filename.jar
htmlurl#mapname

filename.class
(mimetype) e.g. text/plain
(charset)
langcode
layerid    LAYER:id or ILAYER:id
(n)        positive integer
(tf)       true or false
(yn)       yes or no
 
 

ONLINE NAMING

=============

URL Schemes (server types)
-----------

http://www.on24.com/newsline/channels/top/1.htm?caller=on24&speed=fast
Web
      \__________/ \___________________/ \___/ \____/ \__/ \___/ \__/
 host                                             directory                       file   name value name value
                                          \_________________________/ \____________________/
path parameters, this is the MIME type "application/x-www-form-urlencoded"
                                                 (or free-form stuff)

http://.......................#aname
                               \___/
                               anchor name (corresponds to A:name)
                               scrolls to that point within a page
                               (FrontPage calls it a "bookmark")

https://........                                                            SSL
        \_________
        Secure server access

 Email
mailto:sneed@golf.com?subject=XYZ;&cc=mail2@provider.org;&body="message";
       \___/ \______/
        user   host
       \____________/
        email address

example :
mailto:ipo3api@advalvas.be?subject=A propos du site ipo3api&cc=bs955472@skynet.be&body=votre message pour IPO3API...

clsid:D27CDB6E-AE6D-11cf-96B8-444553540000                               Object
      \__________________________________/
       Microsoft's 128-bit identifier for
       everything in the universe,
       in this case, some form of browser
       intelligence.

ftp://ftp.netscape.com/pub/communicator/complete_install/cc32e473.exe       FTP
      \______________/ \_______________________________/ \__________/
           host                   directory                  file

file://C:/Program%20Files/Real/RealPlayer/videotest.rm                    Local
       \_____________________________________________/                     File
         Operating-system-specific path, except:
                      '\'  -->  '/'
                      ' '  -->  '%20'
         File is on the same computer as the browser.
 

URL Characters
--------------
:   scheme prefix
:   ftp username/password separator
/   path/directory/file separator
?   parameter section suffix
&   parameter separator
#   anchor name suffix
.   filename/extension separator
=   parameter name/value separator
%nn ASCII code nn (hexadecimal)
%20 space ' '
%7E tilde '~'
%47  division bar '/'
%34   quote "
%35  square #
%36   $
%37   %
%38   &
%39    '
%40   (
%41   )
%42   *
%43  +
%44  ,
%45  -
%46  .
%60   <
%61  =
%62  >
%63   ?
 

File name
Extension(s)        MIME type                     Description
-------------------------------------------------------------
.aco                                              Photoshop color swatches
.act                                              Photoshop color table
.ai
.avi                  video
.doc
.exe
.gif                image/gif
.gz
.hqx
.html .htm          text/html
.jpg .jpeg .jpe     image/jpeg
.m3u
.mp3
.pdf
.ps
.ram
.rm
.shtml
.swv
.tar
.txt                text/plain
.wav
.xls
.zip
                    application/octet-stream      Opaque

(charset)
---------
ISO-8859-4
 
 

more info :http://sites.netscape.net/ekrockhome/standards.html
see  NOTES FOR THE VISIBONE HTML REFERENCE
w3c
Css