Tutorial from Anamorph
How to Use QuickHTML
This tutorial will teach you how to use QuickHTML, an HTML document editor. QuickHTML is a tool I wrote to create the documents at the Anamorph site. I find it indispensible for moving back and forth between many different documents while editing, but the problem for anyone else will be that all the documents come out formatted exactly like mine. These documents can be personalized and made site-specific, but the overall formats of the documents will always be the same.
QuickHTML looks rough, but it works well. To use QuickHTML properly, you should already know HTML fairly well, and should have written a few HTML documents elsewhere. If you don't know HTML, you might want to start with the Beginner's Guide to HTML, and try this program out later.
To use this tutorial, make copies of the files qhttutorial.html and qhttutorial.qh; then open your copy of qhttutorial.html from both QuickHTML and any Mac browser. For the rest of this tutorial, you'll be viewing this file in both QuickHTML and your browser. The best way to start would be to read through your copy of this file in your browser, moving back and forth to QuickHTML as necessary.
Contents of the Tutorial:
How do QuickHTML Documents Look?
Examine your copy of the qhthtml.tutorial file in your browser. Every HTML document created by QuickHTML has the same format:
- A single-line header at the top of the document tells you where you are, and lets you navigate back to other documents. This header is readable; that is, it is written as a single sentence fragment instead of disassociated words.
- A three-line footer at the bottom of the page repeats the header information; provides the date created, date last modified, and copyright date; points to the author's biography page; and includes the email-address of the author.
- The rest of the document can be divided into any number of sections.
- The first of these is the introductory section. It describes the document's contents, and has a link to each of the other sections in the document.
- The other sections can contain anything you want.
Before continuing, you might want to look at this file in QuickHTML to see how it appears there. Play around and see what happens.
Editing QuickHTML Sections
In QuickHTML, choose Sections from the Document menu. At the top of the window, hold down the popup button that lists the section titles. The names of each of the sections are listed there; choose one of these, and the text of that section appears in the large field beneath. This section can be edited with straight typing and with the menu items in the HTML menu. The HTML menu allows you to quickly add and delete HTML tags from your text.
Things to Try:
- Move to any section as described above and click somewhere within the text. Then choose any of the tags listed in the HTML menu. The tag you choose is inserted into the text, with the insertion point now between your chosen <starttag> and </endtag>.
- Highlight any text and choose a tag from the HTML menu. The selected text is tagged, and the insertion point is now located after the text.
- Click anywhere and press tab. The insertion point moves after the end of the next tag.
- Click on some text between a <starttag> and an </endtag>. Now choose Delete Tag from the HTML menu. The tag surrounding your chosen text disappears.
- Type some new text in, then hit return twice. A <p> tag is automatically added at the end of the text you've typed.
- Some of the tags in the HTML menu are non-standard. See the Additional Notes section, below.
The Sections menu allows you to navigate between sections, create and delete sections, change their titles, and move sections around.
More Things to Try:
- Experiment with the menu items in the Sections menu. Add a new section, delete a section, and change a section's name. As you do this, save the file you're changing, and reload it in your browser.
- Some of the section names begin with a "+". A "+" before a section name indicates that there is to be a blank line before the section name in its listing in the first section.
Editing QuickHTML Headers and Footers
The headers and footers at the tops of documents created by QuickHTML are easy to specify. Choose Head/Foot from the Document menu, and the header and footer screen will appear. The elements here are:
- Window Title. This is the text that is placed between the <title> and </title> tags.
- Your Name. The name entered here is the name that will appear in the last line of the footer, and will automatically be linked to the biography file.
- Biography Filename. When the name entered above is pressed, this is the document that will be opened.
- Email Address. Self-explanatory.
- Header/Footer Readable Index. (This is the least intuitive part of QuickHTML. If anyone can come up with a better mechanism to do the same thing, please let me know). The readable index is entered into this field as multiple lines. The lines follow these rules:
- The text of the first line in this field is made strong.
- Any lines following this one that begin with a single space are treated as straight text.
- Lines that are directly up against the margin represent links. There are two parts to these link lines; the first part is the text of the link, and the second part is the URL of linked document. These two parts must be separated by a comma.
You can experiment with this by using QuickHTML to change the header/footer information in this document, and then reloading the .html file in your browser to see how it looks there.
The .QH Document Format
You will have noticed that there are two files generated by QuickHTML; the standard .html file, and a file that ends with .qh. The .qh file is the one that is read by QuickHTML. QuickHTML writes an .html file which is read by your browser, but that .html file is never again read by QuickHTML. You can throw the .html file out, but if the .qh file is gone, you won't be able to redit the document from QuickHTML.
The .qh file contains the information that QuickHTML needs to divide the document up into its proper sections. It is not possible for QuickHTML to edit .html files that already exist, but you can open these documents in your favorite text editor and copy and paste elements to QuickHTML.
Here's a slightly more detailed explanation:
- When you save a document from QuickHTML, two files are actually saved. The first of these is a .qh file, which holds the document you've created in QuickHTML's file format. The second is a .html file, which is the file your browser sees.
- When reopening a file from QuickHTML, it is always the .qh file that is opened, since QuickHTML is unable to read .html files. Even if you choose the corresponding.html file from the QuickHTML Open File... dialog, it is actually the .qh file that is opened.
- Since QuickHTML is unable to read HTML files, you must keep the .qh file in order to edit it again from QuickHTML. If you don't have the .qh file, QuickHTML will be unable to proceed.
- Because QuickHTML only knows how to read .qh files, any changes you make to your .html files through a different editor will not be seen when you edit the corresponding .qh file with QuickHTML, and when you rewrite your file, all the changes you made in the other editor will be lost!
Additional Notes
- QuickHTML is not meant to be a general HTML editor; its use is to create documents in the format used at Anamorph. It can be used as a general HTML editor, but for this purpose, it would probably be best to use a different editor. There are plenty of good ones available.
- There are only 12 tags listed in the HTML menu, and there is currently no mechanism for easily adding and deleting tags from this menu.
These twelve tags have been sufficient for my needs; I may add a mechanism later to allow entry/deletion of new tags.
- Two types of links are provided in the HTML menu: anchors and italicized anchors. Italicized anchors are exactly as they sound: links that are italicized. This is not standard HTML; these are merely standard links with <i> tags around them.
At Anamorph (and in this document), I use italicized tags to indicate links to off-site documents (you can read more about this in Anamorph's HTML Pattern Language pages). You don't need to do this, and in fact can ignore italicized links altogether.
- Although I tried to create a tool to make documents that would look good no matter what browser is used, QuickHTML documents do seem to look better under Netscape, at least on the Macintosh. They look great under UNIX Mosaic, but under Mac Mosaic, some of the spacing gets a bit goofy.
- QuickHTML was not created to be a durable distributable piece of sortware; rather, it is modified as my sites needs change. If you do intend to use QuickHTML to create documents on your own site, and there are additional features you'd like me to add, please discuss this with me.
- Features that I intend to add, changes that will be made, and known bugs include the following:
- A Find command will be added.
- UNDO usually works, but sometimes it undoes too much. This will be fixed.
- Pressing return twice automatically adds a <p> tag at the end of the previous paragraph. This is nice, but is not always necessary; it would be good to have some mechanism for turning this on and off.
- The mechanism for moving sections around isn't too hot. This will be changed as soon as I figure out a better way to do it.
- The mechanism for creating the readable header text might be too difficult. I'd like to change this, too.
- The Date Created changes at random. Big bug; needs quick fixing.
- Support for automatic generation of reference and discussion sections (as detailed in the HTML Pattern Language discussion) will be added.
- Section numbers as displayed (top right of the section screen are off by 1; for example, section 3 shows up as section 2. This will be fixed.
Feedback
Is this tutorial clear? If there are any points of confusion, please tell me about them.
Tutorial from Anamorph
Last Updated: May 28, 1995. Created May 16, 1995
Copyright 1995 Robert Orenstein. Your Comments are welcome: atempaddress@netscape.net