Tuesday, December 15, 2009

Framing Your Web Template

Every web template has a certain
amount of structure. I call
this structure framing.

If you've recently seen a wood
house under construction, you
may have noticed that one of the
first stages of construction is
framing the house.

Carpenters that frame houses are
called framers.

Basically, they put a lot of 2 X 4
lumber pieces together to form a
frame. That's primarily what they
do.

The whole house hangs off of the
frame. Without the frame, the house
would collapse

Web templates also have frames.

Without a frame, a web template will
collapse mostly because you have no
place to hang things.

The frame of your web template provides
you a place to put things.

Here I may be confusing you. There's
something in HTML called frames.

Frames is a specific feature of HTML.
I'm not talking about frames in the
sense of HTML frames.

Rather, I'm talking about the boxes
that make up your web template.

A synonymous term for frame structure
might be box structure.

The frame structure of your template is
really the box structure of your
template.

Web templates, no matter how successfully
you disguise the fact, consist of a
series of boxes stacked on top of each
other.

That is to say, HTML-based templates are
nothing but boxes.

There's no getting around it. If you are
going to make an HTML-based template, you
are going to be creating a lot of boxes.

You can resist this but you can never get
around it.

It's true that there are techniques for
softening the hard lines of boxes and
there are techniques for making one box
intrude into another visually.

Yet, you never get away from boxes in
HTML. Never. It is always part of the
underlying structure.

OK. Back to framing. The box structure
of your template is what I call the
framing of your template.

Here's how I suggest you choose a frame.

Visit websites and look at their
navigation. See where the navigation
is and then study the frame of the website.

Generally speaking, framing is, in
large part, determined by navigation.

The navigation of a website is,
quite simply, the main links for
that website. Navigation is important.

Without good navigation, your website
will be a nightmare to understand.
Without good navigation, your web
visitors will never make it beyond
the first page they visit on your site.

So much of the framing of a website is
determined by the navigation.

Is the navigation on the left? Then you
are likely to have a long vertical box on
the left with the navigation going from
top to bottom on the left.

Is the navigation on top? Then you will
likely have a box on top with links that
go from left to right.

For lack of a better way to express myself,
I'll call one vertical navigation and the
other horizontal navigation.

Horizontal navigation has the advantage
that it is so easy to find. It's right
on top.

I'd say more often than not, most websites
utilize horizontal navigation.

However, there is one severe disadvantage
to horizontal navigation and that is it
doesn't allow for expansion.

With horizontal navigation, you are pretty
much stuck when you run out of horizontal
space.

Vertical navigation solves this problem.
With vertical navigation, you can expand
at will.

In some ways, the limitations of horizontal
navigation are also its advantage. Since
horizontal navigation only allows you so
many links, it forces you to think very
carefully about what you consider to be
the major links on your site.

OK. Back to framing.

The frame of a website is largely
determined by the navigation for
that website.

This is to say, the box structure of the
website is largely built around the
navigation for the website.

What kind of box does the navigation
fit into? What does the box surrounding
the navigation look like?

You should ask yourself these questions
when studying the framing of a website.

More later.

Ed Abbott

No comments:

Post a Comment