WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES - 9

Web Source Web Design Tips

by Shelley Lowery

Highlighting Free for All Links

You can use the code below to highlight your link in some

free for all sites. This code will not work on all free

for all sites, but if you scroll down the page and see some

links already highlighted, you'll know it works. Instead of

typing in your web address, place the code below, with your

web address, into the free for all form.

http://www.yourdomain.com/" STYLE="background:yellow;

color:black

You can change the colors to whatever you'd like, but keep

in mind, the text must be visible on the background color.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Open A New Window With A Button or Link

Button:

('yourfile.htm')">

Link:

openwindowlink()">Open Window

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Close A window With A Button or Link

Button:

onclick="window.close()">

Link:

Close Window

Place either code where you would like the button or link

to appear.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Open A Window on Page Load

The code below will open a new window when a web page loads.

This window may be customized to any size you'd like. Place

this code under the tag within your HTML.

This window will have scrollbars and will be resizable.

The height and width are set to 320, but may be changed to

whatever you'd like. If you'd rather not have the scrollbars,

you can remove the words "scrollbars and resizable."

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Reload A Window With A Button or Link

Button:

onclick="window.location.reload()">

Link:

Reload Window

Place either code where you would like the button or link to appear.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES - 8

Web Source Web Design Tips

by Shelley Lowery

Setting Web Page Margins (MSIE)

You can remove the top, bottom and side page margins

on a web page by adding the following code within

your tag.

rightmargin=0>

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Creating A Mouseover Text Description

You can create a mouseover text description, similar to

an image alt tag, that will be viewed when the mouse is

placed over your text. Place title="your text description"

within your HTML link code.

description">

In addition, you can display your description text in a

list by adding these characters .

Resources:

Counters

Guestbooks

Autoresponders

and more...#10;

This description would be displayed like this:

Webmaster Resources:

Counters

Guestbooks

Autoresponders

and more...

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Auto Fill Email Subject

You can create an email link that will automatically

fill in the subject line when clicked on. Add the

following code to your HTML.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Creating A Status Bar Link Description

You can display a description in the status bar for

all of your links. When the mouse is placed over a

link, the link description will be viewed in the

status bar.

status='Your text description'; return true" onmouseout=

"window.status='';return true">Your linked text

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Displaying Text with an Image

To display your text wrapping around an image, place

the following code within your tag followed by

your text.

Image Displayed on Left:

Your Text

Image Displayed on Right:

Your

Text

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES - 7

Web Source Web Design Tips

by Shelley Lowery

Replacing Your Standard Bullets With Graphic Bullets

You can use graphic bullets to replace the standard

text bullets by using the "Definition List" tag.

List Item one

List Item two

List Item three

List Item four

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Creating A Placeholder for an Empty Table Cell

Without using a placeholder within your blank table cells,

your empty table cell borders will not display.

By simply adding the character code within your HTML,

your table cell will be visible.

Your Text		Your Text
	Your Text

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Customizing Link Styles

Removing A Link Underline:

You can remove the underline of an individual link by

adding the STYLE tag to your link HTML.

DECORATION: NONE">Your Link

Changing Link Colors:

You can change the color of an individual link by adding

a font tag in front of your linked text.

COLOR="#FF0000">

Your Link

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Linking To A Specific Location in A Web Page

You can create a link within the same page by adding "

the following codes.

STEP 1

Select the area you want the link to take you to when

clicked on and place this code with any name you'd like.

This will create an anchor for your link.

Anyname

STEP 2

Create your link and make sure you use the same name

as you used in your anchor:

Click Here

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES - 6

Web Source Web Design Tips

by Shelley Lowery

Open a Web Page in a New Window

When you link to outside web pages, you may not want to

completely lose your visitor. By creating a link to other

web sites that opens in a new window, your web page will

remain open as well.

To open a web page in a new window, add the following

code to your link.

Your

Link

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Using An Image To Create A Line

You can use an image to create a vertical or horizontal

line in a web page.

Create a 2 pixel by 2 pixel image in the color of your

choice. This single image can be used to create a vertical

or horizontal line on your web page simply by changing the

