Keep your code clean and easy to read and your files in order.Easy to read, clean code means that you will always be able to go back later and know what you were doing. It is very seldom that you will never want to update or improve a page! Make it easy to do this.
My first rule is to use line spaces in the Notepad text every time I begin a new paragraph or new cell on a table [more about them later]. Don't run many lines of text together in Notepad or you will have a terrible time figuring out where anything is.
Second, a rule I don't always follow myself but is a good one, CAPITALIZE all tag labels. Along with this, do not use all caps for your text! All caps is not only hard for you to read, but visitors to your website will have a hard time too.
Many programmers find it is helpful to indent areas of the page that fall under a particular tag, but that haven't been closed yet. [This is especially important for tables.] Note that the spacing that you use for your HTML document in Notepad is NOT the spacing that appears on the page, so these indents can only help you--they are not seen by anyone else.
Use Comment Tags to help set off portions of your code.
Be sure to give all the information needed in IMG tags, and alternatives, if needed, in FONT tags.
7th Assignment:
Make sure your code is easy to read and understand.Look at the "View Document Source" for this page. Notice the spacing. This is the only rule that is followed consistently, but then this is a simple page. If I were creating a table with many cells, for instance, I would want to be even more careful to make things clear. Good spacing also helps to make sure that all tags that need to be closed actually are.
This page also has two comment lines. Notice <!-- top of assignment -->. This line does not appear on the web page. Its purpose is to help the programmer find specific parts of his or her program.
Look back again at the Webmaster Club main page. Look at the source code. Notice that the image that makes the title for the page also has a text label. The code for this is <img src="miscimages/title.gif" width="395" height="181" alt="Petersen Webmaster Club">. This is helpful not only for yourself, but if your graphic does not load immediately on the page, the "alternative" text will appear, and visitors to your site will at least know what is expected to be there. For the "About Us" graphic on that page, the alt text also tells the visitor that the image is a link.
Also notice on the Webmaster Club main page that an unusual FONT face was chosen. Many visitors may not have that font style on their computers, and would ordinarily get whatever their default is. I decided to make a second choice available, "Comic Sans MS," in hopes that something fancy would work.
Lastly, good programming means that you pay attention to where you are putting your files and your graphics. Keep all HTML documents that go together in one folder. It is recommended that from the very start you create sub-folders for images, sound files and the like. This will keep your work well-organized and easy to find. It is surprising how quickly a few HTML files can be literally lost in a sea of graphic files. Just be sure that your links (and IMG tags) specify the folder name as well as the file name that you want.
Be sure to check everything you do frequently in your browser! It is very upsetting to go to someone's web page and find images that don't load or links that don't work. Also check your spelling!
Copyright ©2000, Marilyn Huffman. All rights reserved.