Behaviors | Templates | Library Items | Repetitive Tasks | Spry Tools
Behaviors are pre-built scripts that are written in JavaScript. The scripts allow Dreamweaver to perform actions that it can't do on its own.
One behavior function that you are able to apply to a page is for a smaller window to open. This helpful when you don't have enough room on a page to give further details of an element on that page. For instance, you can have another page open to give further details of an image that is on your page, such as a photo. You can describe what the photo is on the page that is programmed to open. This page can be programmed with many options. The page can be opened and the user can resize it themselves or it can be programmed to be a specific size. When programming the additional browser windows, choose different names instead of naming them all the same. If you name them all the same, the same window will open for each browser window.
Another option is the Popup Message Behavior. A popup window behavior can be programmed to let a user know they are leaving the current site they are using and will be directed to another site. This keeps the user informed of where they are while surfing. These popup windows are convenient because you don't have to create whole new page to inform them they are leaving the current web site. One thing to remember is if a user is going to be taken to another site, link the text prior to adding the behavior. The text must be a link. This rule applied only to text. Behavior scan be attached to images without first turning the images into links.
Validate Form Behavior is useful when using a form in a web site and you want the user to provide accurate information in the form for you. You can have an email address validated by creating a behavior that requires the user to use the (@) sign when inputting their email address in a form. They will get an error message stating they need to provide the correct information. Validate Form Behaviors can be programmed that require a user to input their name. The will receive an error message stating their name is required. Keep in mind that users don't always like to divulge their information and are likely to input incorrect information in order to remain anonymous. They may also misuse the form or even hack into the security of your site. Therefore, all information that is going to your server should be validated.
Templates assist web designers with consistency on each page. They are the backbone of all web sites. It is imperative to keep web sites consistent so that Users will stay on your site. If a page in a site deviates from the design of the other pages, a user will think they have left the site they were one. Templates can lock in colors, fonts, style sheets, tables, images, and even behaviors.
Page consistency is important as well as page elements, (i.e. the information on each page). Page elements are the navigation bars and the consistency of where photos are placed as well as title headings on pages. Templates allow the user to update all pages at one time instead of updating each page. Some web sites can contain up to 1,000 or more pages and templates are an easy way to update all pages.
Dreamweaver does contain a few templates that you can use or you can download templates from the Internet or even create your own. Several template layouts can be used in one web site to help with the consistency of various pages.
Library items are elements within a Dreamweaver template. Page elements can include copyright information or navigation bars.
Libraries are HTML code elements that you want to use on multiple pages, whether you are using a template or not.
Copyright information is the best example of a library item. The copyright statement can be applied to all page layouts and templates. It is easier to change the copyright library item in each template than to change it on each page when the copyright expires. They are similar to a template in that they allow you to make changes to multiple pages with ease, however; a library item changes elements on a page instead of the layout of a whole page design.
Automating Repetitive Tasks means that you are able to automate repetitive tasks by utilizing the History panel in Dreamweaver CS3. The History panel is a list of up to the last 50 steps performed since creating or opening a file. The custom objects and commands allow you to select commands in a file to repeat in that file or on every page in a web site.
A slider is used in the History panel to allow you to quickly undo or redo steps that you have performed in a document. This approach is similar to Ctrl+Z or Ctrl+Y (Windows) or Cmd+Z or Cmd+Y (Mac). By selecting the steps you want to repeat in a current document or multiple documents, you can save valuable time.
In addition, you may choose particular steps from the History panel that you implemented in a document and save them as commands. A command can be repeated later in any document with just a single click. All you have to do is go to Commands on the menu bar and select the command you would like performed in any document.
These are very beneficial when building a web site. You can save yourself from constantly repeating the same steps in each document.
Spry effects are visual enhancements that you can apply to almost any element on an HTML page using JavaScript. Effects are often used to highlight information, create animated transitions, or alter a page element visually for a duration of time. You can apply effects to HTML elements without needing additional custom tags.
To apply an effect to an element, it must be currently selected or it must have an ID. If, for example, you are applying highlighting to a div tag that is not currently selected, the div must have a valid ID value. If the element doesn't’t already, you will need to add one to the HTML code. Effects can alter an element’s opacity, scale, position, and styling properties such as background color. You can create interesting visual effects by combining two or more properties.
Because these effects are Spry-based, when a user clicks on an object with an effect, only the object is dynamically updated, without refreshing the entire HTML page.
Spry includes these effects:
When you use an effect, various lines of code are added to your file in the Code view. One line identifies the SpryEffects.js file, which is necessary to include the effects. Do not remove this line from your code or the effects will not work.
Ajax (Asynchronous JAvaScript and XML): Ajax is a JavaScript library for web designers that allows designers to build pages that provide a richer experience for their users. Unlike other Ajax frameworks, Spry is accessible to both designers and developers alike, as 99% of it is actually HTML.
Spry: Spry is the framework used to create interactive, dynamic, and compelling pages instead of static pages. Spry tools are in the Spry group of the Insert bar that are separated into 3 categories: Spry Data, Spry Form and Spry Layouts.
XML: With the Spry framework, you can insert data objects to allow users to interact with a page quickly and dynamically from a browser window. For example, you can insert a sortable table that users can rearrange or include a Spry dynamic table object that triggers a data update elsewhere on the page without requiring a full-page refresh. To do this, you first identify, in Dreamweaver, one or more XML source files (the “Spry data set”) that contain your data, and then insert one or more Spry data objects to display this data. When the user opens the page in a browser, the data set loads as a flattened array of XML data that looks like a standard table containing rows and columns.
Spry Widgets: Spry widgets are prebuilt, common user interface components that you can customize using CSS, and then add to your web pages. With Dreamweaver, you can add a number of Spry widgets to your pages, including XML lists and tables, accordions, tabbed interfaces, and form elements with validation.