HEIGHT and WIDTH attributes.

Examples:

BORDER="0">

BORDER="0">

BORDER="0">

BORDER="0">

When creating a vertical line, you'll need to set up a

table to display your text on each size of the line.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Adding An Image Background To Your Tables

You can add an image background to your table cells by

adding BACKGROUND="yourimage.gif" to your tag.

WIDTH="50%">

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Using Style Tags For Mouseover Link Effects

You can create special mouseover link effects by placing

the following code between the and tags

within your HTML code.

In this example, the active text link is underlined with

the color set to #0000FF. When the mouse is placed over

the link, the text color will change to #FF0000 and the

underline disappears.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

How To Make Your Background Image Stationary

Stationary background images remain in one place even

when scrolling through the page. Only the text will

move. To create this effect, place the code below

within your tag.

When selecting your background image, keep in mind that

your text will be moving over your image, so try to select

an image that won't make your text difficult to read.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES - 5

Web Source Web Design Tips

by Shelley Lowery

Customizing Your Lists

The ORDERED LIST tag is used to create a numbered list

to display your list text.

1. List item 1

2. List item 2

3. List item 3

4. List item 4

To display your list with letters (a,b,c,d) instead of

numbers (1,2,3,4) add to the

tag.

1. List item 1

2. List item 2

3. List item 3

4. List item 4

To display your list with Roman numerals, add

to the

tag.

1. List item 1

2. List item 2

3. List item 3

4. List item 4

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Decreasing Text Size Without the Font Tag

The SMALL tag is used to decrease the size of your font.

You can add additional SMALL tags, side by side, to decrease

your font size even further. For each additional SMALL tag you

use, your font size will decrease.

Example:

Your Text

Your Text

The SMALL tag can be used in place of the FONT tag, as they

both perform the same task.

Example:

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Setting Table Widths

The TABLE tag is the opening tag used to create a table

within a web page.

You can specify your TABLE width as a set number value or

use a percentage.

SET WIDTH VALUE:

WIDTH="600">

Column 1

Column 2

PERCENTAGE WIDTH VALUE:

WIDTH="100%">

Column 1

Column 2

In addition, you can set the widths of your TABLE columns to

display your columns at a specific width.

WIDTH="100%">

Column 1

Column 2

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Adding Color to Table Borders

The TABLE tag is the opening tag used to create a table

within a web page.

You can add color to your TABLE borders by adding

BORDERCOLOR="#336699" within your TABLE tag.

CELLPADDING="2"

CELLSPACING="2" WIDTH="100%">

Column 1

Column 2

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Adding Color to Table Cells

The TABLE tag is the opening tag used to create a table

within a web page.

To add color to your TABLE cells, add BGCOLOR="#CCCCCC"

within the tag.

WIDTH="100%">

Column 1	Column 2
Row 2	Row 2

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES- 4

Web Source Web Design Tips

by Shelley Lowery

Creating A Customized Marquee

The MARQUEE tag is used to scroll text across a web page

and is only supported by Microsoft Internet Explorer.

You can change the background color, width, the number of

times your message will scroll and the speed that your

text scrolls, by adding the following attributes within

your MARQUEE tag.

BGCOLOR="#CCCCCC" - background color

LOOP - Determines how many times the text will scroll.

-1 is indefinite and will continuously scroll. You can set this to

whatever you'd like.

SCROLLAMOUNT - Determines the speed your text will scroll.

WIDTH - Determines the width of your marquee.

width="100%">Example Marquee

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Using META Tags for Search Engine Indexing

Meta tags are used to give detailed instructions, in

regard to a web page, to the Search Engines and browsers.

You can provide the Search Engines with a description of

your web page and the most relevant "keywords" for your

web site by adding the following META tags between the

and tags of your HTML.

When selecting your keywords, it is best to list them within

a phrase. Try to concentrate on only a few keyword phrases

throughout your text.

Example:

dog grooming techniques,groomers,tips,pet supplies,animal care,

Try to select keyword phrases that your potential visitor

may type in while at a Search Engine.

The keywords above will cover a wide variety of queries:

dog

dog grooming

