How to Build a Game Website

Dreamweaver MX

If you are tired of using ugly templates and cheap web page design engines, then it's time to make your own website for your game. The process, with the right tools, is within reach even for those with very little web design experience. By following the right steps, you can turn your creativity into a user-friendly online home for your game.

Things You'll Need

• Adobe Photoshop 6+ or The GIMP (See Resources below)
• Adobe Dreamweaver (See Resources below)

Instructions

Organizing the Materials

1. Create a folder for your website anywhere you desire on your hard drive.

2. Create a sub-folder in this web page folder called images.

3. Place all images you will be using on your website in this folder.

Creating the Design

1. Decide on a color scheme that you will use for your webpage. It's usually best to stick with three or four colors to create unity within the page.

2. Open Adobe Photoshop or the GIMP and create an image with a resolution of 1024 x 768 pixels and a transparent background.

3. 

   Begin the layout of the design using the rectangle tools or any other block tools that you wish to use. Keep all parts of the design in separate layers. Build a body section, where you can add the text for the page, then create a navigation section, that will have links to all of your separate pages. Bring in any borders and textures that you desire. Lastly, bring in your game's logo and place it as desired at the top of the page.

4. Finish the layout design by adding copyright text at the bottom. Then, save the image as a .jpg in the images folder of your website folder.

Adding Content

1. In Dreamweaver, create a new web page. Begin by designing the template page. This is what you will use to create all of the other pages on your website. Firstly, create a layer and bring in your template image. Then, match the background of the page with the background of your template image. Finally, create hot-spots around all of your navigation links and direct the URL to the other pages that will be on your site.

2. Using your template, create all the other pages that you wish to have on your site. Add all of the content you wish to have in the block section of your design.

3. Create new pages and links for your site as desired.

Tips & Warnings

• Take time and care when creating the layout design of your web page. This will greatly affect whether or not your website looks professional and legitimate.

• Always use your own work when making publishable content.

Resources

• Read this Article in Spanish
• Adobe Photoshop CS4 (photo editor)
• The GIMP (photo editor)
• Adobe Dreamweaver CS4 (web editor)