The Internet Designer’s Dilemma – A Record Aside

With all of the dialogue about separating presentation from
content material (and construction), it’s simple to lose observe of the aim. So
let’s step again, outline our phrases, and try why it

Article Continues Beneath

The most important purpose to separate presentation from the remainder of the web page is
easy: to simplify any change from a slight design adjustment to a
full-fledged redesign. To realize full separation of the
presentation, we should isolate every thing particularly and
solely geared in direction of fashion.

Opposite to what you could be considering, this isn’t
restricted to simply the CSS, not even on a web site like CSS Zen Backyard. It
additionally includes HTML tags and properties that exist solely to offer a
deal with for the designer to use
types to. In any case, what use is a .pageheader {…}
declaration block if there isn’t any aspect with that class on the web page?

Maintain on to this thought and browse on.

The explanation to separate content material from the remainder of the web page is simply as
simple to see as the explanation to isolate presentation. Isolation of content material
makes including or updating issues simple whereas sustaining presentational
consistency all through the location. Nevertheless, as with the presentation,
there will be confusion
over what content material truly is.

For our functions, content material is (normally) textual content and contains accompanying
coding: tags like h1-h6, paragraphs, listing, em, robust,
code, cite, and so forth. Content material mustn’t require any further
presentational tags or types in an effort to absolutely convey its

In remoted circumstances, we would use further tags to extra
appropriately current the content material. For instance, a poem — the place
particular line breaks are vital — might be set aside by a
<pre class=“poem”> tag, or it may merely make use
of <br> tags to interrupt traces.

Right here’s the place issues get sticky. To start with, what’s
construction? We may describe construction as every thing that makes up
a web page, minus presentational components and content material. Nevertheless,
that is at finest an excessively simplified definition that might simply
trigger undue confusion.

Take the navigation menus on ALA for instance:

  • Change a coloration right here, a border thickness there, and you’ve got a
    change in presentation.
  • Change the textual content of the primary navigation merchandise from “Up
    entrance” to “Residence”, and you’ve got a change in
    content material.
  • Lastly, you’ve the <div id=“thực đơn”>,
    <ul>, and <li id=”…”> tags
    because the construction. Swap these out with an vintage row of desk cells,
    and you’ve got a change in construction.

However wait — keep in mind what I identified earlier? These tags
presentational components: the IDs. As each Doug Bowman and Eric Meyer have identified,
presentation is pointless with out construction. Moreover, I’ll
present that
it’s additionally pointless to attempt to separate construction from content material.

Take the only instance of net content material you’ll be able to consider:


Lorem ipsum dolor met.

The <h1> and <p> tags are clearly
a part of the content material, proper? We will’t write appropriate HTML content material
with out this fundamental semantic markup. But this markup can also be a part of
the doc construction, dividing up an otherwise-uniform blob of phrases
right into a heading and a paragraph. (And naturally, if you wish to get
choosy, you’ll be able to take into account the markup to even be part of the
presentation as properly. In any case, the browser has a preset approach of
displaying <h1> and <p> textual content,
doesn’t it?)

So the place does this go away us?

Content material and construction#section6

You may theoretically separate content material and construction, however you then’d be left with <ul><li>

for construction and plain featureless textual content for content material. For sure, constructing a practical web site out of these is kind of unimaginable.

So we will conclude that construction can’t and shouldn’t be separate
from content material.

Presentation and construction#section7

As we have now seen, with out structural components, there isn’t any strategy to apply
styling to the content material. Construction can’t be separate from presentation
— nor ought to it’s.

Which leaves us with …

Presentation and content material#section8

Though presentation nonetheless relies on construction, a few of which is
embedded into the content material as famous above, presentation can and may
be separated from content material.

And whereas main presentational adjustments can require adjustments in
content material will be modified with none want for structural change
past the already-embedded structural components.

Actual-world separation instruments#section9

With all this in thoughts, let’s envision the proper web site
separation system.

It will retailer content material in a database, permitting the isolation and
of content material data. Presentation and construction can be dealt with
collectively; presentation
might be managed with a stylesheet and accompanying structural components
the place wanted.

Construction would finest be handled by way of a system of
template “packages” constructed utilizing a server-side scripting
language (resembling PHP or ASP). Every template “package deal”
may have a number of stylesheets (e.g. CSS Zen Backyard), however each
template “package deal” would hook up with the identical with the identical
database to
retrieve content material for show.

Many content material administration programs present various ranges of this sort of
template help. Nevertheless, full-featured template programs that make CSS
Backyard-like utilization of stylesheets — particularly ones that include
a complete content material administration system — are few and much

However for a reliable webmaster, constructing one thing like this from
scratch can’t be all that arduous. Can it?

Leave a Comment