dog groomers

grooming techniques

dog grooming techniques

dog groomer techniques

dog grooming tips

dog groomer tips

grooming tips

dog care

dog supplies

animal care

pet care

pet supplies

pet grooming

pet groomers

animal grooming

animal groomers

grooming supplies

dog grooming supplies

pet grooming supplies

Try not to repeat your META keywords more than three times.

To cover the many different ways your potential visitor may

type in their search terms, type your META keywords in a few

different styles.

Example:

techniques,groomers, tips,pet supplies,animal care,Dog Grooming

Techniques,Groomers, Tips,Pet Supplies,Animal Care,DOG

GROOMING TECHNIQUES,GROOMERS, TIPS,PET

SUPPLIES,ANIMAL CARE">

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Using META Tags to Redirect

Meta tags are used to give detailed instructions, in

regard to a web page, to the Search Engines and browsers.

You can automatically redirect your visitors to another

web page by adding the following META tag between the

and tags of your HTML.

/www.yourdomain.com/">

The CONTENT attribute tells the browser to redirect the

visitor to the URL you specify in 4 seconds. This can be

changed to whatever you'd like.

If you move your web site to a new location, this tag

provides a great way to automatically redirect your visitors.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Using META Tags to Prevent Browser Cache

Meta tags are used to give detailed instructions, in

regard to a web page, to the Search Engines and browsers.

When visiting a web site, your browser will cache or make

a copy of the web site for fasting viewing your next visit.

This will prevent your regular visitors from seeing your

new content unless they manually reload their browser.

To prevent this problem, add the following code between

the and tags of your HTML.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Using META Tags to Prevent Search Engine Indexing

Meta tags are used to give detailed instructions, in

regard to a web page, to the Search Engines and browsers.

Many times, you may have a web page that you don't want

the Search Engines to index. To help with this problem,

add one of the following codes between the and

tags of your HTML.

This tag tells the robots not to index this page and not

to follow any links within the page.

This tag tells the robots not to index this page, but

follow any links within the page.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS, TRICKS AND TECHNIQUES - 13

Web Source Web Design Tips

by Shelley Lowery

Java Anyone?

When designing a new website, you'll probably be tempted

to use all of the fancy techniques to create special

effects, however, try not to go overboard. With each effect

you add to your website, it will take that much more time

for your website to load.

Select your scripts carefully. Most browsers now support

JavaScript, so using this type of script will probably be

your best choice. Keep in mind, JavaScript and Java are

two totally different languages and are not in any way

connected.

If you must use Java on your site, use it sparingly. Java

can be slow and has a tendency to crash browsers. It can

also add a lot of time to your websites load time.

Scripts to Avoid When Designing a Professional Site:

- Pop up boxes asking for your visitor's name

- disabling the browsers back button

- continuous alert messages

- scrolling messages in the status bar

- large scrolling text

- fancy cursors

- cursor trailers

- automatic transfers on mouseovers

This list represents only a small portion of the types

of scripts you should avoid. These scripts are not only

very irritating, but they're a big waste of your visitors

time. If you want your visitors to return, use scripts

that will compliment your website.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Make Sure Your Website Looks Great to Everyone

When designing a website, your first consideration should

be browser compatibility. Your website may look great

when viewed with Internet Explorer, but when viewed

through Netscape Navigator, everything may not be formatted

properly.

All web browsers are not created equally. View your site

through different browsers and screen resolutions so you will

see how your visitors will view your site.

A good way to see how your website will look through

both browsers, is to download and install a copy of both

Internet Explorer and Netscape Navigator.

Netscape - http://www.netscape.com/download/

Microsoft - http://www.microsoft.com/downloads/search.asp?

Visit the following websites to view your website through

different browsers and screen resolutions:

Site Inspector - Check your web pages for HTML validity and

browser compatibility.

http://www.siteinspector.com/

NetMechanic - Provides a variety of free services for

your web site including; browser compatibility testing,

graphic file size reduction, link check, HTML check,

load time check, spell check and more.

http://www.netmechanic.com/

Make sure you view your first web page in different

browsers and screen resolutions. Once you get it looking

