1 / 16

USING DREAMWEAVER

USING DREAMWEAVER. Contents: Assigning a Root Folder Creating a blank webpage Basic Text formatting Creating links Adding Images. Continuing Studies CS 22: Enhanced Web Site Design http://www.stanford.edu/group/csp/cs22/. Assigning the Root Folder. Open Dreamweaver.

kamilia
Download Presentation

USING DREAMWEAVER

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. USING DREAMWEAVER Contents: • Assigning a Root Folder • Creating a blank webpage • Basic Text formatting • Creating links • Adding Images Continuing Studies CS 22: Enhanced Web Site Designhttp://www.stanford.edu/group/csp/cs22/

  2. Assigning the Root Folder • Open Dreamweaver. • Dreamweaver is not designed for single webpage creation; rather, it is designed for maintaining a complete website. Dreamweaver needs to know where all the local content of your particular site resides. • Under the “Site” menu item, choose “New Site”

  3. Enter the name of your site. This name will never appear in on your web pages -- it is only for Dreamweaver. Also enter the web address (HTTP address – URL) of your web site. Click “Next”. • Although we will not be using it in this class, you will be offered the option of using Server Technology (ColdFusion, asp.net, asp, jsp, php). Click Next.

  4. In the “Sharing Files” section, if you will not be using Dreamweaver’s built-in publishing methods (FTP, SFTP, local/network, RDS, SafeSource, orWebDAV), choose “None”, then “Next”. Review the “Site Definition Summary” to ensure that all of your settings are correct, then click “Done”. Enter the location of the web page files on your computer. You will publish them (copy them to a web server) from this location. Click “Next”. The “Manage Sites” box will appear. Click “Done” to finish configuring Dreamweaver.

  5. Creating a Blank Webpage • Now that you have set up Dreamweaver, you’re ready to work on your web pages. If you wish to use a page which already exists, open it. If there isn't already one open, select New from under the File menu. Select “Basic Page” and “HTML”. When the untitled web page appears, save the it in the folder you selected in the previous section. The first page on any web site is always called “index.html” but if you wish create a different page, be aware that all filenames must be one word, and must end with .html

  6. Giving your page a title • Give your page a title, and start typing text into it. Notice how it works pretty much like a word processor. If you would like to format some text, you'll need to use the "Properties" palette. “properties" palette

  7. Text formatting If you don’t want any formatting, simply type your text. Press return to jump down one paragraph. Notice how it jumps down TWO lines. To jump down only one, hold down on the Shift key and press return. It jumps to the next line.

  8. Text formatting (continued) • But usually you’ll want some formatting:Bold:Italics:

  9. More text formatting • Heading 1: • Verdana font: • Red font:

  10. Lists • Often, you’ll want to have bulleted items. To do this, press the Unordered List button on the properties palette:

  11. Lists, continued • Sometimes you’ll want numbered lists. Press the Ordered List button on the properties palette:

  12. Creating a hyperlink • To link text to a web page or other item on the internet, simply highlight the text, and type in the URL in the “link” field in the properties palette: • If you want a new window to open when the user clicks on the link, choose “_blank” in the target pull-down menu:

  13. Adding Images • To add an image, you first need to have an image to add, and it must be in the web page directory on your computer. Once it’s there, under “Insert”, choose “Image”.

  14. Image (continued) Select the image, and press “OK”.

  15. Hyperlinking Images • If you want to make the image “clickable”, highlight the image, and add the URL in the “Link” in the properties palette:

  16. Other Image Properties W = width (in pixels) H = height (in pixels) Src = source of the image (where it’s located) Alt = alternative text description of the image Map = imagemap name -- used to define more than one hyperlink for the image V Space = defines the amount of space above and below the image (in pixels) H Space = defines the amount of space to the right and left of the image (in pixels) Low Src = used to display a low-resolution version of the image displays as the “real” one loads Border = the size of the border around the image (in pixels) Align = the alignment of the image in relationship to the text or other images that surround it.

More Related