A webset contains,
one or more backgrounds, link buttons, banner, a divider and author logo.
This lesson will show how to create each part of the webset. Once you are
able to create your own graphics you are no longer caught in the
entanglement of giving credit for the work of another, you are no longer
at risk of being slapped with a copyright issue because the person you
obtained a graphic from lied to you and said it's free for the taking.
These are the chances we take whenever we use any graphic that is not our
own. We don't know if the person offering the graphic is the actual author
of that graphic, so we are taking chances with our sites and our
reputations. Peace of mind comes with learning to create your own
graphics, along with the reward of knowing everything is authentic and you
did it yourself! The background you see at Ask Maggy Mae was designed by
playing with tubes and placing them randomly on the screen. I then used
the effects tools to twist and blend the colors until I saw something that
I really liked. When it was in it's initial stage there was a distinct
line showing where the background image repeated itself but then I played
with the object a little more and using Eye Candy I chose an effect that
offered the seamless tile option.
Although most
tutorials offer a graphic to use and the instructions given are specific
to that graphic, I would prefer that you use your imagination and create
your own. But before you do this you need to imagine for yourself what
your finished product would look like. Once you know what you want you are
ready to start designing. The webset on
this page
took me approximately 5 hours to complete. The finished product is not far
off from the original idea I had.
But
when it came to making he buttons and welcome banner I realized that the
flowers I did put together did not go well with the color scheme of the
backgrounds I had created. Although I planned to use a certain flower
bouquet I had created, it had nothing to do with my backgrounds. The
backgrounds are what you want to start creating. I started with a simple
100X100 graphic with a pink background like the one on the right of this
screen. From there I used the airbrush to add a little color, eventually
after playing with different effects the 5 backgrounds below came from one
simple pink square.
The third and
fifth backgrounds are actually the same background only the third one was
rotated 90 degrees. The fourth background is a copy of the first
background with the Eye Candy water drops filter used and then a slight
adjustment with the brightness and contrast. Background 2 is again a copy
of background 1 then the use of the water drops filter again. With
background four, the last step was using Eye Candy water drops filter with
the seamless tile option checked. Likewise background one was done with
the final step being Eye Candy's swirl filter with the seamless tile
option checked. These two backgrounds appear on a page without
visibly seeing the small square, they appear as one large background. The
other 3 backgrounds give a definite line showing how the background
repeats. To make a seamless tile you will need either Eye Candy or another
filter that will give you the option to make your tile seamless
The next step is
to create your header or logo and your other web buttons. As I said above,
I did create a bouquet of flowers but they did not go well with the
backgrounds so I quickly changed to the flowers you see below. This flower
was a tube and I just created a new image and used the tube tool to add
the graphic to the image. Then I created several other new images and used
the text tool to create the names for each button and the welcome banner.
I then took the entire set and moved it to Animation shop and placed each
name with the flower then cropped the button to compact the graphic as
small as possible. The background and parts of the text are transparent
and they blend in with the page you are creating. I chose the Sterling
font as I was going through my long list of fonts this font stood out
above the rest.
You may notice
that the Guestbook button has both view and sign on it and may be
thinking, why has she done this. The lesson on Image Mapping will deal
with this graphic.
Finally, to make
the divider graphic below I created a new image 600 pixels wide and 100
pixels in height. I then used the Pattern option in Styles and chose
background 2 above for the stroke pattern. I then erased some of the
background from the top and the bottom leaving a line in the middle of the
graphic. Then I used the buttonize effect on the remaining graphic and
finally I shrunk the flowers to a size to fit on the bar I had just
created. I then moved the image from PSP to AS and made it a transparent
image.
That is it, you now
have all the images needed to create a website. A wise thing to do when you
do create websets is to provide information on a page for what font,
coloring, etc you used for your webset as you may not use it right away and
in the future when you do use it, if all this information is readily
available you are prepared in case there is something else you would like to
create to go with the webset. For example, some people who build websets for
use by others will provide a blank button so they can add more button links
with names that they prefer, if the font information was not included it
would be difficult to match the font. The tutorial on
Image Mapping will show you how to use the
guestbook tag.