great for everyone, you can use it as a template for the

rest of your website. This technique can save you a great

deal of time.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Selecting A Quality Web Host

When selecting a professional web host your first

consideration should be the company. Check out their

background. Talk to some of their customers and ask

them if they've been satisfied with their service.

- How many customers do they serve?

- What is their uptime percentage?

- Do they require you to make payments in advance?

- Do they charge set up fees?

- How is their customer support? Test them.

- Do they offer fast connections?

- Do they offer shopping cart software to process your orders?

- Can you upgrade free of charge?

Web hosting prices vary greatly. When selecting your

host, make sure you're getting exactly what you're

paying for. Keep in mind, a lower monthly rate will

not benefit you if your site is down a lot, slow, or

customer service is poor.

-> Basic Criteria for selecting a host <-

Selecting a professional web host is a very important

decision. Make sure you do your homework and insure

the host you select offers exactly what you need.

- Your own domain name (www.yourname.com)

- Your own True POP email account - name@yourdomain.com

- Fast, low overhead, Multi-T3 access

- Your own unrestricted cgi-bin

- Access to SSL Encryption for secure transactions

- Java, C, C++, Tcl support

- Autoresponders

- htaccess Password Protection for your files

- At least 1 GIGABYTE (1024 MB) of Daily Transfer

- Design (and upload to) your site using Netscape or other HTML

editing software

- Microsoft Frontpage (98) Server Extensions for those utilizing

Frontpage

- Unlimited free access to your server via Telnet/FTP

- Online invoices, account tracking, and payment history to enable

you to check your account balance, monthly invoices, past payments,

etc.

- Complete daily server backup

- Easy access to your log files

- Statistics on visits to your site

Free web hosts are great for hosting a personal web site,

but not recommended for a business site. If you're really

serious about your business and want to establish your

Internet presence, I highly recommend Virtualis. Their

tech support is the best I've seen.

http://www.virtualis.com/vr/slowery

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Registering Your Domain Name as a Trademark

If you have a registered domain name that doesn't infringe

upon any trademarks, you may be able to register a trademark.

Registering a domain name as a trademark isn't easy, but it

can be done. Although you can't register the http://www.or

the .com, if the use of your name fits the laws criteria,

it can be registered. You should consult with an attorney

familiar with the Internet, trademarks and the laws prior

to registering your domain name as a trademark.

For a complete explanation, visit:

http://www.uspto.gov/web/offices/tac/notices/guide299.htm

As stated by the United States Patent and Trademark Office,

http://www.uspto.gov/ "A mark composed of a domain name is

registrable as a trademark or service mark only if it

functions as a source identifier. The mark as depicted on

the specimens must be presented in a manner that will be

perceived by potential purchasers as indicating source and

not as merely an informational indication of the domain

name address used to access a web site." In other words,

the use of a domain name must not be used simply as an

address to direct customers to your web site, but must be

used to identify the products or services of the business

claiming the trademark, which provides products or services

via the Internet.

If you're in the market for a domain name, you may want to

consider searching the Trademark Electronic Search System,

http://tess.uspto.gov/bin/gate.exe?f=login&p_lang=english&p_d=trmk

prior to registering a domain name. By researching the

trademark regulations and knowing your rights, whether you

hold a trademark or a domain name, you may be able to avoid

the possibility of litigation.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Ditch Those Banner Ads

If you're designing an ecommerce website, instead of

displaying banners ads, write a review.

On your main page, display a short intriguing paragraph

with a link to your full review.

Write your review like an outline of the product. Pack

it with all the benefits the product has to offer and

provide your personal endorsement. Keep in mind, you

don't want it to sound like a sales letter.

The last line of the review should lead your visitor

to the affiliate website.

Once you've gained your potential customers trust, your

personal recommendation will carry a lot of weight. Keep

in mind, you should only recommend a product that you

have actually reviewed and truly believe in. Never

recommend a product without putting it to the test, as

your professional reputation is on the line.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES - 12

Web Source Web Design Tips

by Shelley Lowery

Let Your Visitors Know What You're Offering

The main page of your website should specifically let your

