Hand-Coding Web Pages

By Vince Barnes

Essentially, there are two ways you can put web pages together. They can either be hand-coded, meaning that the writer/programmer writes out all the HTML code, JavaScript, etc. by hand, or generated, whereby a generator program of some sort is used, such as Dreamweaver or FrontPage. This latter group, by the way, also includes all the "WYSIWYG" (What You See Is What You Get) editors like Microsoft Word or Publisher along with the various "wizard" type generators that generate a finished page based on a series of questions (these are often "features" buried in other programs, though they can also be stand-along programs.)

To the true die-hard web coder, hand coding is the way to go.  Others think that modern tools present a more realistic method, especially for the newer web developer.  Whichever way you feel is right for you, there can be a lot of satisfaction, not to mention insight, gained from hand coding at least a few web pages.  When you do, however, there's no need to make life unduly tough on yourself.

The task of creating pages by hand coding can become quite complex. Hard core hand-coders develop working techniques to assist them in this endeavor that frequently involve the use of advanced text editors. If you've tried to use Notepad for this you'll know that it requires remembering the fine points of the syntax you need and having a very keen eye to spot those typos. Today I thought I'd share with you a little about my own favorite text editor, point you at a couple of others and give a couple of tips about text editors in general.

My particular favorite editor comes from Ian Mead at IDM Computer Solutions. inc. (see http://www.idmcomp.com ) and is known as UltraEdit. My good friend Scott Clark, a very accomplished webmeister, favors Notetab Pro from Fookes Software (see http://www.notetab.com ) These are both terrific products and sold at bargain prices. Which one to choose is strictly a matter of personal preference. I suggest you download and try out both, then buy the one you favor.

What sets these, and similar, products apart for our purposes, is that they recognize web programming language formats, syntax, tags, etc. and display code in a variety of colors to depict the nature of the code elements. Simply stated, HTML code is in one color, JavaScript in another, comments another and so on. They have tag lists that enable you to select a tag by name and insert the code where you need it. For example, if I look at the HTML tag list and select Table, I get <TABLE></TABLE> inserted where my cursor was when I clicked. The list serves also as a reminder or prompt of the tags that are available to you.

UltraEdit recognizes a lot of different programming languages and can easily be extended to understand more. I find this to be an advantage as I use quite a variety myself, but can continue to use the same tool. UltraEdit and Notetab both have excellent global search and replace capabilities that con work on a single or on multiple files. This is very convenient when you have to track down all references to a URL which has just changed, for example.

There are many, many features in these programs -- far too many for me to mention here. We may add a software tools section to the HTML Goodies site soon. When we do, that would be the place for a more comprehensive review.

Text Editors allow you to "Save As" using a variety of filename extensions. While exact mechanisms vary from editor to editor, the basic principle is that you choose File / Save As and type in a filename and extension or type the filename and select the extension from a drop down list. Notepad assumes you want to save a text file (filename.txt) unless you put double quotes around the name ("filename.html") Recent versions of Notepad also allow you to Save As, select All Files from the file type drop down and type in any extension you want (without the double quotes.)

Also note that you can configure which text editors to use in your browser. In the Internet Explorer (v 5 or 6) you go to Tools / Internet Options / Programs and select which program you want to use for an editor. The same applies to FrontPage (Tools / Options / Configure Editors) and most site management products.

A good text editor will save you a great deal of time and heartache!

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
Thanks for your registration, follow us on our social networks to keep up-to-date