Making Your Work HTML Ready

Patric Michael

With the ever increasing popularity of the Internet, more and more publishers are using this valuable resource to receive submissions.

Therefore it is a good idea to learn the basic forms of HTML to prepare your submissions to WorldCrafters.

This help file will not teach you everything about using HTML, but it will provide enough information for you to prepare an acceptable submission for Course assignments.

Because this document will also be used as an example, there are no special HTML codes used.
You are strongly urged to view the source file for this page. Take note of how the tags are nested together to form the relevant sections of the document.

You are welcome to cut and paste your text into this template to begin with, but you will quickly find it is much too limited.

To begin with, HTML requires a fairly strict structure consisting of HTML, HEAD, TITLE, and BODY 'tags'. We will examine each tag pair separately.

<HTML> is always placed at the top of the document. It tells any browser what to expect in the rest of the page.

</HTML> is always placed at the end of the page, and "closes" the document. That simply tells the browser that everything between

and

is to be considered as HTML code.

<HEAD> starts the section which the browser reads to gain extra information it may need to properly display the page. When you become more adept at using HTML, you will add a variety of tags here, but for the purpose of submissions, we will only include the <TITLE> tag. (See below)

</HEAD> will always end this section, and usually appears just above the <BODY> tag.

<TITLE> appears in the <HEAD> section only. Anything placed between the opening and closing TITLE tags will appear at the top of the browser window where the page appears.
For example, the TITLE of this document is "How to Submit Assignments". Beginners often confuse this TITLE with the actual title of their text. (See the <BODY> tag below)

</TITLE> Ends the TITLE section. (Do you notice how every ending tag is identical, except for the slash(/)? That is consistent with nearly all HTML tags. Exceptions are noted in the <BODY> section below.)

<BODY> always appears below the </HEAD> tag. This section is the portion of the document that actually appears to the reader. HOW it appears is determined by additional tags.
We will examine several here. They will be the ones you most commonly use in your submissions.

<H1> "Heading" makes the text between its tags larger and bolder. Number 1 produces the largest text and number 6 produces the smallest, which will still be different from the standard text. It MUST be ended with a matching </H1> tag. (Naturally, use the appropriate number!)

 "Break" adds a single 'carriage return'. Use it just as you would a 'hard return' in your favorite word procesor. It does NOT take an ending tag.

 "Paragraph" is the same thing as but it adds two carriage returns, perfect for starting a new paragraph. :)

<HR> "Hard Return" (or Horizontal Rule) creates a simple graphic line the exact width of the window.

 "Bold" makes the text enclosed appear as boldface type. It must have a matching tag.

 "Underline" presents the enclosed text as underlined. It must have a matching tag.

 "Italic" displays the enclosed text in an italic format. Like the rest, it must be concluded with a matching tag.

Final Notes: Most tags can be 'nested' as in the following example:
Cool Stuff!
produces Cool Stuff!

which is bold, italics and underlined all at once.

            One way to provide a double space to indent your paragraphs is to use a token
            similar to the 'less than' noted above. Use the following characters without
            spaces in between: & nbsp ; to create a single space. Two of these 'tokens',
            separated by a space in your HTML document will give a reasonable indent.

Another handy code is <blockquote> which will move text to the right, as 'tab' does on a typewriter. You can use several of them together to move several "tab" widths at once. <blockquote><blockquote> moves the text two blockquotes over. YOU MUST END a blockquote with </blockquote> and there must be as many ends as there were beginnings.

Now, with all that said, here is a list of the steps to modify a submission for HTML viewing. Be sure to alter these steps to fit your particular style as necessary.