visitors know exactly what you're offering. How many times

have you visited a site and never figured out exactly what

they were selling? If your potential customer can't find

your product or service, they definitely won't waste a lot

of time looking for it. They'll go on to the next site and

probably never return.

They're visiting your site for a specific purpose. They

want something your site offers. Whether it is information,

a product or service.

The easier you make your ordering process, the more sales

you'll make. From the moment your visitor enters your

website to completing an order, all play an important role.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Have You Told Your Visitors About Their Privacy?

More and more, privacy is becoming an important issue

with your visitors. They want to know exactly what you're

planning to do with their personal information you collect.

Create a page on your website called, "Privacy Statement,"

and let your visitors know your intentions.

- How do you plan on using their information

- Is their information sold or shared with a third party

- Why do you collect their email address and how will it be used

- Why do you track their IP address

- Let your visitors know that you're not responsible for the privacy

issues of any outside websites you may be linking to

- Why do you use order forms and what do you do with the

information acquired

- Do you run contests and what do you do with the information

- Do you have a discussion forum or message board? Let your

visitors know that any information that is disclosed in these

areas becomes public information and they should exercise caution

- Do you have security measures in place to protect the loss,

misuse and alteration of the information under your control? If so, let

your visitors know

- Let your visitors know how they can opt out of your mailing lists

- Provide your visitors with your contact information, should they have

any questions in regard to your privacy statement.

Visit Web Source to view our "Privacy Statement."

http://www.web-source.net/privacy.htm

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Check Your Website for Errors

ALWAYS check and double-check your website for spelling

errors and make sure your images and links are all working

properly.

If you have several errors, this will make your site appear

to be unprofessional. If you are designing your site using

an HTML editor, use spell check. Proper grammar is also

very important.

If you've been out of school for a while, it's probably a good

idea to refresh your memory. Visit any of the following sites

for a crash course in writing and grammar.

- Guide to Grammar and Writing -

http://webster.commnet.edu/HP/pages/darling/original.htm

- A Blue Book of Grammar and Punctuation -

http://www.grammarbook.com/

- Exploring English -

http://www.shared-visions.com/explore/english/

- Simpler Words And Phrases -

http://www.smartbiz.com/sbs/arts/tpl5.htm

Take some time to really look at your website. Read your

copy many times over, as some mistakes your spell check won't

catch.

A well designed, professionally presented website will make

the sales.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Provide Easy Website Navigation

When designing a website, easy navigation is a necessity.

Every page you create should contain good navigational links

to enable your visitors to easily find what they're looking

for.

Place your navigation links together at the top, bottom, left

or right side of the page. Try to keep the number of clicks

required to get from your main page to any other page on your

site, down to four. Use tables to neatly align your links.

If you are planning on using graphic buttons to navigate

your site, keep in mind that with each graphic you add to

your page, it will take that much longer for your page to

load. If you only have a handful of navigational links,

using graphic buttons will be fine, but if you have over six

links, it would be wise to simply use text links to keep your

load time down.

There are many JavaScripts available online to assist you

in setting up a good navigational system. Visit any of the

following websites to pick up some free scripts:

ScriptSearch - http://www.scriptsearch.com/

JavaScript Source - http://javascript.internet.com/

Website Abstraction - http://www.wsabstract.com/

Javascripts.com - http://javascripts.earthweb.com/toc.cfm

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

To Frame or not To Frame

Frames can either compliment a website or make it look

unprofessional.

If you must use frames, use them sparingly. If not used

properly, frames can make your content very difficult to

view. Avoid making your visitors have to scroll from side

to side to view your content. This can be very irritating

and cause your visitors to leave and they'll probably

never return.

Consider using small borderless frames at the top or bottom

of your page that blends in with the rest of your website.

In addition, try to only use a couple of framesets. A

website divided up into several frames not only looks bad,

but is a nightmare to view and navigate.

If you must use frames, offer your visitors a choice.

Frames verses No Frames.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES - 11

Website Design Tips: HTML, JavaScript codes, tips,

tricks and techniques

Web Source Web Design Tips

by Shelley Lowery

Preloading An Image

