How to Make Website Templates
Templates are useful for common Web design, and can be sold to others for a good profit. Templates can be easily created with a few simple design tools. Artistic skill can help greatly in the process, but isn't required.
Things You'll Need
- Adobe Photoshop 6+ (see Resources below) or The GIMP (see resources below) Adobe Dreamweaver (see Resources below)
Instructions
-
Creating the Graphic Design
-
1
Open Photoshop and create a new image with a resolution of 1024 x 768. Make sure the image has a transparent background.
-
2
Use the filler tool to create a background color for the page. Then, in the "Filters" section of the file menu, click on the "Texturizer" tool. Apply a texture to the color.
-
-
3
Create a new layer, and use the rectangle or rounded rectangle tools to create a navigation bar and content and logo boxes.
-
4
Right-click on the layer that the boxes are in, and select "Blending Options." This will open a menu where you can apply bevels, drop shadows and many other effects to the boxes.
-
5
Save the file as a .jpg image in your Web template folder.
Creating the HTML Template
-
6
Open Dreamweaver and create a new .html file.
-
7
Create a new layer, and insert the image you just created. Click on "Page Properties" at the bottom of the screen, and match the page's background with the background of the image.
-
8
Select the image, and use the rectangle, oval, and polygon tools at the bottom left of the screen to create hot spots around all your navigation buttons.
-
9
Save the file as "template.html"
-
1
Tips & Warnings
Take your time when creating the template design image.
Always use your own work when creating publishable content.
Resources
- Photo Credit www.webtemplatesgallery.com