Download the template, and keep a copy. Open it in any word processor that handles plain ASCII or .txt files. Be SURE to disable "word wrapping".
Scroll down and change "Default Title" to the title of your story. This appears twice:
Once to set the title of the window, and a second time to set the title as it will appear in the document.
Scroll further and look for "Insert Story Here". <HR> makes a good separator so we will use it in this example. Just above "Insert", type <HR>.
Open your story in a new window and click in EDIT. Click on SELECT ALL. Click EDIT again and select COPY. (For non-Windows users, cut and paste in whatever manner available to you. If you do not know how, send me e-mail with your system type and programs you use and I will find out.)
Switch to the template window and position the cursor under the <PRE> tag. Click EDIT and select PASTE.
Refer to your original story and look for any words you might have underlined, italicized, or set bold. Use the appropriate tags as noted above. Note sound effects are italicized in the Radio Script format. Sound of horses hooves.
Next, insert the appropriate "line break" and "paragraph" tags to format the text. The template has all of its tags on a separate line for clarity, but you may place your tags at the end of a line if you wish.
Just below your story, you will see an 'anchor' that looks like this: <A HREF="default.html">Back</A>
Replace 'default.html' with the filename of your index page, using the following naming convention:
Filenames are based on the first two letters of the first name, and the first five letters of your last name. My name results in pamicha.html, for example. Ann Marie Olson results in anmarie.html. NOTE: Case is sensitive! Use only lower case letters.
Scroll down to the <ADDRESS> tags. Replace 'Somebody@somewhere.com' with your e-mail address. Replace 'Somebody' at the end of the anchor with your your name.
Just below that anchor, you will see "1999 Copright message here." Replace the text with something appropriate. Using " (c) Copyright Year by Name" will help protect your intellecutal property rights, and is always a good idea.
BE SURE TO READ AND AGREE TO THE STUDENT AGREEMENT before you do this. Submission of Assignments constitutes Agreement.
Stories related to the Simegen universe MUST be marked "(c) Copyright year? Sime~Gen Inc."
Save your document as text, but be sure to use .html (.htm on older systems) as the extension. When your file is uploaded, it will be renamed according to the conventions noted above, with the addition of four digits. These numbers represent the assignment number and the year as follows: pamicha0199.html represents assignment 01 in the year 99. Feel free to save your document with the correct name, but be assured I (or Jeff Hall) will verify it as necessary when your assignment is posted.
View your document in your favorite browser for errors. Most will allow you to type the full path name as a link. Use the following format: file:///c:\internet\editors\html\worldcraft\anmarie.html (change the path to point to your file, of course.)
Email me directly if you need help with this, or if you are on a non-windows system.
Send your document according to the guidelines and you're done! Be sure to let me know if you have difficulty.
NOTE: If you are familiar with HTML and intend on adding anything fancy, remember these points. Background colors are fine, but if you use a background image, it must be linked off-site ONLY. Do not point to any image file larger than 50k. Anything that would require the use of a plugin, or any browser higher than Netscape 3.0/IE5.0 should not be used at all.
Also, try to use a common font. Not everyone has them all, and the result may reduce your work to a garble.
For the sake of clarity in commenting, I also add an "Ordered List" to each paragraph.
Below the by-line, I add <OL> and at the start of each paragraph, AFTER the tag, I add a <LI> tag. (List Item)
At the end of the text, before the </BODY> tag, add </OL> to close the "Ordered List" section.
The end result is that each paragraph will be numbered so the instructors can refer to a paragraph by number when commenting. Students are encouraged to include these tags in their submissions.

You "View Source" in most browsers by clicking on VIEW, then scrolling down to SOURCE.

Study the template for the Radio Plays Assignments.
Sometimes you will see "View Frame Source" instead. It is the same thing. In MSIE, rightclick your mouse anywhere on the page, choose view source. Notepad or Wordpad will open to let you view the html behind the page. Go to the file menue in notepad or wordpad, choose SAVE AS, and save the file, naming it submit.htm . BE SURE TO DISABLE WORDWRAP. (look in the edit menu in notepad. Notepad opens by default with wordwrap off.)

Comments: StudentShowcase@SimeGen.Com

Copyright © 1999 Sime~Gen Inc. All rights reserved.

Always remember, "Writing is a Performing Art." There are no "right" answers, only useful ones.

Quizzes presented here were made on Half-Baked Software's excellent software. Teachers check this site out.

This Page Was Last Updated 12/10/99 02:54 PM EST (USA)

WRITE YOUR OWN SEARCH CRITERIA

Search all of amazon.com for titles, authors, or subjects such as Radio or Scripts or Tapes -- remember to put quotes around multiword groups.

SEARCH ENGINE for simegen.com : Find anything on simegen.com.

Submit Your Own Question

Register Today

Go To Writers Section

Return to Sime~Gen Inc.

Explore Sime~Gen Fandom

Science Fiction Writers of America

Send an E-Postcard to Tell Your Friends of This website - it's FREE.

§ This page is designed to be best in Microsoft Internet Explorer 4.0 and above.

Feedback about this page.

Feedback about Sime~Gen Inc.

Feedback about technical problems with this site.

[an error occurred while processing this directive]