Place this code between your and tags.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Creating An Automatic Drop Down Navigation Menu

This is a simple navigation script that will redirect your

visitors with a drop down menu that will automatically

advance to the selected page without a submit button.

Place this script where you'd like your menu to appear.

You can add as many links as you like, but keep in mind

you must use full URLs, starting with "http," when linking

to web sites outside of your own.

Choose a Link Page One Page Two Page Three

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Decreasing A Website's Load Time

The main page of your web site should load in 8 seconds or

less with a 56K modem.

According to two recent surveys, conducted by Forrester

Research and Gartner Group, ecommerce sites are losing $1.1

to $1.3 billion in revenue each year due to customers click-

away caused by slow loading sites.

Tips for keeping your load time down:

- Avoid large, slow loading graphics

- Avoid using too many graphics and/or banners

- Avoid using too many animated graphics

- Optimize your graphics

- Avoid using any unnecessary code

- Avoid making your pages too large

- Avoid using too much Java

- Avoid using too many JavaScripts

If a page takes too long to load, your potential

customer will not wait. Ultimately costing you business.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Don't Forget Your META tags

When designing a website, make sure you include proper META

tags in the HTML of each page. META tags are HTML code that

enable the search engines to determine what keywords are

relevant to a specific site.

About 80 percent of all web site traffic originates from

the eight major search engines. It would be a good idea to

make sure you've done your homework and fully understand how

to optimize your web pages prior to designing your website.

This will save you a lot of headaches in the long run.

Yahoo - http://www.yahoo.com/

AltaVista - http://www.altavista.com/av/content/addurl.htm/

Hotbot - http://www.hotbot.com/addurl.asp/

Lycos - http://www.lycos.com/addasite.html/

Excite - http://www.excite.com/info/add_url/

InfoSeek - http://infoseek.go.com/AddUrl?pg=SubmitUrl.html/

WebCrawler - http://www.webcrawler.com/info/add_url/

NorthernLight - http://www.northernlight.com/docs/regurl_help.html/

For further information on META tags read the tutorial

entitled, "Building Your Site."

- http://www.web-source.net/building.htm

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Selecting the Perfect Background for Your Website

When selecting a background for your website, make sure you

select a background that will compliment your text and design.

Tips for design:

- Busy backgrounds make text difficult to read and draw the

attention away from the text.

- Always be consistent with your background theme on each

page of your site.

- Colors affect your mood and will have an affect on your

visitors as well. Bright colors such as yellow and orange,

cause you to become more cheerful or happy, while colors

such as blue and purple have a calming effect. Dark colors

such as brown and black have a depressing effect. A good

rule of thumb would be to select colors based upon the

type of effect you're trying to achieve.

The appearance of your website can mean the difference

between your success and failure.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES - 10

Web Source Web Design Tips

by Shelley Lowery

Back to Previous Page With A Button or Link

Button:

onClick="javascript: history.go(-1)">

Link:

Back

Place either code where you would like the button or link to appear.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Button Email Prompt

onClick="location.href='mailto:you@yourdomain.com'">

This code will create a button that when clicked on, will

launch the users email program. You can change the value

words to whatever you'd like your button to say.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

On MouseOver Alert Box

Place link text here

This code will open an alert box when your mouse moves

over the link. This alert box will make a sound and display

a small box with your message and an "OK" button. The box

will close when the "OK" button is clicked.

This alert can be used to inform your visitors of a special

event, news, or information.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Prevent Your Site From Being Framed

Add this code inside your tag.

By adding this code to your body tag, you will ensure your

web site won't be framed. If your link is included within

a frameset, when clicked on, it will open in a new window.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Creating A Download Link

If you have access to ftp, you can create a download link

like this:

If you don't have access to ftp, you can create a download

link like this:

Instruct your visitors to hold the "shift" key down while

they click on the download link.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES - 3

Web Source Web Design Tips

by Shelley Lowery

Customizing Your Input Boxes

The INPUT tag is used to create input fields within a

web page form.

You can specify the size of your INPUT box by changing

the SIZE value. In addition, you can change the amount

of text input by changing the MAXLENGTH value.

