article 624

Website Design Tips: HTML, JavaScript codes, tips, tricks and techniques

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.

<A HREF="http://www.yourdomain.com/" TARGET="_blank">Your Link</a>

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:

<IMG SRC="yourimage.gif" WIDTH="200" HEIGHT="2" BORDER="0">

<IMG SRC="yourimage.gif" WIDTH="200" HEIGHT="5" BORDER="0">

<IMG SRC="yourimage.gif" WIDTH="2" HEIGHT="200" BORDER="0">

<IMG SRC="yourimage.gif" WIDTH="5" HEIGHT="200" 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 <TD> tag.

<TABLE BORDER="0" CELLPADDING="2" ALIGN="Center" WIDTH="50%">
<TR>
<TD BACKGROUND="yourimage.gif"></TD>
</TR>
</TABLE>

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 <HEAD> and </HEAD> tags
within your HTML code.

<STYLE>

</STYLE>

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 <BODY> tag.

<body background ="yourimage.gif" bgproperties="fixed">

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