How to Create Websites or Edit Web Templates With Dreamweaver

Dreamweaver's what-you-see-is-what-you-get interface enables you to create and fine-tune web pages or website templates. You can switch from design mode to code mode, or split between the two views. Dreamweaver includes inbuilt web design features and handy help tools. You can easily add styles, tables, graphics and links to your web page, and edit your design until it works for your needs.

Directions:

Using the Help Tools to Create Websites or Edit Web Templates

 

1. Select "Help" and "Dreamweaver Help" from the toolbar in Dreamweaver whenever you are stuck.
   
   
2. Select the "Contents" tab to learn how to lay out your page, add content to a page, and work with web editing codes.
   
   
3. Select the "Index" tab and scroll through the list of choices, or simply type in a keyword in the text box, double-click a topic, or click on "Display."
   
   
4. Click on the "Search" tab and enter the words you need to find into the search field, then click on "List Topics."

 

Using Tables to Create or Edit Websites or Templates

 

1. Create tables within your web page by selecting "Insert" and "Table" from the toolbar. The "Table" dialog box will open.
   
   
2. Choose your table size (rows, columns, width, border, cell padding and cell spacing) and header preferences, then click on "OK."
   
   
3. Select "Split" view, so you can view the HTML code (used to create the table), while viewing the design. Then add the contents for your table.
   
   
4. Check the HTML code. The <TABLE></TABLE> tag will show you where the table begins and ends. The <TR></TR> tag will show where a row starts and ends, and <TD></TD> will show you where a column starts and ends.

 

Inserting Graphics into a Web Page or Template

 

1. Add an image to your web page by selecting "Insert" and "Image" from the toolbar. Then browse to find the image file you want to add, and double-click it.
   
   
2. Add an alternate text for the image in the "Image Tag Accessibility Attributes" dialog box, then click "OK." The text you add here will be displayed when your mouse rests on the image on a web page.
   
   
3. View the HTML code used to create the image. The <IMG> tag tells the web browser that you inserted an image. SRC indicates where the image file is located, and ALT is the alternate tag you added in the previous step.

 

Adding Links to Your Website or Template

 

1. Type some text on your page and select it. Then click on "Insert" and "Hyperlink" in the toolbar. The "Text" field will be populated with the selected text.
   
   
2. Type in the full website address into the "Link" text field, using the format: "http://www.website.com/web-page.html." Then click "OK."
   
   
3. Select any text you want to link to an email address. Then click on "Insert" and "Email Link" in the toolbar. Type an email address into the "E-Mail" text field and press "OK."

If you've found this web tutorial informative or helpful, please spread the word by linking to Dollar Templates and Fonts. Thank you.


Return to Resources