When specifying the MAXLENGTH value, make sure you

provide your visitors with enough space to type in the

necessary information.

You can display default text within your INPUT box by

adding the VALUE attribute.

Text">

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Adding Color to Your Input Boxes

The INPUT tag is used to create input fields within a

web page form.

You can change the font, input text color, input text size

and the background color of your INPUT box by using the

STYLE attribute.

Verdana; font-weight: bold; font-size: 12px; background-

color: #72A4D2;" size="10" maxlength="30">

In addition, instead of using the standard form submit

button, you can use an image.

border="0">

When using an image to replace the standard submission

button, make sure you include, "BORDER=0," as the Netscape

browser will show a border.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Creating A Default Form Option

The OPTION tag is used to create options listed in a

drop down box of a form.

You can select a default option, by adding the word

"selected" within your OPTION tag.

option 1

option 2

option 3

option 4

option 5

option 6

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Creating A Radio or Checkbox Form

The INPUT tag is used to create input fields within a web page form.

You can create a radio or checkbox selection list by

adding attributes to your INPUT tag.

Option 1

Option 2

Option 3

Selection 1

Selection 2

Selection 3

"You can select a default value by adding the word "checked"

within your INPUT tag.

Option 1

Selection 1

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Changing the Style of Your Bullets

The LIST ITEM tag is used to create bullets to display

your list text.

You can change the style of your bullets by adding

attributes to your

tag.

List item 1

List item 2

List item 3

To create a bulleted list within a list, your code would

look something like this:

• Your text goes here

  • Your text goes here

  • Your text goes here

  • Your text goes here

• Your text goes here

• Your text goes here

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES - 2

Web Source Web Design Tips

by Shelley Lowery

Cascading Style Sheets

The FONT tag is used to display your text in a specific style. Using

fonts within a table requires you to add the FONT tag to each

individual cell. This technique will cause your page to be larger than

necessary.

By using Cascading Style Sheets, you can, not only save yourself a

lot of time, but keep your page size down.

Place the following code between the and tags of

your HTML page.

By using this style sheet, all the text displayed in your table will be

displayed in your specified font and size.

Tip provided by: Web Source: Your Guide to Professional Web

Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Preformat Your Forms

The FORM tag is used to set up input forms on your web site. To

properly align your forms, instead of using a table, use the

 
tag for the same results. Your form will be displayed exactly as you
 
format it within your HTML.
 
 
 
By preformatting your forms, not only will it save you some time, but it
 
will also cut down on your HTML code and speed up your web sites
 
load time.
 
 
 
 
 
Name: 
 
Email:
 
 
 
 
 
Tip provided by: Web Source: Your Guide to Professional Web
 
Design and Development. http://www.web-source.net
 
 
 
----------------------------------------------------------------------
 
 
 
Web Source Web Design Tips
 
by Shelley Lowery
 
 
 
Heading Tags
 
 
 
The HEADING tag is used to display your heading text in a larger font
 
with 
 being the largest down to 
 being the smallest.
 
 
 
Some Search Engines place relevance on text displayed within the
 
 tags, so place some of your most relevant keywords within any
 
of the 6  tags.
 
 
 
Example:
 
 
 
Your Guide to Health & Fitness
 
 
 
When using the HEADING tags, you don't have to use the 
 for
 
your first heading. You may begin with the heading size of your
 
choice, but for your secondary headings, you should not use a larger
 
heading than you began with.
 
In other words, if you're using 
 for your primary heading, then
 
your secondary headings should be 
 or 
 and not 
  or
 
.
 
 
 
Tip provided by: Web Source: Your Guide to Professional Web
 
Design and Development. http://www.web-source.net
 
 
 
----------------------------------------------------------------------
 
 
 
Web Source Web Design Tips
 
by Shelley Lowery
 
Creating Customized Horizontal Rules
 
 
 
The HORIZONTAL RULE tag is used to divide different subjects
 
within your web page.
 
 
 
You can specify the height, width, color and shading values within the
 
 tag.
 
 
 
Examples:
 
 
 
 
 
 
This example will display your horizontal rule across 50% of your
 
