Header, Footer, and Sidebars

David Norris (kg9ae@geocities.com)
Tue, 25 Nov 1997 21:22:52 -0500


From: "David Norris" <kg9ae@geocities.com>
To: "W3C Style List" <www-style@w3.org>, "W3C HTML List" <www-html@w3.org>
Date: Tue, 25 Nov 1997 21:22:52 -0500
Message-ID: <01bcfa12$32871480$3c009696@kg9ae.dyn.ml.org>
Subject: Header, Footer, and Sidebars

    Has anyone worked on including some means for creating dockable headers,
footers, and sidebars in HTML or CSS?  A dockable header, footer, and
sidebar would be helpful for HTML accessibility and backward compatibility.
This can be visually accomplished with frames, currently.  Frames, however,
offer no backward compatibility, or, forward compatibility with a host of
specialized user agents.  (i.e. Frames work when you can see them, but not
when you can't.  The NOFRAMES element is not a suitable alternative as it
requires tons of code duplication.)  A dockable portion of text could solve
the compatibility problem and eliminate the need for frames in most cases,
as for most implementations of frames, to date, have been used for
navigation aids.  As far as implementing this in a new graphical user agent,
it could simply map the docked elements to a framed display.  Framed or
segmented displays can be very useful, but, frames don't work well.  The
docked blocks should probably wrap if they are crowded for space.  For
example: Two left aligned, docked blocks with 50% height would be one above
the other.  Two left aligned, docked blocks with 100% height would be side
by side.  Another thought, the dockable portions should probably not allow
for included HTML from a file.  This requires some code duplication, but, we
would be fighting the backward compatible and non-accessible problem of
current frames.  I have included two examples, one HTML and one CSS.  It
would probably be better implemented in CSS using the DIV element for block
selection.  Either way, here is a bit of code that I hope will demonstrate
my thought.  I have omitted unneeded information, only docking is in detail.

-Sample HTML docking-

<HTML>
<BODY>
<DOCK ALIGN="LEFT" TITLE="Navigation Bar" Width="10%" HEIGHT="100%">
<H2>Other Pages</H2>
<P>
<A>Some Link</A>
<A>Some Link</A>
<A>Some Link</A>
<A>Some Link</A>
<A>Some Link</A>
</P>
</DOCK>
<DOCK ALIGN="TOP" TITLE="Where am I, and, how do get somewhere else?"
Height="1%" WIDTH="100%">
<H1>Some really great web</H1>
<P><A>Some Link</A> | <A>Some Link</A> | <A>Some Link</A> | <A>Some Link</A>
| <A>Some Link</A></P>
</DOCK>
<P> This text is not docked.  It is located to the bottom and right of the
docked text.  It is free to go where it wants.</P>
</BODY>
</HTML>

- Sample CSS Docking -
<HTML>
<HEAD>
<STYLE>
DIV.DOCKLEFT {DOCK: LEFT 10% 100%;}
DIV.DOCKTOP   {DOCK: TOP 100% 1%;}
</STYLE>
</HEAD>
<BODY>
<DIV CLASS="DOCKLEFT" TITLE="Navigation Bar">
<H2>Other Pages</H2>
<P>
<A>Some Link</A>
<A>Some Link</A>
<A>Some Link</A>
<A>Some Link</A>
<A>Some Link</A>
</P>
</DIV>
<DIV CLASS="DOCKTOP" TITLE="Where am I, and, how do get somewhere else?">
<H1>Some really great web</H1>
<P><A>Some Link</A> | <A>Some Link</A> | <A>Some Link</A> | <A>Some Link</A>
| <A>Some Link</A></P>
</DIV>
<P>This text is not docked.  It is located to the bottom and right of the
docked text.  It is free to go where it wants.</P>
</BODY>
</HTML>

-End sample-

,David Norris
World Wide Web - http://www.geocities.com/CapeCanaveral/Lab/1652/
My Home's Web - http://kg9ae.dyn.ml.org/
ICQ Universal Internet Number - 412039
E-Mail - kg9ae@geocities.com