
Getting Started:
Step 1:
Anyone with a computer and an internet connection can create a web site.
You don't have to be a programmer, you just need the desire and a message.
Since the idea is to help you build your own Christian web site, lets pray
for a message that will inspire or aid others in their walk with Jesus Christ.
In fact, that is the first step. Prayer!!
Step 2 :
Arm yourself with some tools. You don't have to know HTML to create web pages,
but it helps. HTML is Hypertext Markup Language. This is the language used
to format pages for your website.
There are a great many books on HTML as well as several very helpful web
sites. I recommend:
HTML for DUMMIES by Ed Tittle &
Stephen James
and
HTML Goodies by Dr. Joe Burns.
You should also get Web Authoring & Publishing Software. This will allow
you to create web pages without having to learn HTML. It will generate the
HTML code for you.
Even if you are an HTML expert, these packages can save you a great deal
of time and frustration. They are extremely helpful when building tables.
If you don't have the money to buy one of these packages, I suggest:
AOLpress (from America OnLine)
or
MicroSoft FrontPage Express (Internet
Explorer ver. 4.0).
Both are free and will do everything you need to do and more.
Step 3:
You will need to decide where you want to house your web site. There are
several choices. If you plan on keeping the site small, I would recommend
that you look into the many places on the internet that offer free space
for your personal pages. Your internet service provider may offer free space
with your account.
The problem with free space is that the URL (the name your web site is accessed
by can become complicated. For example, this web site used to be at URL
http://members.aol.com/seven77ima/.
This is much more
difficult to remember (and promote) than say www.777images.com.
|

Types of Graphics:
Images, (backgrounds, borders, pictures, bar, buttons, etc.) are the things
that make a web site attractive and allow you to illustrate as well as describe.
Images do slow down the loading of your web pages. You don't want to use
too many or make them too large. If your page takes too long to load, you
will loose your visitors before they get the message. If your site is graphics
intensive, tell your visitors on your home page that the wait is long so
they will know what to expect.
Images for use on web sites come in two varieties (formats). Gif's
or jpg's. There are others, but these are the only ones you
should concern yourself with. Both of these are methods of storing an image
in a compressed format so that they use the minimum amount of space and,
therefore, will load onto you web page faster than other formats.
Generally, .gif formats are used for drawings and simple images. The
.jpg format is used for photographs. The .gif format uses 256
colors and must be used if you wish any portion of the image to be transparent.
The .jpg format uses 16 million colors and will reproduce photographs
nicely.
You can create your own images with a graphics program
such as:
Paint Shop Pro,
Corel Draw,
or
Adobe PhotoShop.
The easy way, however, is to go to the many free graphics
sites (like this one) and just grab their
graphics.
BE CAREFUL
that you don't violate copyright laws. The Copyright
act of 1976 states that material becomes copyrighted as soon as it is published.
It guarantees the owner certain rights to control how that work is used.
BE SURE YOU HAVE
PERMISSION and give them credit for
their work.
|

How to Grab an Image:
To download a graphic, place your mouse pointer over the image you want,
right click your mouse, and select:
Save Picture As.
Determine where and into which file you wish to temporarily store your
graphic.
Create a file name for your graphic (or use the existing file name for the
graphic) and click OK.
Example: yourimage.gif
Just remember where you saved it, so you can find it later.
To install the graphic on your web page, follow the instructions with your
Web Authoring software or use the HTML code:
<IMG SRC="yourimage.gif" >
|

Copying and Using a Background:
Downloading a background is much the same as downloading an image. Find a
spot on the page where the background is located that is vacant (does not
have any pictures), right click your mouse and choose :
Save As Background.
Background images should not be too large. They are usually created as small
as possible and then tiled (or repeated) to create the desired effect. Your
web browser takes care of the tiling so you don't have to worry about it.
To install the background on your page, follow the instructions with your
Web Authoring software or use the HTML code:
<BODY
BACKGROUND="your-bkgrnd.jpg">
|

Adjusting for a Bordered Background:
There are several methods that can be used on bordered backgrounds. However,
many of these techniques fail on different size screens or when the monitor
is set to view a different number of pixels per screen.
Rule of thumb: Use absolute values rather than %'s for any width or
alignment because 25% of a 14" screen is different than 25% of a 17" screen,
etc.
One method that is used quite frequently is to use UL tags to move the
print to the right, off of the border. The problem with this is you have
to do it on every line and it may not look the same on all browsers.
My favorite method is to put the entire page in a table and use a second
table to move the first column over past the border.
First, create a table with two columns and one row.
Next, create a second table within the first column of that table with one
row and one column.
Set the cell spacing (or cell padding ) of the table, to 1/2 the width in
pixels of the border.
You can then put all of your text, more tables or graphics in the second
column.
This should work for all browsers and screen sizes.
Note: The second table serves the purpose of a blank picture pushing the
first table cell out to the width of the border. Using the width command
will also serve the same purpose, but will not work for all browsers.
Example:
I left the table borders visible so you could see what is happening.
Here is the code:
<TABLE >
<TR>
<TD>
Border Here
<TABLE BORDER CELLSPACING="40"
CELLPADDING="0">
<TR>
<TD></TD>
</TR>
</TABLE>
</TD>
<TD Width="200">Text
Here</TD>
</TR>
</TABLE>
You can experiment with the border size if you don't know the width of the
border in pixels. |

Make Those Little Bars Big:
Bars (those purple lines between each of these boxes) can be created
in HTML code with the command:
<HR>
These lines, though, are a rather uninspiring grey. If you wish to use more
colorful bars, you have to use images.
Bars are usually made small so they don't take up too much valuable space
and will load fast on your page. Our bars, generally, need some adjustment
to use on your page.
For example: If you downloaded the purple bar you see on this page
and loaded it out on your web page as is, you would see something like this.
To make the bar stretch across the page, you need to adjust the HTML code
by locating something like this:
<IMG SRC="bar.gif" WIDTH="200"
HEIGHT="5">
and changing it to something like this:
<IMG SRC="bar.gif" WIDTH="400"
HEIGHT="4">
This will give you a bar like the one below this box.
You can make the bar any width ( Not too wide or you will have everyone scrolling
from here to eternity). Keep the height at 3, 4 or 5 pixels. |

Testing, Testing, Testing:
It may come as no surprise to you that not every computer is the same. What
will surprise you is that the first time you view your masterpiece of a web
page on someone else's computer is that it may not resemble what you initially
intended at all.
Colors that may look beautiful and vibrant on a computer with special graphics
card may look washed out on a computer with 256 color graphics card.
A web page that lines up perfectly on your 17" screen with Internet Explorer
V.3.0 may look like it wandered a bit on a 21" screen with Netscape
Navigator, etc.
The trick is to test your web site as many ways and on as many computers
and with as many browsers as possible. |
[ JavaScripts ] [ HMTL TIPS ] [ Links ] [ Color Cubes ]
|