So, you want to write your Pokémon fanfic in HTML, eh?
Good choice! This isn't to say that regular text documents are necessarily bad. In fact, I use a word processor myself to check for typos and other spelling errors before I change it over to HTML. But while I'm typing it, I put in the necessary HTML commands I'll need so that my browser will be able to read it like a webpage. So when I'm finished, I've got all the codes in place and I can simply save it as an ordinary text file with an .shtml extension and BANG! I've got a fanfic as a webpage. And that means you can do some pretty cool stuff with the look of your fanfic.
You can be assured that I'll try to keep things as simple as possible. There is a lot of information here with examples, so you're not completely left in the dark. On top of that, there's a template you can use to get you started. Most importantly, of course, if you have any questions about anything here or you're having problems, contact me.
The reason why HTML is a good format for your fanfic is simple: you can use bold, underlines, italics, tables, anything you've seen on a website, you name it; you can use it. In my own fanfic, Growlithes in the Real World, there are two tables in it. It's the centered text. ^_^ Agent 99's Snow Angels is another excellent example (Part II especially) as she used small pictures.
Now, let's get to the nitty gritty of the commands you'll be using.
Most commands in HTML are like light switches. You turn them on, do what you need to do, then turn it off. The "/" in front of the command tells the browser to turn it off. For example: </U> would tell the browser to turn the underlining off. Just keep this in mind when you do your HTML work. The examples provide insight on how the text should be formatted when you write/edit your fanfic. A template is provided at the bottom essentially shows a visual of how your fanfic should appear when you're done typing it up with HTML commands.
First, you need to use a word processor. Any one should do the trick, but make sure it gives you the option to be able to save your fanfic in different file formats, like .txt and .doc, for example. This is important later on. Now, before you even start typing your fanfic, you need to put in the following commands:
<HTML> <== This is necessary, so that the browser will recognize that you're running an HTML file
Text Manipulation and Other Deceptions
Okay, you've set up the environment in which your fanfic will appear. All the while, you're saving your fanfic as a word document, not a text file -- not yet, at any rate. Now we get to the slightly fancy stuff: bold, italics and underlines. Here's how they are formatted for use:
<B> <== Turns on bold for the following text
Proper Spacing and Good Manners
The next command is fairly critical. It is this command that will allow proper spacing between paragraphs. Without this command, everything will string together and look really bad. Remember these commands well:
These are your paragraph commands. To give you an idea of how your fanfic should appear when you're typing it out, here's an example that uses the <P> </P> commands.
<P>A few hours later, Jessie and James had explained the details of the past few days and recounted just about every criminal act they had ever done under Giovanni and Team Rocket's direction. While both of the ex-Rockets felt some relief for confessing to their sins against society, Jessie was strangely emotional. She had been crying softly on James' shoulder for the past fifteen minutes while James held her. The officer looked tired, but she was smiling.</P>
As you can see, it's not too difficult to do this, you just have to get into the habit of putting paragraph commands at the start and the end of your text.
You can also align your text to the left, center, or to the right. Here's how to use them and how they look. This is left aligned text. This is centered text. This is right aligned text.
This is left aligned text.
This is centered text.
This is right aligned text.
The </P> becomes more necessary to maintain control over the alignment, otherwise, your document will look really goofy if it's completely centered. Also, note the extra lines between the Shown As text because you're paragraphing.
There's another command that you can use if you want to simply jump down to the next line. You normally wouldn't need it in a fanfic, except at the top when you give the title and the author's name. Think of this command as a Line Break command:
By God man! Pull yourself together!
Now, let's pull all these things together so you can get a feel for what the start of your HTML fanfic will look like. You can actually cut and paste the HTML template below and use it for your own nefarious purposes.
Okay, now you've got all the commands in place and you've saved it as a .doc file. You need to now save it as an ordinary "Text Only" document. So in your word processor, click on File, then Save As. A window will pop up and the very last drop down menu, if you click on it, should provide you with a "Text Only" option -- NOT Text With Line Breaks. When you've selected it, type out your filename with the .html extension. This is very critical as your browser will not read it as a web page, but as a text document and you don't want that.
You may find that you don't see file extensions. That's the ".doc" or ".txt" or ".html" part of a file. When you create a document, say with MS Word, if you don't see the ".doc" part at the end of it, then your file extensions are hidden. You need to unhide them, so you can see if you need to rename the extension for submission to The Tower. Here's how you do it:
2) Double-click on My Computer
3) Click on Tools from the menu bar
4) Select Folder Options
5) Click on the View tab
6) Find the line that reads: Hide file extensions for known file types and *uncheck* that option
7) Click Apply, if it's lit up, then click Ok.
8) Close the My Computer window
9) You should now see the file extensions
Once you've done that, minimize everything and pull up your browser. You don't need to be connected to do this, so when you get some errors that it can't find a website, just click Ok; that's normal. Now you need to pull up the file in your browser. So, assuming you saved the file to your Desktop, just type this out in the address field:file:///c:\windows\desktop\filename.html (filename being whatever name you gave the file), then press Enter
This should pull up your fanfic and it should look like the example below (with your text, of course) and it will be full screen, unlike the below example:
So there you have it! An HTML tutorial for your fanfic. Huzzah! Aren't you glad to be at the end of this heinous and lengthy piece of webpage. ^_^
Okay, more seriously though, with a little practice and understanding, writing your fanfic in HTML gets really easy. And as I mentioned at the start of this tutorial, I'm available to answer any questions you might have.
Good luck and have fun!