If you use Microsoft's FrontPage, you may be familiar with these
features already. If you aren't, I hope this page helps.
FrontPage is designed to be best used in a total MS environment.
That is, a high-bandwidth intranet running the Windows NT (or Windows 2000)
operating system where everyone is using the latest version of Internet Explorer
only. In this environment, web makers can do really kewl wizbang stuff.
Employees can move in and out of Word, PowerPoint, FrontPage, Excel, and Access
almost seamlessly. However, it's not reality.
I'm preparing you for a public computing environment. That is, the low-bandwidth
Internet running on several barely compatible operating systems (mostly Unix or
Linux for servers and Windows 95 /98 for browsers, plus some Macs) where most
people are not using the latest version of Internet Explorer. They are using
older IE, or Netscape's Navigator, or one of the many dozen different browsers
that visit Ricci Street each month.
This is not the time or place to debate Microsoft's marketing strategies.
MS Office, including FrontPage, are the software applications
you are most likely to find on the job. That doesn't mean you should blindly
accept them. If you do, you risk not communicating well and looking bad.
Similarly, just because you can install $400 sub-woofers in your new $30,000
muscle car and thus push your favorite bass line out the open car windows for a
two-block radius while driving 80 miles per hour doesn't mean that you should do
that on your way down Parkside to Medaille. Try this line on the cop who stops
you: "Gee, Officer, why would they make the car able to go that fast if
I'll never use it?" For best results, try that line of defense on the
judge.
Meanwhile, back in reality ...
The setting options described on this page should be available
in FrontPage 97 and 98, but the specific menus and options here illustrate
FrontPage 2000.
Learn more about guides and tutorials
to FPage 2000 and FPage 2002.
Tip | To see the screens shown on this page, pull
down the Tools menu and choose Customize, Web Settings, Options, and Page Options.
a note about the screen shots
I made the screen shots with Paint Shop Pro. The color scheme of
gray and teal is the Windows color combination I chose from the Appearance
options at Start | Settings | Display (or right-click on your desktop and choose
Properties). Yours will probably look different, but the content of these
screens will be the same.
To speed the loading, I reduced the size of these screen shots.
They're best used only to help you identify that you are looking at the correct
menu while you're optimizing your own copy of FrontPage.
Tools | Customize ...
The Customize Commands menu lets you change the icons appearing
on your toolbar. In the screen shot on the left, the the Standard toolbar
(the middle one starting with the white page icon and to the right of it the
open yellow folder icon) is embedded into the upper area.
See that gray vertical bar on the left edge of the three bars?
When you hover over one, your cursor will change, probably to crossed arrows.
You can then drag that toolbar elsewhere in the upper area or completely detach
it and let it float anywhere on your screen. You can also change its size, as in
the right-hand screen shot.
Customize Toolbars
When you're learning FrontPage, this set of three toolbars -- Standard,
Formatting, and Menu Bar -- will show icons for the commands you
use most frequently. If you use tables often, you might want to check Tables,
too.
Not recommended
The DHTML Effects toolbar is for wizbang interactivity.
Learn how to make static pages first.
The Navigation toolbar is for FrontPage's borders
feature, which I recommend not using.
The Pictures toolbar will appear automatically whenever
you select an image in Normal view. I recommend not using it at
all; use a graphics editor like
Paint Shop Pro instead.
The Positioning toolbar gives you options that won't work
in older browsers or in any Netscape browser, version 4 and earlier and only
partially in Netscape 6.
The Reporting toolbar might useful when you are working
on very large webs. The same option is on your Views bar on the far left of the
main FrontPage interface.
The Styles toolbar is a complicated way of doing what
you're better off doing with a separate style sheet. Many of the style options
are Microsoft-specific and won't work in other browsers.
Customize Options
As shows above at the beginning of this Customize section, you can
move the toolsbars wherever you want on the toolbar area. You can even float
them anywhere on your screen. To the option to have them share one row by
default doesn't do much for me, personally. I leave it unchecked.
I think it saves a little time to have the menus show recently
used commands first.
I also think that listing the font names in
their font is very handy. On the left, you'll see an example of a ScreenTip. It
says Hyperlink. The screen shot doesn't show the cursor, but when I hovered the
cursor over the blue globe and chain link icon, the ScreenTip appeared. This one
also shows the shortcut keys, which will help you learn them.
Tip | A font you select will show on the user's
browser only if that font is on the user's computer.
Tools | Web Settings ...
Of these six tabs, only two -- General and
Advanced -- are worth noting while you're learning FrontPage. I never use
the others -- Parameters, Language (the default of English is best
for me), Navigation, and Database.
General
After you have started a web, changing its name within FrontPage
isn't as easy as changing the name of a folder or page, for which you just click
on the name in the Folder List. This General tab gives you the way to change the
web's name.
Advanced
If you check the option as I have above, you'll see
file folders that start with an underscore, such as _private and _borders and
_themes. This is where FrontPage keeps some of the code that it's trying to hide
you from. Because I recommend that you not use the features that
need that special code, you won't need these hidden directories. By
choosing the Show option while you're learning, you can be aware of them and
check to make sure you aren't using them.
Tip | When you FTP pages to the server, you do not
need to transfer any of these hidden directories.
Some of you will need the JavaScript before the MBA 604 course
is over.
FrontPage is always making temporary files of whatever page
you're working on. The new page won't really replace the old page until you save
it. Even after you do, you can sometimes recover lost work by mining the
temporary files directory. On the other hand, if you're pressed for space on
your hard drive, deleting them can help.
Tools | Options ...
Note: You won't need the Reports View until
you're constantly updating a large web.
General
Looking at the screen shot on the left below ...
In the Startup list, you want FrontPage to be your
default editor. It will save you many clicks over the course of time.
In the General list, the status bar is the narrow
horizontal band across the very bottom of your FrontPage main interface. If you
are in Normal view and hover your cursor over a link, the page you have set the
link to will display at the bottom left of the status bar. Try it and see
whether you find it useful.
The three warnings are related to the special code features that
I recommend you don't use, especially while you're learning FrontPage. If you
follow that recommendation, it won't matter whether or not you have checked
these warning boxes.
Configure Editors
Looking at the screen shot on the right above ...
When you double-click an image file in FrontPage, chances are it
will open in Image Composer or PhotoDraw for editing. But what if you don't use
one of those programs? Or what if you'd rather just have the image file open in
Internet Explorer so you can see what it looks like?
The five types of files you are likely to encounter are htm, html, css, gif, and
jpg. For the two HTML file extensions, I use FrontPage. For style sheets (css
stands for cascading style sheets) I use Note Tab instead of Notepad, which
would work just as well. For the two image formats, gif and jpg, I use Paint
Shop Pro and recommend that you do, too.
Modifying editors
Highlight the one you want
to change, as I highlighted htm above. Then choose Modify..., which should show
you this screen.
Type in the new name and choose Browse... to navigate to the
editor's .exe file on your hard drive. Click OK three times to close all open
dialog boxes.
Tools | Page Options ...
Of these six tabs, four need adjusting. For the other two, you
don't want to use the Auto Thumbnail for the same reason you don't want
to use the Picture toolbar above. Don't ask the browser to resize images; it
makes lousy decisions. Make a separate thumbnail with an image editor such as
Paint Shop Pro.
As long as you're using English, the Default Font doesn't
matter. You'll use style sheets to determine the font.
General
Looking at the screen shot on the left below ...
I check the DIV and Span tags option for greater compatibility
with older versions of Netscape's browser. Checking the second one --
automatically enclosing form field -- will save you some clicks when you start
using forms on your pages.
Checking the spelling option will put the red squiggly underline
under words not in the software's dictionary, regardless of whether it is
spelled correctly. It uses the same dictionary and the same process as other
Office products use. For example, URLs and domain names and probably not in that
dictionary, so they'll all get flagged. If you find that annoying enough, leave
this unchecked.
Compatibility
Looking at the screen shot on the right above ...
Don't get me started on the incompatibilities among the browsers.
Suffice it to say that the same page can easily look quite different with the
two major browsers and their various versions. Unless your web will be viewed
behind a firewall on an intranet, you want to make your pages as good looking as
possible in both. The choices here for Browsers, Browser versions, and Servers
will only enable or dim out various technology options below. Leaving them on
custom as I do lets you choose whatever combination of the nine technologies you
want. If you want to learn more about why I recommend the six I checked, please
email me because the explanation is too technical for this page.
Color Coding
In HTML view, this color coding makes it a lot easier to learn
to read HTML. The color scheme above is the one I use. Thus it's the one that I
take screenshots of. It's also the one I use on pages like Let's
Get Geeky. You should use whatever makes it easiest for you to read.
HTML source
HTML has a couple of
features that make it easier to read.
It is
not case sensitive. Thus <P> and <p> and bgcolor and bGColOR are the
same thing.
While spacing within
a tag pair matters, spacing between tag pairs doesn't matter.
In HTML view, FrontPage will space it any way you find it
easiest to read. In addition, it will save the HTML code only (not the text that
will display on your page) in several different ways. I cut and paste code from
other pages that use their own patterns. Thus I have not checked preserve
existing HTML above. I want FrontPage to save and display it all the same way.
Experiment to see which settings work best for you.
You may be just as happy with the default settings, which is
what the Reset button is for on the lower right.
FrontPage Views
When you're working in FrontPage, you have a complex
screen in front of you. If you understand the history
of this software -- way back to Vermeer Technologies -- you'll realize that
FrontPage combines two previously separate pieces of software. One was a page editor. The other was a web
manager. Through FrontPage98, they were still separate.
Now they're combined -- the web manager in the Views and
Lists area and the editor in the usually larger area to the right, not shown in
the screen shot on the left. I say usually, because you usually work in Page,
the top of the views on the list at left. For a small web, some of the web
manager functions aren't worth the trouble.
For a large web like Ricci Street, however, the web manager is
very useful. For example, if I change the name of one page on the Folder List
(see screen shot on left), the web manager will change the name of every
link to this page everywhere on Ricci Street.
Without
fail and without error. That's very useful.
You should explore the various views. The screen shot on the
right shows just one very small section of the very complex Hyperlink view of
Ricci Street.
The folders list above left will look similar to what you'll
find on the server. Except for a few folders and files, what I have in my C:\Windows\Desktop\riccistreet\
folder is exactly what I have on the server in North Carolina.
For instructional purposes, that structure also mimics the
hierarchical structure of the site map and the mental map that I have of Ricci
Street.
As you get to know your way around Ricci Street better, that
mental map moves from my head to yours. Yours gets increasingly more accurate.
The web editor has three views: Normal, HTML, and
Preview. Normal view is where you do most of your work. HTML view is simply a
Notepad-like ASCII editor built into FrontPage and color-coded,
if you wish -- and I recommend. Preview view shows you what the page will look
like in Microsoft's browser. I've noticed some very minor slight discrepancies,
so you may want to pull down the File menu and select Preview in Browser, which
will also let you look at the page in Netscape or any other browser installed on
your machine.
Flipping back and forth between HTML view and Preview view is
exactly like what we did when we first coded HTML by hand in Notepad, save it as
an .htm file, and then re-freshed the browser to see it. The only difference
here is that both functions are embedded within FrontPage.
TV Dinners -- Front Page DON'Ts
Let's say that making your own webs in FrontPage is analogous to
making your own dinner in your kitchen. You can go to the grocery store and buy
the ingredients and bring them home. Similarly, you can write the text and
acquire the graphics and bring them into FrontPage.
Microsoft makes it very easy to "cook" the equivalent
of a TV dinner. Such a dinner is easy to spot even if you take it out of the
little containers and serve it on your best china. It still looks and smells
like a TV dinner.
Some simple rules will keep your webs from looking and
smelling like a FrontPage web. No do's, only don't's.
In the Format menu (on the right), don't use themes,
shared borders, page transitions, or any kind of styling.
In FrontPage's Insert menu, don't use navigation
bars or page banners or any of the Components (on the left).
Don't copy and paste from Word without washing out the proprietary
tags in a text editor.
Don't use the Save As HTML options in any Office product,
especially PowerPoint.
Don't use FrontPage's Publish Web feature. Use WS_FTP or
CuteFTP or SmartFTP instead.
Check your code for uses of the word "bot", short for
robot, as well as a stylesheet reference to /_themes/ and a form tag reference
to /_derived/nortbots.htm. These directories that begin with underscores are
designed to be invisible to the typical FrontPage user. To see them all, you
have to pull down the Tools menu and choose Web Settings | Advanced and
specifically check the box that says Show Documents in Hidden Directories. If
all those directories don't get put on the server and if the server doesn't have
a whole bunch (about 18 megabytes) of other code called "Front Page
extensions", then these bots and other features won't work. Plus, the paths
to the extensions in the code have to be correct.
If you're really enamored of a FrontPage theme (and many are
available for free at various 3rd-party Web sites), you should disassemble it
and use the parts, specifically the background and the buttons.
Tip | Don't use anything that calls for bots
or Web-bots or directories that begin with underscores or proprietary tags
beginning with mso or in-line styles (that is, style as an attribute of the font
tag). If you aren't sure, check your HTML code.
Feedback
I hope you find these suggestions helpful. Please feel free to
email me if the directions aren't clear or if you need further help.
Do you have any tips to share? Talk about it at the Bistro.
Tips for FrontPage
Users
