The Slice Tool
This requires NO graphic skill, and has *some* good results, though i only suggest it for those who arent code savy 
.
Step 1:
Grab your template you made in photoshop. I just whipped up a basic design using an old image for the banner. Once its open, do all your final touches.
Step 2:
Now that its done the way you want, grab your slice tool (
)
Use this to select key areas, as follows:
Basically what this tool does, is it splits up your site into different areas, so that when you do a save for web, it'll save it as an HTML document, and it will create a folder with all the images for the HTML document in it. So all you'll have to do is upload the HTML document, do some minor editing to make it work smoother, and upload the images.
-
Step 3
Double click the small blue slices, the boxes that you created over your individual links. MAKE SURE ITS ONE SLICE PER LINK! Double click each slice, and go to the box shown below, and fill in the location. For example, if its going to link to your tutorial page, put in tutorials.html in this slot. Do this for EVERY link you have. It doesnt have to be just links, you can do this on any slice, but know that if you do, it will act as a link in the HTML document. So dont go crazy using this for every slice.. I like to make my banners sliced so that it leads back to the home page, which is usually "index.html."
Step 4
You're done! Go to file < save for web, and save it anywhere you want. I suggest you know a little HTML, so you can fix the content area which will be a little odd, because it will be a picture. Just set it as a background, if you want the easy way out.
All images and content in this tutorial is copywrite © 2003-2004 VDCore Designs. All rights reserved. Any duplication of anything in this tutorial WILL result in legal action and a permanant banning from the VDCore Community. Report all rippings and/or missuse of this tutorial to any admin.
.Step 1:
Grab your template you made in photoshop. I just whipped up a basic design using an old image for the banner. Once its open, do all your final touches.
Step 2:
Now that its done the way you want, grab your slice tool (
) Use this to select key areas, as follows:
- Key Areas
- All Links
- Content sections, such as where your news and updates will be, or whatever site content you have. Examples are the tutorials themselves, the game walkthrough, or whatever your site is on.
Basically what this tool does, is it splits up your site into different areas, so that when you do a save for web, it'll save it as an HTML document, and it will create a folder with all the images for the HTML document in it. So all you'll have to do is upload the HTML document, do some minor editing to make it work smoother, and upload the images.
-
Step 3
Double click the small blue slices, the boxes that you created over your individual links. MAKE SURE ITS ONE SLICE PER LINK! Double click each slice, and go to the box shown below, and fill in the location. For example, if its going to link to your tutorial page, put in tutorials.html in this slot. Do this for EVERY link you have. It doesnt have to be just links, you can do this on any slice, but know that if you do, it will act as a link in the HTML document. So dont go crazy using this for every slice.
. I like to make my banners sliced so that it leads back to the home page, which is usually "index.html."Step 4
You're done! Go to file < save for web, and save it anywhere you want. I suggest you know a little HTML, so you can fix the content area which will be a little odd, because it will be a picture. Just set it as a background, if you want the easy way out.
All images and content in this tutorial is copywrite © 2003-2004 VDCore Designs. All rights reserved. Any duplication of anything in this tutorial WILL result in legal action and a permanant banning from the VDCore Community. Report all rippings and/or missuse of this tutorial to any admin.
