About Dreamweaver

The Adobe Photoshop Tutorials and Tips section offers a growing number of graphics tutorials devoted to Adobe Photoshop, especially creating Web graphics with Photoshop. Currently you'll find tutorials on creating Web page background graphics, 45-degree scanlines, and our series on Photoshop selection tools, including the lasso tool, the magic wand tool, and using channels for selecting. Tutorials cover Photoshop CS3, CS2, and older versions, too.

Here is a brief summary of some of the elements that Dreamweaver offers:

Site Management - An integrated file transfer client and visual site map allow site navigation, file linking, and uploading/synchronization of your site.

Template - Templates allow users to quickly edit all common elements, such as navigation bars, throughout a whole site.

Cascading Style Sheets - CSS allow users to quickly change the appearance of text elements throughout the site.

JavaScript Behaviors - Dreamweaver behaviors are JavaScripts that you can apply without having to deal with the necessary code.Each of these elements are discussed below.

Defining a Site

Dreamweaver operates based upon the concept of a web site. When you first open the program, Dreamweaver makes you define a site. This helps you keep all files organized. With a simple web site, you will just need to keep a few files within a file folder. However, it is best to plan this out before you start, since folder maintenance will help greatly as your site grows and you start linking to other web pages and adding graphics.

We do have some folder conventions for faculty. If you are updating an existing site, you will want to use the current folder structure. If you are working with others on a site (such as a department, special project, or student club) you will need to work closely so that you can coordinate your files, file structure and layout.

Dreamweaver Layout

Dreamweaver allows you to insert objects and change their attributes with the floating panels and menu commands. Dreamweaver for Windows also has the option to have fixed panels instead of floating panels. Once objects have been inserted on the page, they appear as they will when the web page is published online.

Once you start Dreamweaver, you may see a blank Web page with 3 floating panels:

Insert Panel: By default, this is the top menu bar on both PC and Macintosh. It has graphical buttons or icons for objects that can be inserted into a web page. These include images, tables and applets. You can select different types of objects from the tabs at the top of the panel. The Common list is the default.

Properties Panel: By default, this panel is below your web page. It looks like a Word processor formatting toolbar. When you choose an element on the Web page, you can adjust its properties here. You can toggle the advanced properties by clicking the small white arrow in the lower right corner of the panel.

Answer Panel: By default, this panel appears at the bottom of listed panels on the right. If it does not automatically appear, click on the arrow next to Answers to maximize the panel. You can quickly access the Dreamweaver tutorials and other information here.