sensory aspects are what users encounter first
(as long as the download time isn't so great that they give
up and go away), and you want to make a good first impression.
You can do a great deal without massive graphics.
Our home page's only graphics are the banner ads
and a very lightweight background image (3 kbytes);
it should load in less than 10 seconds on a 14.4k modem.
The visual effects are all achieved with font and table cell
colors, or
style sheets if your browser supports them.
It instantly exposes the site structure and doesn't force the user to
`click here.. and now here.. and now here..'
before they reach what they want.
Page Layout
Until
style sheet
capable browsers become widely deployed,
tables are the only realistic method for layout.
They were not originally intended for this purpose,
but rather for the display of tabular data, e.g. tables of numbers.
And you may well find that precise sizing is difficult to impossible,
though there are some tricks and workarounds, such as
using very small, possibly transparent, gifs as spacers.
Graphics-intensive tables can take a considerable time to download and
render. There are quite a few major sites whose download time suggests
that the designers have not tested with slower modems and computers.
The muscles controlling the eyes during reading, i.e. scanning left to
right (or vice versa) tire sooner when the angle subtended by the text
being read exceeds a certain threshold. This typically corresponds to a
few inches of text such as normally found in books and other printed
media. Browser windows are usually open to a much greater width.
So for text-heavy pages it's less strenuous to read if the text is
constrained to a few inches width. This can be done using
columns or margins, using
tables.
The conventional placement for margins is on the left side of the
window. Right-hand margins are unusual - and until recently I thought
there was no particular reason for choosing one over the other, apart
from convention. But now I believe there are several good reasons for
preferring right-margins.
The problems with left-side margins are:-
If the user's window is narrower than the page width, the right side of
the page is clipped; the text needs to be moved back into view using
the scroll bar. However if it's the margin it's less of an annoyance.
Non-graphical browsers (Lynx; HTML-to-speech; etc) will usually render
the margin contents first - which are often a substantial amount of
navigation stuff. The user will be forced to skip over a bunch of junk
before they reach the content.
Search engines typically give greater weight to keywords in the earlier
part of the page; again, navigation margin contents appear first and
skew the results because they relate to other pages than the
present one. Also search engines often display the first part of the
page in response to user queries. Navigation menu contents are not much
help...
Also in favor of right-side margins is the fact that the vertical
scroll-bar is usually on the right, so it's more convenient for the
user - less mouse-travel - if the navigation menu is nearby.
In support of this, we note that
one survey
shows a greater click-through for ads placed to the
right side of the page.
seasons ago when I was writing about
tables, I said
"Tables are the major new addition of HTML 3.0. They have been
eagerly anticipated by many, not only for the desirable capability
of organising tabular data such as statistics by row and column,
but especially for the feature of laying out any elements of the
HTML language.."
Those exact same sentiments are now applicable to style sheets - only
more so. Not only is page layout better addressed with style sheets,
but other cosmetic issues such as fonts and color are too.
If you view this site with a style-sheets supporting browser, you'll
find several interesting effects - most notably in the navigation menus.
The use of style sheets should go a long way
towards relieving web developers of the limitations of HTML for
presentation purposes, for which it was never intended.
HTML was wonderfully simple when NCSA's Mosaic
for X ignited the web explosion; it was meaningful then to talk about
document structure as represented by headings and lists.
Now our HTML coding has become obfuscated by complex tabular
arrangements attempting to achieve the layout of menus and navigation
bars, white space, pull-outs, and so on. Which can be a nightmare for
maintenance, and for software agents trying to translate web pages to
speech for the blind, or search engines trying to identify the real
content of your site (do software agents have dreams and
nightmares ?).
We are as guilty as anyone; we didn't want to
look like relics of a bygone era, and after all, our users could
reasonably expect that we actually use and illustrate the
current state of web technology that we talk about.
Style sheets will allow us to separate out the cosmetic issues from the
structural issues. HTML was never intended to be a DTP language.
There'll be a transitional period while we get used to style sheets,
and wait for browsers to implement them properly. In the interim our
HTML code will be at the peak of complexity; after that I hope and
trust that it'll again be possible to look at HTML code, and see at a
glance the structure of its content.
Multimedia
The web
was originally a text-only medium; the H in
HTML standing for "hypertext", not
"hypermedia".
In 1993, Marc Andreessen and Eric Bina added the
<IMG>
tag to their Mosaic for X Windows
browser - and fueled the web explosion we're still witnessing..
As well as pictures, one can also experience sound and movies.
Nobody has yet invented the "scratch and sniff" monitor, but..
Two further developments are "streaming", which allows playback to
begin before the files are fully downloaded; and three-dimensional
presentations of sound and scenes.
The major impediment to multimedia on the web has been
bandwidth - the rate at which data can be transferred to the
user's browser. Until recently, most users had only a 14.4K modem,
which was not really adequate for sound or video. 28.8K marks the lower
end of the useful multimedia bandwidth range, and if you want to design
your web site to reach these users, you will need to be cautious in
your use of bandwidth. In particular, you should avoid gimmicks on your
home page that may cause the user to wait more than a minute.
Simply announce on your home page that you do have some really
cool Java, Shockwave, VRML, or whatever, and
here are the links...
"I really don't hate Java. I just think that 95% of Java-enabled Web
sites are interface blunders built on top of architecture disasters."
