| Converting a Large Web to a DWT-based Web
If you and others are editing a large web (well over 50 pages) with
complex navigation and interactive features, there are some strategies that
can be employed to make it easier to maintain the web. This section of the DWT Browser help file is a strategy guide to a successful conversion to a
large DWT based
web.
Definitions and Concepts
Lets start with some definitions and the concepts behind them:
 |
DWT - A master template for any
page that defines the design of the page and editable and non-editable
regions of the page. The ideal DWT would preserve the users content and
yet allow him to easily change the look of the web site. |
|
Editable Regions - Regions or
areas on the page that are set by the DWT to be editable on a
page-by-page basis. The information in an editable region is preserved
even when a new DWTs have been attached to the page. Everything else on
the DWT would be considered a non-editable region and would be replaced
when a new DWT is attached to the page. |
|
Attached DWT - An attached DWT
defines the look of the page that it is attached to and regions on the
page that can be edited on a page-by-page basis. When changes are made
to the DWT, any changes in the non-editable regions of the DWT are
copied to all attached pages. |
|
Page Editing - The process of
editing a page that has an attached DWT to the page. The
Page Editor can only modify the editable regions of the page.
|
|
DWT Editing - The process of
setting up the master DWTs and attaching them to the pages of the web.
It is common for the Webmaster to use several variations of a DWT to
support the various page types in the web site. |
DWT usage considerations
Here are a couple of things to consider when developing DWT based web:
| What regions of the page will stay the same from page
to page and section to section. |
| What regions of the page need to be different from
page to page and section to section. |
| What regions of the page need to be protect from the
page editor. |
Things for non-editable regions
Here are some regions of the page that will likely stay the same for the
entire web:
| Copyright, author and trademark info |
| Company name, tagline and logo |
| Global navigation bar |
| Global notices for the entire web. |
| Global client-side or server-side scripting code
or include files |
These are items that you will want to place in
non-editable regions of the DWT.
Things that would dictate multiple DWTs
Here are some things that you might want to vary from section to
section of the web site.
| Section navigation |
| Section level side panels |
| Pages with special client-side or server-side
scripting code or include files |
To illustrate: the support section might need
a different menu and text in a side panel than the Public
relations section of the web. Items like these might dictate
multiple DWTs for each section of the web, for example: a DWT
for support and another DWT for the Public Relations section of
the web.
Things that will change on every page
The content area and page level navigations will need to be
changeable on every page.
| Main content area |
| Page banner |
| Page level navigation |
| Keyword and Description meta tags |
| Page specific client-side or server-side
scripting code or include statements |
These items would be contained in DWT
editable regions. Remember, editable regions will not be
changed when you attach a new DWT, meaning if elements of
the editable region need to be updated on every page, the
you will have to open each page and make those changes
manually. This is why you want to be prudent with how many
editable regions you use in your DWTs.
The setup of the DWTIG compliant DWT
When moving from one DWT to another, the
mapping between regions can be complex and therefore information /
formatting maybe lost when attaching a new DWT to a set of pages. To
make it easier to interchange DWTs on your web, a Consortium of
designers have come up with the Dynamic Web Template
Interchange Guidelines (DWTIG) so that you can change the look of your web
in just seconds. The DWTIG is an open standard (freely available at DWTIG.com) that any designers can adopt to facilitate the
interchange of DWTs by setting a simple naming convention for the
editable regions of the DWT. The intention of this standard is to
facilitate a market for DWTs that are easy to use so you can easily
change the look of your web as often as you like. Outlined below are
editable regions of the typical DWTIG DWT:
Sample DWTIG Compatible DWT
|
Definition of
DWTIG Editable Regions |
|
Region Name |
Region Characteristics |
|
doctitle |
The Title of the Page - this is what
appears in the uppermost left status bar of the
published page. To edit this and the following two
regions, right click over the body of the page and
select Page Properties. Fill in your own
information for the Title, Page Description, and
Keywords fields. You will want to do this on each
page. |
|
keywords |
Keywords for your Page/Site;
important for search engine spidering purposes. To
edit, see instructions above for "doctitle." |
|
description |
Description of your Page/Site;
important for search engine spidering purposes. To
edit, see instructions above for "doctitle." |
|
scripting |
Location for any coding (asp, java
script, etc.) which requires placement within the
<HEAD> </HEAD> tags of the web page. |
|
banner |
Name of the Page Being Viewed - you
may either use the "text" banner provided with
FrontPage or type in the title manually. |
|
sub_menu |
Secondary Navigation - uses FrontPage
navigation structure link bar; depending on the
location of the page in the FrontPage navigation
structure, this will be set to either "Child" or
"Same" level. Default is "Child" level. |
|
body1 |
Main Content - in a 2 or 3 column
layout, this content will appear in the widest
content column. In a 1 column layout, this will
appear first. |
|
body2 |
Secondary Content - in a 3 column
layout, this content will appear in the left
column. In a 2 column layout, this content will
appear in the smaller of the two columns. In a 1
column layout, this content will appear directly
beneath the body1 editable region's content. |
|
body3 |
Third Level Content - in a 3 column
layout, this content will appear in the right
column. In a 2 column layout, this content will
appear directly beneath the body1 editable region's
content. In a 1 column layout, this content will
appear directly beneath the body2 editable region's
content. |
|
special1 |
Place for an applet or anything else |
|
special2 |
Place for an applet or anything else |
If the attached DWT is DWTIG compliant, it
will be easy to attach any other DWTIG compliant DWT.
Overview of DWT Setup process
Here are some steps you might find useful in setting up
your DWTs and their editable regions.
Step 1: Decide how many different DWTs
you need to support the different sections of your web site.
Step 2: Determine what editable
regions you want to keep in the standard design to support
the editable regions on a page to page basis.
Step 3: Make a copy of the master DWT
and edit it to add all the static info elements on the page.
For example; copyright, company logo, company name, etc.
Step 4: Remove any editable region
that you are sure you will not want to modify on a page by
page or section by section basis (see below). Test your DWT
on single pages, undoing the changes after the test.
NOTE: Removing editable regions will make your web
non-compliant with other DWTIG DWTs meaning you will have to
perform a manual mapping of regions when you apply a new
DWT.
Step 5: Make a new copy of your new
master template for each section of your web and name them
appropriately. Step
6: Edit your section DWTs, initialize your editable
regions and test the DWTs on single pages, undoing the
changes after the test.
Step 7: Attach DWTs to section pages
carefully. Step 8:
Bring up individual pages and customize editable regions
where required.
Removing DWT editable regions
To remove an editable regions, select the
Format->Dynamic Web Templates->Manage Editable Regions...
menu item. The Manage Editable Regions dialog will appear.
Manage Editable Regions dialog
Select a region in the dialog and press the
"Remove" button. Press the "Close" button to close the
dialog. |
