True Source Code

True Source Code: A Brief History

I started teaching myself how to code (program) HTML in November of 1996. All I was armed with was a computer, an internet connection and a little LPMUD coding experience. At first, I downloaded an WYSIWYG (What You See Is What You Get) HTML editing program and had some fast and easy fun making the very simplest of pages. The great thing about a WYSIWYG editor is that you can create web pages without knowing any HTML. But soon, I wanted to do more complex and specialized things that the WYSIWYG editor could not do. So, I began to read a number of HTML tutorials but, the real learning came from reading the source code from people's web pages that I liked.

Even though my HTML coding skills have improved and expanded since then, I have never forgotton what it was like for me to learn HTML. I was extremely fortunate to have a husband (Fredrik Hübinette who is a great programmer) and to also have a great web server to work with (Roxen). However, I kept thinking about how there must be people out there who might be doing the same thing that I did, but did not have the resources that I had to help them out.

An extremely handy and helpful tutorial that serves as an introduction into HTML is NCSA's Beginner's Guide to HTML. NCSA are the makers of Mosaic, the original web browser. It explains the basic HTML terminology as well as some of the more complex concepts. Please read it if you are unfamiliar with HTML but want to learn more.

True Source Code: What Is It?

As you may or may not know, when you view the source code of a web page from a web browser (like Netscape Navigator or Internet Explorer), it is not actually what the author wrote. The source code viewed from a web browser has been interpreted by the web server (a computer which contains web pages and has a program to manage them) and usually appears quite different. 'True source code' is a term that I came up with in order to describe how people can look at my HTML exactly as I have written it.

[Warning: If you try to view the 'true source code' from my pages while using Microsoft's Internet Explorer, it will most likely fail. IE tries to be 'smart' and display TEXT files as HTML. Even though I have specified my 'true source' to be viewed as TEXT, IE still screws it up. Until I find a way around this, please use Netscape!]

Typically, all a web author (like me) does is type up a page in html and then they upload it to their ISP (Internet Service Provider). Then, it will just sit there until someone (like you) tries to access it.

So now, it is up to the web surfer to make things happen. When you type in a URL or click a link from a particular page, your web browser contacts the web server where the web page is on. The web server then finds the file where that web page is located at. It then reads and interprets this file into content that a web browser can understand. Then, the web server sends this interpreted information to your web browser and that is when you see a page on your screen.

Let me show you some examples of what I am talking about. Please note that if you copy these examples for your own use, most of them will not work the same unless your web server uses Roxen. That is because Roxen has a specialized markup language that is similar to HTML but it can only be understood by the Roxen web server called RXML. Some of the RXML tags that I will be using in my examples on this page are: <accessed>, <insert> and <define>.

With that said, here is the 'true source code' for an extremely simple web page:

      <html>
       <head>
        <title>Simple Web Page Example #1</title>
       </head>
       <body>
        This is a very simple and easy to make web page.
        <p>
        My favorite color is blue.<br>
        My favorite band is Toad the Wet Sprocket.<br>
        My favorite place is a Japanese garden.<br>
       </body>
      </html>

I have put this in a file called example1.html so you can see it displayed on your web browser. If you view the source code from your web browser, it should look very similar (if not exactly the same) as what is shown above.

Now let's take our example one step further so it shows how many times this page has been accessed. You could do some fancy coding or use a counter from any one of the numerous web sites out there, but all you need is one tag from Roxen. So, here is the 'true source code' for the next example:

      <html>
       <head>
        <title>Simple Web Page Example #2</title>
       </head>
       <body>
        This is a very simple and easy to make web page.
        <p>
        My favorite color is blue.<br>
        My favorite band is Toad the Wet Sprocket.<br>
        My favorite place is a Japanese garden.<br>
        <p>
        This page has been accessed <accessed> times.
       </body>
      </html>

This code is in the file example2.html. If you notice when view the source code from your browser, the <accessed> tag is replaced by a number. That is because the web browser (Roxen) sees the <accessed>, says "Aha, this needs to be translated!" and so it reads the logs and inserts the appropriate number of accesses for that page.

Ok, now say that you want this list of favorite things to appear on ten different web pages. Well, with a with a web server like Roxen, you can have it do some 'magic'. Instead of typing in the same three lines over and over and over again, I can use the <define> and <insert> tags. Here is the 'true source code' for example #3:

      <insert file=define_example.txt>
      <html>
       <head>
        <title>Simple Web Page Example #3</title>
       </head>
       <body>
        This is a very simple and easy to make web page.
        <p>
        <myfavs> 
        <p>
        This page has been accessed <accessed> times.
       </body>
      </html>

This can be viewed at example3.html and the file define_example.txt looks like this:

      <define tag=myfavs>
         My favorite color is blue.<br>
         My favorite band is Toad the Wet Sprocket.<br>
         My favorite place is a Japanese garden.<br>
      </define>

You should notice no difference between how example2.html and example3.html appear on your web browser (except for the number of accesses of course). Even when you view the source code from your browser, they should essentially look the same. But as you can see from the code written above, that is not true. That is exactly how it should be and unless I told you or gave you a link called the 'true source code' to show you otherwise, you would probably think that I wrote those two pages exactly the same.

So, now you can insert those three lines onto ten different pages and have saved yourself typing (or cutting and pasting) them in nine times. Also, if you are like me and your favorite color changes with your mood, changing it is a snap. Ok, now I feel happy so my favorite color is purple. All I need to do is replace the color 'blue' to 'purple' in the define_example.txt file and upload it. One file -- one change. Easy right? <:)>

There are many more applications and examples that I could give, but I think that is enough to give an idea of why I have come up with a 'true source code'. If you have any comments or suggestions, send me an email. Just keep in mind that this is my hobby and I do have a full time job, husband, family and dog to take care of if my response is slow.

Thank you for reading this page and I hope it was helpful!