|
My web pages are information resources.
They are designed to be
- non-commercial
- fast loading
- compatible with a wide variety of web browsers
without any need for plug-ins
My design strategy is to set up a hierarchy of pages with each
page covering one aspect of the subject matter.
Internal links point to related pages.
HTML files are organized into nested folders which parallel
the hierarchy.
Images are in folders separate from the HTML files.
I try to avoid excessive fan-out (too many links from one page)
and too many files in one folder.
Design tactics include cascading style sheets and reuse of
HTML code.
-
cascading style sheets
-
Formatting details are specified in one place and then inherited
by all the HTML files that refer to them.
Here’s mine,
textdef.css
-
body {background-color: #ffffff}
th,td,li,dt,dd,caption {font-family:Times; font-size:16px; color:#000000}
p {font-family:Times; font-size:16px; color:#000000; text-indent:16px}
-
reuse of HTML code
-
When you see some formatting you like — for example,
highlight markers
around some of the text — find it in the HTML source code,
copy that section of code into your own HTML document, and
substitute your information for the original information.
My HTML files are a library of reusable formatting examples.
Coding is done the hacker’s way: I don’t use graphic editors
or HTML generators, but edit the raw HTML code with a text-only editor.
- advantages:
- You can do anything.
- Independence. You are not at the mercy of somebody else’s
development tool.
- No unnecessary code. Your HTML files are clean and compact.
- disadvantages:
- You have to learn HTML. My favorite
help documents are linked on-line.
- Syntax checking is a critical, though easy, extra step.
- Creating an HTML file might take more of your time.
Ted’s approach to developing a web page:
- Find a page whose formatting is kind of similar to what you want.
Usually, hand-coded pages work better than pages from HTML generators.
- Copy the page and re-name it.
- Substitute your information for all of the original
information, including the TITLE and META tags in the header.
- Check the syntax and spelling, and make corrections.
- Preview the page on several different web browsers.
Make changes if it doesn’t look right on all of them.
- Upload the page to your web host, and check all the links.
Tools and Methods
-
computer
-
Apple Macintosh Dual 2.3 Ghz PowerPC G5, running MacOS 10.4.11
I also have an old Mac running OS 9, which works better for sound recording.
-
HTML coding
-
BBEdit is a text editor optimized for HTML.
It provides previews,
syntax and spell checking, and tools to speed up your editing process.
-
HTML syntax checking
-
The
W3C Markup Validation Service does an outstanding job.
-
picture composition
-
Microsoft
PowerPoint.
Save the current slide as TIFF, or for maximum resolution,
as a Macintosh Picture (PICT).
For more details, see
Professional-Quality Digitized Maps.
-
image editing
-
Adobe
Photoshop Elements.
Resize the image (400 x 300 works well) then Save for Web.
If it’s a photograph, choose “JPEG High”
in the Preset list. For other images, GIF might result in a
smaller file size.
-
sound editing
-
Audacity lets you see the waveform on your computer screen,
then save the edited sound in several different formats.
-
mailto:
-
Use a
<SCRIPT TYPE="text/javascript">
to discourage spammers.
Other methods include spelling out the punctuation or making a
graphic image of your email address.
-
web hosts
-
See
Web Hosting Reviews By Users and choose from their
Hosting Recommendations.
-
FTP uploads and downloads
-
Captain FTP handles them with great aplomb.
-
Search Engine Optimization
-
Follow the experts’ SEO advice, paying attention to the
TITLE and META tags in your header.
|