In addition to introducing some basic troubleshooting tips to ensure that modified HTML documents work and display properly, this chapter also instructs how to download HTML documents off the Internet, and then upload them again once modifications have been made.
After creating or making modifications to an existing HTML document, it should be tested locally with a browser; ideally with both Internet Explorer and Netscape. (To do this open the HTML document in either of these browsers.) If the document does not display properly or as intended, there are a couple of common errors/oversights which one can look for in the code. Some of these are detailed below:
Check for Proper Coding
Always check to make sure that HTML tags are paired off (ie., contain the proper opening and closing tags) whenever and wherever appropriate. A simple missing closing tag somewhere can cause a surprising amount of chaos in a page's layout.
Avoid Overlapping Tags
Consider this example of HTML:
<B>This is an example of<I>overlapping</B>HTML tags.</I>
The word "overlapping" is contained within both the <B> and <I> tags. While the intent might have been to have the text display both in bold and in italics, browser interpretation of overlapping tags such as these is unpredictable. Generally it is best to avoid overlapping tags wherever possible.
Only Embed Character Tags
Character tags are any tags that modify the appearance of text between the tags. "Embedding" refers to the practise of placing tags such as these within other elements. An example of character tags embedded within an unordered list follows:
<LI><B>A bold list item.</B>
<LI><I>An italicized list item.</I>
Apart from character tags however, embedding other types of tags can prove problematic. As with overlapping tags, the results can be unpredictable in different browsers and between different versions of the same browser.
As mentioned in the Lesson 4, a missing image file or incorrect link to the file will result in the appearance of either a broken image or "dummy image" icon in the browser window. If this happens, check that the reference image does in fact exist, and that the information contained within the link to the image is correct (eg., correct URLs, file pathnames, etc.).
Downloading and Uploading
In order to make revised or new web pages available to the world through the Internet, it must be uploaded onto the computer hosting the site. This can be done using an FTP (File Transfer Protocol) program such as CuteFTP or WS-FTP (for Windows systems) or Fetch (for Macintosh systems). Such software enables users to transfer files between a local computer and a remote server.
To use an FTP program, users will need the IP address/host address of the website, their user name and password to access the web server. Such information can be obtained from your internet service provider. After prompting for this information, the FTP program, once connected, will likely display a couple of windows displaying the contents of both the local computer's hard drive, and all accessible directories on the host's computer. Though the actual steps involved in transferring files between these computers may differ, this is where file transfers take place.
In order to modify an existing document, the first step would be to use the FTP program to connect and then transfer the file (download) from the host computer to your hard drive. Once you have successfully done this, open the HTML document using a text editor like Windows "Notepad". After you have made the necessary changes save the document with the same file name and then reconnect to host computer to transfer (upload) your updated file.
(HINT: If only a few pages need to be altered or modified, a quick method of downloading the file and gaining access to the source code (HTML code) is to choose the "View Source" option under a browser's (Netscape or Internet Explorer) "View" menu. Doing this will open the current HTML document in a text editor which can then be modified and then uploaded using an FTP program.)
When using a Macintosh platform to transferring elements for a web page to a server, remember to always transfer HTML documents as "Text Only" (ASCII files), and image files as "Raw Data".
You have completed this HTML tutorial!
The Reference Guide on the next page will give you an overview of all the tags and attributes mentioned in these lessons. And is a good page to bookmark for future reference.
Lesson 7 Reference Guide
Copyright © Alternet Web Design