 |
-- the "Nuts n' Bolts" By Total Love In Christ Ministries This column will deal with creating |
* Click for Volume Index * June 1, 2006 |
|
-- the "Nuts n' Bolts" By Total Love In Christ Ministries This column will deal with creating |
* Click for Volume Index * June 1, 2006 |
Construction: Welcome back to Volume 4. At this point you should have a name for your site, a place to build, the required design software, and a pretty good idea as to the actual design or "blueprint" for your intended site. We are now ready to actually "Build the House" -- to design the actual site. You are now ready to decide upon your level of expertise, choose a WEB builder software package, and begin construction on your personal "piece of WEB Real-estate". Before you actually begin, I suggest that you spend some time exploring other Christian WEB sites, note their design strengths and weaknesses, and further solidify your OWN site design. Use Google (or some other search engine) to search on "Christian Ministries". I am going to continue with this column assuming that you opted to use one of the "WYSIWYG" HTML editors like Trellian WEBPage (mentioned last column). If you decided to go with a FULL design package, please consult their tutorial or user's guide for operating instruction. WEBPage is a good comprise, since it allows you to design your WEB page BOTH as a "WYSIWYG" word processor AND at the HTML level. It IS NOT my intent in this column to provide detailed HTML or site building instructions. That is considerably beyond my scope and intent here. This column is to be more like a road map. If you want details, you will have to visit one of the towns along the way. You may locate many of these "towns" (detailed instructions) by using a search engine to search the Internet. There are companies and individuals on the WEB who will design and publish your entire WEB Site for you, if that is what you wish. Some I already gave you in the last column --- Here are a number of additional ones: If you ABSOLUTELY do not want to design your own WEB Site, and you need local help, I would suggest that you check with the local high schools and colleges to find students involved in WEB design. Also, run an ad in the classified section of the local newspaper. Indicate that you are willing to pay $15-25/hour (as you can afford) for their services. You will probably find MANY budding, VERY brilliant WEB artists eager to get some experience and make some money at the same time. Offer them testimonials and/or advertising (in addition to design credit) on your WEB Site. What I DO want to cover today are a few design tools and techniques that are invaluable to a well designed site. When I started with my first site (using JUST a text editor like notepad to write the HTML code with), I didn't know anything about "Tables" or other design formatting techniques. As a result, it proved VERY difficult to get (and KEEP) the page layout the way I wanted it. One VERY important thing to remember when designing a WEB page is that it IS NOT like laying out a paper page. Once your paper page is laid out and printed, EVERYONE sees pretty much the same thing -- as you designed it. NOT SO with a WEB page !! The actual look varies with different WEB browsers, as well as how large a font the user has selected to view with. There are advanced techniques to minimize this (like Style Sheets), but I am only going to discuss "Tables" here. It will be indispensable at this point to acquaint yourself with an HTML reference source. I mentioned a few sources in the last column. One that I find invaluable is called the "HTML Reference Library V3.0". Sad to say, I can no longer locate this on the WEB. It is HOWEVER, available on my CD !! Tables basically allow you to divide the WEB page into multiple sections, which can then be formatted independently. Each section of the table becomes more-or-less a separate WEB page, all displayed together as one. You may "nest" tables within tables to arrive at a very complex, precise layout that will remain fairly constant under different viewing conditions. Following is an example of a fairly complex "nested table", together with its HTML code, taken from the "HTML Reference Library":
The second, VERY important issue that I am going to discuss is the use and implementation of images on your page. Tables are VERY important to set and maintain proper text/image placement !! So is the "<img src=>" tag, which is the way images are placed onto the WEB page. There are a number of parameters that are used with this tag. I am going to first cover two of the more MISused, the "height=xx" and "width=xx" tags. These are used to "scale" or to change the apparent, viewed size of the image. I stress the word "APPARENT" here -- the ACTUAL size of the image doesn't change, only the DISPLAYED size. If your original image was 800x600, and you scale it to 80x60, the poor viewer still has to wait for a massive 800x600 image to load into their browser. In a case like this, it is better that you use an image editor to ACTUALLY scale the image to 80x60 size. These tags should ONLY be used for small size changes, mainly if the image is used elsewhere on one or more of your pages in its larger size. Another useful formatting attribute is "align=left". This will force the image to the left margin, and wrap the text around the image at its right. On the other hand, "align=right" will align the image to the right margin, and the text wraps around the left. Use "hspace=xx" and vspace=xx" to set horizontal and vertical margins between the text and image. "Align=middle" will align the text at the middle (vertically) of the image -- very good if you are using a single line of text with an image. Three excellent, FREE image editors may be found [ HERE ], [ HERE ] and [ HERE ]. Another image consideration is to OPTIMIZE the images as to size in BYTES. This means to reduce the actual number of bytes in the image without changing its dimensions. For GIF files, this usually means reducing the number of colors in the image. For JPG files, it is more involved. Here it is accomplished by using complex algorithms that eliminate redundancies in the image structure. You can often compress a JPG image by up to 50% without too much image degradation. However, 10-25% is usually optimal. I have taken an UNoptimized JPG image, compressed it by 25%, and had the byte size reduced by over 50% with NO noticeable change in image quality. Given a choice, it is usually better to use a JPG image rather than a GIF. Also, convert GIF's to JPG's. JPG usually produces a better image at a smaller size. The good news is that there are FREE image processing programs that do this for you, simply and efficiently.
Many people place images on their WEB pages that are hundreds of KB (or MORE) in size. This is a terrible burden on people that are still using dialup Internet connections. This is part of observing and considering your viewer's experience that we discussed in a previous column. While YOU may have a fast, broadband Internet connection, a vast number of your viewers only have a 56K (or slower) dialup connection. A page that loads instantly for you MIGHT take upwards to 30 sec. for them. The same goes for using large, useless Flash presentations (a form of animated WEB display). When I was still using a dialup connection, if I encountered a WEB page that took forever to load, I would just MOVE ON !! Remember, the MAIN purpose of the site that you are designing is to attract fish (viewers). It IS NOT to show off your own personal likes and/or idiosyncrasies !! We will discuss this and related topics in a later column. The last item that I am going to cover today is slightly off-topic, but it is part of HTML coding. If you are going to reference an "off-site URL" (one directing your visitor to a DIFFERENT domain than yours), I would suggest that you use the "target=_blank" parameter. It would look like this "<a href=http://www.offsite.com/page.htm target=_blank>". Make sure that you have a space before the "t" in "target" and an underscore "_" before the "b" in "blank". This will cause the new URL to open up a new browser window. It will help return the visitor back to YOUR site when they are done browsing the off-site page !! We are now ready to place one of YOUR luminaries (lights) into the dark abyss of the WEB !! Next column we will discuss publishing your site (making it "Live" on the WEB), "FTP", Internet providers, and other such "mysteries" of the initiate.
 | ||||||||||||||||||||||||
 |
Site Menu |
 |
 |
