Home Navigation Bars Buttons Backgrounds Cool Tricks


NetStudio is very useful for creating your own backgrounds for web pages. If you haven't done so already, read through the brief tutorial about backgrounds on NetStudio's Web Site. It's also in the HELP menu of NetStudio. If you're not aware of how backgrounds to web pages work, they take advantage of something called tiling, which is simply repeating an image over and over again in order to fill your screen. Thus, you can have a small image like this...

...and use it for a background of your web page by inserting the image's name in the BACKGROUND tag of your HTML in order to get this. The same small image is simply repeated over and over.

This tutorial takes advantage of some of the features of NetStudio that I've described elsewhere in this site, so I'm not going to spend a lot of time showing you how to change the color of a selection, resize something, or how to fill an object with an image. If you've read some of my other tutorials, you know how to do that.

When you choose INSERT > BACKGROUND, NetStudio creates an image 1095 pixels wide by 57 pixels high. Your screen will look something like what you see below. As you saw in the other tutorials, this is a thumbnail. Click on it to see a larger version, then use your BACK button to return here.

nsrtbackgrnd.jpg (38411 bytes)

The image that NetStudio created here is the type of background common to many web pages that use the left border for the navigation links and the larger white space to the right for the body of the page. I happen to like that particular layout for a web site, but if you're creating more than one site, you don't want them all to look the same, so you may want to expand your options. You can do that too in NetStudio.

Let's say for a moment that you happen to want to use this type of background, but you just don't want it to look exactly like the one NetStudio has created for you. No problem. You can resize the left border to make it wider or narrower. You can change the color of either portion of it, or even fill it with an image like I did with the left border portion in the background below. In the right portion, I simply applied a left-to-right fade from a light blue to a darker shade.

 

When NetStudio created this background for you, you'll notice they made a thin colored border between the two halves. This was done using the FORMAT > SHADOW feature and choosing a color. NetStudio shows you this in their own tutorial, so I won't duplicate their efforts here. I changed the color of the shadow, however, in order to give it the red vertical line you see in my example.

If you try to fill the right portion of this type of background with an image, however, you won't get very good results. The image won't tile (repeat), it will simply stretch out horizontally and it won't be very recognizable. On the next page I'll show you how to use images in your backgrounds more effectively by just creating the background from scratch.

When designing your page, you can also create tables to separate the different portions of your page and designate different backgrounds for each cell. Or, you can create frames. But, those are HTML topics that I won't go into. Actually, in order to take advantage of a background like the one you see above, you'll need to do tables anyway if you want to have links in the left portion and the body of the page on the right. If you don't know how to do tables and don't want to learn, then stick to a simpler background of all one image or color.

                                                     

Home  Navigation Bars  Buttons  Backgrounds  Cool Tricks  Next Page

Hosted by www.Geocities.ws

1