John karner
03-15-2011, 07:03 AM
How to Build an HTML CSS Website in Dreamweaver 8
Overview
Though there are many website creation options out there, Dreamweaver 8 is one of the most stable options for creating a professional-looking and stable HTML CSS website. Dreamweaver adds wysiwyg tools and coding tools together effectively, so that your site can be honed to your exact needs. So, with the correct process, you can make your professional-looking website in hardly any time at all.
• Web Design
• Instructions
• Step 1
Create a folder on your hard drive for your complete website. Within this folder, create a sub-folder called "images." In this folder, place all images that you will be using on your site.
• Step 2
Open Photoshop and create a transparent background image with a resolution of 1024 x 768 and 75dpi.
• Step 3
Use the texturing and gradient tools, or other tools that you desire, to create an effective background for your website. Make it cover the entire image.
• Step 4
Create a layout and interface for your website. Use the rectangle tools, texture tools and blending tools to create all the features of your interface. Make sure you have a location to place body text, and also make sure to include a navigation bar, so that users will be able to find their way around your website. Also, include your website's logo at the top of the page, and a copyright section at the bottom.
• Step 5
Save this template as a .jpg file to the "images" folder you created in Step 1.
• Step 6
Open Dreamweaver and begin creating your template page. First create a layer by choosing that option from the file menu. Then select the option "Insert image" from the file menu, and choose your template image. Drag the corners of the layer, and line up the template with the upper-left corner of the page.
• Step 7
Select the background color of the page in the "Page settings" window, and match it with the background color of your template image.
• Step 8
Insert hotspots around all of your navigation links by choosing that option from the file menu. Select these hotspots, and at the bottom of the page, type in the url you will use for their corresponding pages to make hyperlinks to them.
• Step 9
Create all other pages of your website using this template. Add body text, images and all other content you desire to make up your website.
Overview
Though there are many website creation options out there, Dreamweaver 8 is one of the most stable options for creating a professional-looking and stable HTML CSS website. Dreamweaver adds wysiwyg tools and coding tools together effectively, so that your site can be honed to your exact needs. So, with the correct process, you can make your professional-looking website in hardly any time at all.
• Web Design
• Instructions
• Step 1
Create a folder on your hard drive for your complete website. Within this folder, create a sub-folder called "images." In this folder, place all images that you will be using on your site.
• Step 2
Open Photoshop and create a transparent background image with a resolution of 1024 x 768 and 75dpi.
• Step 3
Use the texturing and gradient tools, or other tools that you desire, to create an effective background for your website. Make it cover the entire image.
• Step 4
Create a layout and interface for your website. Use the rectangle tools, texture tools and blending tools to create all the features of your interface. Make sure you have a location to place body text, and also make sure to include a navigation bar, so that users will be able to find their way around your website. Also, include your website's logo at the top of the page, and a copyright section at the bottom.
• Step 5
Save this template as a .jpg file to the "images" folder you created in Step 1.
• Step 6
Open Dreamweaver and begin creating your template page. First create a layer by choosing that option from the file menu. Then select the option "Insert image" from the file menu, and choose your template image. Drag the corners of the layer, and line up the template with the upper-left corner of the page.
• Step 7
Select the background color of the page in the "Page settings" window, and match it with the background color of your template image.
• Step 8
Insert hotspots around all of your navigation links by choosing that option from the file menu. Select these hotspots, and at the bottom of the page, type in the url you will use for their corresponding pages to make hyperlinks to them.
• Step 9
Create all other pages of your website using this template. Add body text, images and all other content you desire to make up your website.