Web Page on a Floppy (or, on the Internet...): I don't know about anybody else, but, since I've had a connection to the Internet, it seems like I'm collecting more and more files from the Internet, filling up hundreds of floppies. One day, I decided that it would be nice if I could create my own web pages...no, not these, where you are reading this, but on those floppies that contain my collected Internet files. Creating a web page on a floppy is exactly the same as creating a web page on the Internet, without, of course, having to upload it to a server machine via FTP (File Transfer Protocol). It's your personal web page, inaccessible to the entire world, and, it's lots faster because it works at the speed of your computer, rather than the combined speed/slowness of your computer, your modem, the telephone lines, your ISP (Internet Service Provider), the Internet, and the server computer that stores the web pages you want to view! Whew!
If you're reading this, you have an Internet browser. Duh. Files with an .htm extension are basic web pages. Files with either .jpg or .gif extensions are images. Files with .au, .mid, or .wav extensions are sounds. There are certainly more types of both image and sound file extensions than I've listed here, but, these seem to be in the majority. Okay, here's how to create your own web page on a floppy. The first thing to do is to open a simple/ASCII text editor. The first line that you type is <HTML>. The second line is your title line, and it goes like this: <HEAD><TITLE>A Web Page on a Floppy (you can call it anything you'd like, this is just an example...remove these parentheses) </TITLE></HEAD>. The front slash (/) means the closing of the tag. The third line starts the body of the web page, and selects both the background color and the color of your text: <BODY BGCOLOR="WHITE" TEXT="BLACK">. If there's a family picture that you have scanned, and it's saved on the floppy, you can use that as the background. That 'tag' would be <BODY BACKGROUND="Family.gif" TEXT= etc.>, and the family picture will tile, over and over, to cover the entire background! If there is a sound file on the floppy (say 'Sugar', by the Archies...) you can easy add it to your page, too. The 'tag' for adding a sound to a page is <BGSOUND SRC="sugar.mid" LOOP="INFINITE">...the 'INFINITE LOOP' means that the sound will play over and over. I've learned a little bit more about the LOOP command recently: without the LOOP command, whatever sound you've included runs once; however, you can also type LOOP=2, 3, 4, (with or without the quotes...I prefer to save space, though, and leave out the quotes, wherever they aren't necessary) etc., all of the way up to the (possible to be obnoxious) INFINITE variable. Now, you can start listing the files that you've copied/saved from the Internet, or, created yourself. For images, you can have them all opened, ready-to-view, thusly: <IMG SRC="filename.gif (or .jpg)">...where 'filename' is the actual name of the file. You repeat this line for as many image files that are upon the floppy. For files that end in the .htm extension, you need to create links to those files, like so: <A HREF="filename.htm">Filename</A>. You repeat this line for as many web page, or, text (.txt) files as you have. To close your 'web page on a floppy', type </BODY></HTML>. Here's how your finished simple/ASCII text file should look (you can copy/paste this example for your own...):
<HTML>
<HEAD><TITLE>A Web page on a Floppy</TITLE></HEAD>
<BODY BGCOLOR="WHITE" TEXT="BLACK">
<IMG SRC="filename.gif"> -- For example, here's a possible background pic: <IMG SRC="m0od8g8i.gif" WIDTH=108 HEIGHT=108 ALT="[Background GIF]">
<IMG SRC="filename.jpg"> -- For example, here's another possible background pic: <TABLE BORDER="3"><TR><TD><IMG SRC="marbled.jpg" WIDTH=128 HEIGHT=128 ALT="[Background GIF - Link to Graphics Primer]"></TD></TR></TABLE>
Yes, that table around the image is different! Look at the coding for the .gif file, above, then compare it with the coding of this image. Notice what's different? Another nice thing about images, and, tables too, is that you can make them into Hypertext Links. Go ahead and click on that graphic above, and your browser will take you to my new Graphics Primer, which has more information on using graphic files, backgrounds, tables, and linking. Here's the full, with the link, coding ('Be Careful of Typos', or, 'Why Copying & Pasting Works So Well' - if you see it working, you'll know that the source codes/HTML tags for a particular thing-a-majig is correct!) -- <CENTER><TABLE BORDER="3"><TR><TD><A HREF="gprimer.html"><IMG SRC="marbled.jpg" BORDER="0" WIDTH=128 HEIGHT=128 ALT="[Background GIF - Link to Graphics Primer]"></A></TD></TR></TABLE></CENTER> .
The following four examples are what are formally called Hypertext Links, or, casually, Links. A link is a part of an HTML document, or web page, that is 'clickable'; which means that if you click your mouse on it, the browser will begin a new window, or, will open a file, that will play in the existing window. The first two will open new pages upon your browser, the second two, which are sounds, should(?) play on this page. Since these use examples of already existing web pages, in my GeoCities directory, you'll need to use your browser's Back button to return to this page.
<A HREF="filename.htm">Name it whatever you want, representative, or not.</A> -- For example, my teal text color to background color comparison page: <A HREF="teal.html">Teal</A>. Try it!
<A HREF="filename.txt">Filename</A> -- For example, my source code (index.txt) is a text file: <A HREF="index.txt">source code</A>. Try it!
<A HREF="filename.au">Filename</A> -- For an example, the 'Starting Windows 95' sound, click <A HREF="tada.au">Tada!!</A>. Try it!
<A HREF="filename.wav">Filename</A> -- For an example, kansas.wav, click <A HREF="kansas.wav">"Toto? I have a feeling we're not in Kansas anymore...!"</A>. Try it!
When you're logged on to the Internet, links work pretty much the same, except, from a web page on the Internet (as compared to a floppy, on your own, home computer...) you can link to other sites, too. The link to GeoCities' main page is <A HREF="http://geocities.datacellar.net/">Geocities</A>. However, because this page is on one of GeoCities' Internet Server computers, the link to GeoCities, from this page is simply <A HREF="/">GeoCities</A>! The "/" means a link to the 'ROOT' directory, on whichever computer it's referencing.
</BODY>
</HTML>
<!-- This is a comment. You can put it in your HTML source code, and it won't show up on the web page! A nice way to mark updates, give credit where it is due, leave messages for friends... -->
When you've finished your simple/ASCII text file, including the names of every file on the floppy, you then just save the file you've created to the floppy, choosing any name that you'd like, and giving it an .htm extension. The next time that you want to view the contents of that floppy, you just click on the .htm file that you've just created, and your Internet browser will open it. I have used this type of form for troubleshooting and glossary floppies. Lots of them!
Colors: As you can see, through almost every inch of this web page, black works well for text, and white makes a great (though boring) background. I've used black and white as my primary colors because I think that they make the page look more professional looking, more readable, and, it leaves me a good sized collection of other colors for additional emphasis. If you want to see the color names that I found worked, using MSIE 2.0c and MSIE 3.01 as test bed, try these links:
[Color Tables] [JavaScript Color Comparer
No, I don't know what color 'cardinal' is, but it works...!? Some of these colors have pretty non-typical names. These were created by just combining known working color names with others -- what combinations can you find? These colors will work on both the Netscape 3.0 and Microsoft Internet Explorer (MSIE) 3.1 browsers. Light text on a dark background or dark text on a light background usually works the best. If you would like to see how these colors work as backgrounds, using black text, I've got them divided by browser versions.
Here's the link to the Color Tables and the Text and Background Color Comparisons pages.
I'm using color names here, instead of hexidecimal colors, because they are alot easier to remember (though spelling, if not the case, is important...) than hex colors. However, as browsers evolve, hex colors will be more likely to continue their values. There is a much larger color palette available through the hexidecimal color method, but.... If you want to see how I changed the color of letters, words, and phrases, just check out my source code. I'll bet that there are people out there that are more creative than I, and could find more color names to use, but, in my case, when darkgray is a lighter shade than gray, I think that I've been doing this too long! If several of these colors appear to be duplicates of each other, it's simple enough to place the similar colors as background and text...if you can still see the text, at all, the colors are close, but not exactly the same. I've read that using color names, instead of RGB Hex color names, are incompatible with some versions of Netscape Navigator.
Having worked with HTML for perhaps 16-months, I'm starting to believe that, if the Internet continues spreading like wildfire (heck, I'm here, after all, and, for a new computer user, I'm old...), computers will soon be necessary for both schools and homes. The Internet is the 'Killer App' for all computers...if you aren't affluent enough to have a room in your house that you call a library, then a computer attached to the Internet becomes your library -- nobody is affluent enough to have a world-wide-sized library inside their house, or, for that matter, their childrens' schools! If, as has been predicted, computers become a part of every home, I can imagine children writing their homework assignments formatted in HTML, and, either sending their assignments in via e-mail, or, perhaps best, keeping an entire school session/year of homework, book reports, term papers, etc., on a floppy or Zip tape -- to work on at home, and carry into school! "The possibilites are endless" (I'm sure this is a quote, but, who said it?)!
Thanks for dropping by. I plan to update this page just as often as I can, and, hopefully will make it much more interesting. As it progresses, I hope that you will learn from it just as much as I will!! Just find the 'Bookmark' or 'Favorites' button on your Internet browser, and hit 'Add' or somesuch. This Bookmark or Favorite, that you have just created, will allow you one-button/double-click recall access to my fledgling web page!!
Please send me some email , whether a question, compliment, constructive criticism, or, serious thrashing. I'll try to accomplish changes that are both reasonable and within my limited HTML grasp!!
(Though writing HTML is basically a cut-n-paste operation...)
Since I've become tired of typing '&reg;' to denote Registered Trademarks, etc. (also, having ® marking up many different things on a web page makes things look really sloppy...), please refer to the 'Trademrk.txt', just in case I might be infringing on something, here. If I'm missing _any_ pertinent Trademark information, please let me know!
Also, if you recognize your copyrighted images on these pages, e-mail me, and I'll remove them immediately! (If not sooner...)
©1997 Tim Folker, all rights reserved |
Actually, I think that GeoCities, through their generosity, has already provided me with a 'link to elsewhere...'