Web Masters Tips and Tricks.

 

Preface

On these next few pages I will be sharing with you the benefit of my experiences in the world of web development, what works and what doesn't. I have increased my knowledge base considerably in the last few years and have decided to "share the wealth".

The Nuts & Bolts.

First things first. You have to decide which mark-up language you are going to use. You basically have six different languages to choose from: HTML 4.01 Loose, Transitional, and Strict, XHTML 1.0 Transitional and strict, and XHTML 1.1. XHTML 2.0 is in the works but it has not been "hatched" just yet, it looks exciting though. It has come to my recent attention that there is another choice that is coming up fairly fast. I was reading a recent post by Arnold Goodway in the Awards Community News that caught my attention instantly. While I don't agree with everything that Arnold said I do agree with almost everything and I offer his posting up for your consideration because he has certainly served up some "food for thought". I do agree emphatically with one of his statements, "Internet programming is fun, have a blast with it". From my own perspective I will continue to embrace the future and to be a part of it rather than "play a waiting game" to see how it actually plays out and see which direction the "herd" is heading in. In reality the number of people who actually write XHTML 1.1 to serve up text/HTML mime types is probably less than 10%. If they invent XHTML 15.2 I will probably learn to write it if it gives me any more freedom because I love a challenge. I have always done all of my thinking "outside of the box". I do a lot of reading and one of the books that I enjoyed and have in my library is "Bulletproof Web Design" by Dan Cederholm. If you get a chance pick up a copy and read it. It goes into detail about the powerful combination of XHTML and CSS in creating "BULLETPROOF" web pages. From this platform I am not actually recommending you change anything that you are doing, as long as what you are doing is working and you are completely happy with it, but I am recommending you begin to design with an eye to the future. Don't wait for the future to come rushing up from behind and smack you in the back of the head. I write XHTML 1.1 and CSS Level 3 because it gives me the freedom to write my own language and separate my content from the layout for clarity purposes only. I am personally not into the "tag soup" ways of old. Not everything is for everyone but I do recommend you check out what is out there and find the mark-up language that fits you and your purpose the best.
The W3c has been working on a new draft of HTML referred to as x/HTML 5. This appears to be the evolution of HTML 4.01. I went to the W3c site and looked it up and sure enough it really exists. You can check it out for yourself at X/HTML 5 Versus XHTML 2. This link will take you to a very informative website that breaks this stuff down into "layman's terms" that even I can understand easily. It appears as though the first thing they are trying to do is to get everybody, or a majority, to agree on the name, X/HTML 5 or HTML 5. There are also some on-going discussions going on about the need for two new languages that have similar qualities, XHTML2 and X/HTML5-HTML5. Check-out the hyperlinks on the left side of the webpage previously referred to. These are must read articles to stay informed so you can make future decisions.
I have spent a lot of time surfing the internet to see what's out there, that works, and what everyone is using. Reverse engineering is a knack that comes naturally to me so I tend to put code "under a microscope" so to speak. I have seen some really creative websites out there that do not specify a "Document Type", they only specify that their mark-up language is HTML and that's it. It works, but for how much longer. My advice to anyone and everyone would be to pick out an XHTML mark-up language and learn how to use it. Sooner or later all the browsers will have advanced to the point that simple HTML markup will be deprecated to the point of being barely functional, if it works at all. This brings us to the issues of backward compatibility.

Back to top of Page

Backward compatibility and the time spent trying to live in the past.

You will notice that the JavaScript code that follows is written to work for Internet Explorer version 4 or newer. You have probably noticed that a lot of code is written on the internet today to be backward compatible to Internet Explorer 4 or Netscape 4 or newer. I am as guilty as anyone but I firmly believe that if you or someone you know is still using version 4 of either of these two browsers there needs to be an intervention on the horizon. "Just say no". You are missing out on the unbelievable richness that today's internet has to offer. There are some incredibly robust multi-media applications available out there, you need to drop the attitude and join us! Most of my code is backward compatible up to a point but I refuse to live too far in the past. Dealing with backward compatibility issues reminds me a little of some of my "Higher Learning" experiences. Some of you might be able to identify with what I am about to say. We were always encouraged to break-up into "Study Groups". The "Study Group" - usually consists of 20% of people who were definitely above average, 70% of people who were average, and lastly the 10% of people who were remedial. The "Study Group" only moved as fast as the last 10% could comprehend. The 20 - 70 - 10 formula works out the same in every situation, in real life, on the planet. Really! Take a close look around you and you will see what I mean. The Internet works slightly better, though. The top 20% are allowed to run as hard and fast as they want to and their only responsibility is to look over their shoulders and make sure that the advancements that they are creating are not too sophisticated for the next group (the 70%) to comprehend. They get occasional feedback from the following 70% that they find useful enough to implement and the whole process begins to take on a collaborative appearance. Imagine how difficult it must be to create world changing applications and then spend the time and effort to make it work in Netscape 4 or Internet Explorer 4, whew. If you think about it for a minute you will see what I am pointing at.
You will notice that I have excluded the bottom 10% from consideration and so has real life. The bottom 10% of people are not people with any recognizable handicaps or disabilities. They just lack motivation and prefer to move at their own pace no matter what the risk or cost. I will cover making your website accessible to people with "real" handicaps later on.