page width or if placed within a table cell, 50% of the table cell.
 
 
 
 
 
 
This example will display your horizontal rule across 50% of your
 
page width with the height set to 3. The NOSHADE will display the 
 
 as a solid line.
 
 
 
 
 
 
This example will display a red horizontal rule across 75% of your
 
page.
 
 
 
Tip provided by: Web Source: Your Guide to Professional Web
 
Design and Development. http://www.web-source.net
 
 
 
----------------------------------------------------------------------
 
 
 
Web Source Web Design Tips
 
by Shelley Lowery
 
 
 
Resizing Your Images
 
 
 
The IMAGE tag is used to display images on your web page.
 
 
 
You can resize your image within your HTML by changing the
 
HEIGHT and WIDTH values. To retain your images original
 
characteristics, make sure you adjust the height and the width
 
equally. In other words, if your original graphic dimensions are height
 
50 and width 100, to reduce your image to one half the size, you
 
would change the height to 25 and the width to 50. This technique
 
works best with .jpg images, as .gif images are reduced to a
 
maximum of 256 colors.
 
 
 
In addition, you can add the ALT element to enable you to place your
 
most relevant keywords for Search Engine indexing. The text will only
 
be displayed on your web site while your image loads and when your
 
mouse is over it.
 
 
 
Example:
 
 
 
 
fitness">
 
 
 
Tip provided by: Web Source: Your Guide to Professional Web
 
Design and Development. http://www.web-source.net
 
 
 
This Report may be Distributed in any way and even resold, as long
 
as all information, including bylines above and physical URL's are left
 
intact and article remains unchanged.

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

WEBSITE DESIGN TIPS: HTML, JAVASCRIPT

CODES, TIPS,TRICKS AND TECHNIQUES -1

Web Source Web Design Tips

by Shelley Lowery

Hidden Keywords

The COMMENT tag is used to display text within your HTML

document that will not be visible on your webpage. They

enable you to mark the beginning and end of sections in

your HTML code for easy editing.

You can use the COMMENT tag to place your most relevant

keywords for better Search Engine ranking.

Not all Search Engines acknowledge keywords within the

comment tag, but for the ones that do, it's well worth

taking the time to use them.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Web Page Linking Methods

The ANCHOR tag is used to create a hyperlink.

To link to a page within the same directory of your

website, you only need to include the page name within

your HTML code.

Example:

When linking to a page within your website in a different

directory, you must include the directory name with your

page name.

Example:

When linking to another website, you must include the full

URL beginning with http://www.

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Enlarging Text Without the Font Tag

The BIG tag is used to increase the size of your font.

You can add additional BIG tags, side by side, to increase

your font size even further. For each additional BIG tag you

use, your font size will increase.

Example:

Your Text

Your Text

The BIG tag can be used in place of the FONT tag, as they

both perform the same task.

Example:

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Set Parameters Within the BODY Tag

The BODY tag follows the HEAD tag within your HTML. The

contents of your web page is displayed between the BODY

tags. This includes everything displayed when viewed

through a web browser.

You can set parameters within the BODY tag that will be

used throughout your web page. It isn't necessary to

set parameters, as there is a default setting, but if

you'd like your page to be displayed with colors other

than the default, you have the ability.

Background and Text Colors:

Image Background:

Link Colors:

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

----------------------------------------------------------------------

Web Source Web Design Tips

by Shelley Lowery

Using Font Alternatives

The FONT tag is used to display your text in a specific

style. If your visitor doesn't have the font you specify

on their computer, the font will be displayed in the users

default font setting. To make sure your pages are being

viewed as you intended, set up alternative fonts.

Your Text

This will tell the browser to display your text in

"Verdana," but if your visitor doesn't have "Verdana" to

display your text in "Helvetica" and so on.

In addition, you can add attributes within your font tag

to display your text at a specific size and color as well.

There's no need to create separate tags.

Your Text

Tip provided by: Web Source: Your Guide to Professional

Web Design and Development. http://www.web-source.net

This Report may be Distributed in any way and even resold, as long

as all information, including bylines above and physical URL's are left

intact and article remains unchanged.