Dressing up your web page, the basics.

One of the basic things the you can do would be to color your scrollbars. Using style to color your scrollbars will not validate as CSS so the only other option would be to use a lightweight JavaScript. No matter which option you use, style or JavaScript, it will only work with Internet Explorer. I prefer to use JavaScript and to keep my java scripts in the same directory that I keep my HTML files and then use a remote link to call the JavaScript from the head section of my HTML files. JavaScript will not validate, without a whole bunch of re-writing, and is a lot easier to use remote calls to use it. You have to call the script on every page that you are planning to color your scrollbars on. An example of this call would look like this:

<head>

<script src="scrollbars.js" type="text/javascript"></script>

</head>

Back to top of Page

The actual javascript file, located in the same directory as your HTML files and aptly named - scrollbars.js - would look like this:

browser_version= parseInt(navigator.appVersion);
browser_type = navigator.appName;
if (browser_type == "Microsoft Internet Explorer" && (browser_version >= 4))
{
document.write('<style type="text/css">');
document.write('html ');
document.write('{scrollbar-arrow-color:#000;
scrollbar-track-color:#000;
scrollbar-darkshadow-color:#000;
scrollbar-face-color:#000;
scrollbar-highlight-color:#000;
scrollbar-shadow-color:#000;}');
document.write('</style>');
}

The CSS equivalent - Will not pass CSS validation.

<head>

<style type="text/css">
html, body{
scrollbar-face-color:#000;
scrollbar-base-color:#000;
scrollbar-arrow-color:#000;
scrollbar-track-color:#000;
scrollbar-shadow-color:#000;
scrollbar-highlight-color:#000;
scrollbar-3dlight-color:#000;
scrollbar-darkshadow-Color:#000;
}
</style>
</head>

Now then, if you have been reading my actual source code you will have noticed that I have been using the HTML bracket "code equivalents" - <>. I have used the HTML equivalent of the ampersand - & - also. These will have to be exchanged back to the actual HTML brackets and ampersands for the code to actually work. If I had used the actual HTML brackets and ampersands it would have broken my page and never validated as either XHTML1.1 or CSS. We continue with the "Basics" on the next page.
[[a]Home ] [[b]Introduction to the Website ] [[c]About the Authors of the Book ] [[d]Foreword ] [[e] Johannes Vogt - The Tennessee Branch ] [[f]Leonard Fite - Isabella Fite ] [[g]Descendents of Leonard & Margaret ]   [[h]Willy Green Fite - James Monroe Fite ] [[i]Thomas Bethel Fite - Flennoy Elgar Fite ] [[j]Clarence Sydney Fite - Effie Gladys Fite ] [[k] Marion Charles Fite - Lucille Fite ] [[l]Arra Burton Fite - Bernice Mabel Fite ] [[m] Frederick Leroy Fite - Elizabeth Fite Thorne ] [[n]LaFayette Doris Fite - Ella Mae Fite ] [[o] Julia Bruton - Paul Leonard Fite ] [[p]The Source ] [[q]Content ] [[r]Explanation of the Coat of Arms ]  [[s]Links Page ] [[t]Privacy / COPPA Statement ] [[u]Accessibility Statement ] [[v] Copyright Statement ] [[w]Updates Page ] [[x]Disclaimer / Terms of Use ] [[y]Site Map ]  [[z]Reflections ] [[1]Web Master Tips-I ] [[2]Web Master Tips-II ] [[3]Web Master Tips-III ] [[4] Web Master Tips-IV ] [[5]Web Master Tips-V ] [[6]Award Pages Index ] [Rated Awards (5.0) I ] [Rated Awards (5.0) II ] [Rated Awards (5.0) III ]  [Rated awards (4.5) I ] [Rated awards (4.5) II ] [Rated awards (4.0) I ] [Rated awards (4.0) II ] [Rated Awards (3.5) I ] [Rated Awards (3.0) I ]  [Rated Awards (3.0) II ] [[7]Independent Awards ] [[8] ICRA Labeled ] [[9]XHTML 1.0 ] [[0]CSS Level 3 ]