Working for a company that runs Dreamweaver training courses, I am increasingly finding that there is no longer a typical user of this great web development program. Dreamweaver users now seem to come from all different types of company and from all walks of life: private individuals, financial people, marketing people, people in the health service, academicians It seems everyone needs to learn the basics of web development nowadays.

Just as the use of a graphical interface has changed computing, making it more user-friendly, the use of Adobe Dreamweaver renders people with limited understanding of web construction capable of putting together a quality site. It is also an excellent platform for learning how web sites should be put together. For example, when you create a new page, Dreamweaver lets you choose from a series of standard layouts based on CSS (Cascading Style Sheets), the recommended specification for creating web pages. The code produced by Dreamweaver contains useful comments explaining how the page layout works.

Many small organisations have already learned to rely on Adobe Dreamweaver to build and manage their own website, creating and modifying pages and then uploading them via FTP to make them live and available to the public. Those organisations with a more urgent need to establish a web presence may still turn to a professional web development companies to get them started and then use Adobe Dreamweaver when changes need to be made, often saving themselves a small fortune.

Another way that organisations can save money is by hiring web designers to create Dreamweaver templates and then basing their website on these templates in-house. This also has the benefit of giving organizations control of their site right from the outset.

Although Dreamweaver is pretty easy to use, it is not likely that many users can simple load it onto their machine and start using it like a pro. Most people will benefit from having some form of Dreamweaver training. This will allow them to learn the essential aspects of the program and the process of creating basic sites and making them live. An effective Dreamweaver training course will also give users an insight into the underlying web technologies and the code which Dreamweaver generates as the users create their pages using visual techniques.

One of the best ways to make a site useful for visitors is making it interactive, allowing users to search for the specific content that they want. By attending an advanced Dreamweaver training course, staff within an organization can learn to add database-driven content to their website using technologies such as ASP, PHP or ColdFusion. And, here again, Dreamweaver does the lion’s share of the work, allowing users to create sophisticated search and results pages using the same simply point-and-click and drag-and-drop techniques used to create basic content.

The writer of this article is a developer and trainer with Macresource Computer Solutions, a UK IT training company offering Adobe Dreamweaver training courses at their central London training centre.

JavaScript is a simple, client-side scripting language which enables you to add exciting and interesting functionality to your HTML pages. It is built in to most web browsers and, although it can be deactivated, most people will have it enabled within their browser. JavaScript’s uses includes the validation of entries within an HTML form and the detection of browser versions and presence or absence of plug-ins. Dreamweaver’s implementation of JavaScript centres on the use of what it calls “behaviors”.

A behavior is simply a pre-written JavaScript function which can be triggered by a given event. To make the Behaviors window visible, choose Behaviors from the Window menu. Next select the element to which you want to attach the JavaScript. Finally, choose one of the available behaviors from the menu in Behaviors window. (The behaviors which are available will depend on the item you have highlighted.)

You will also need to ensure that the correct event (click, double-click etc.) is linked to the behavior. Dreamweaver will always assign an event automatically. However, if this event is not the one you actually want, just select a different event by clicking on the drop-down menu located to the right of the name of the event in the Behaviors panel.

Dreamweaver has a wide selection of behaviors. However, they fall into four main categories: images, windows and alerts, forms and form fields and CSS. To see how behaviors work, let us look at some examples of some behaviors in each of those categories.

Perhaps the most frequently encountered JavaScript function is one that changes the appearance of an image when the mouse passes over it. Dreamweaver creates this functionality with the “Swap Image” behavior. You can also add this behavior automatically by choosing Insert – Image Objects – Rollover Image. Dreamweaver automatically adds a second behavior/function called “Restore Image” which changes the image back to the original when the mouse leaves the image.

Dreamweaver’s “Open Browser Window” behavior allows you to create the controversial JavaScript pop-ups. Due to its extensive misuse, many people have developed an extreme intolerance of this feature. However, there are situations where it is useful. For example, if a user is in the middle of filling out a form and clicks a help icon next to a certain item, a pop-up window is an ideal method of displaying the help topic.

The key behavior relating to forms is called “Validate Form”. It performs simple checks on any text field within a given form. (It ignores any fields other than text fields.) To use it, select a field (the validation will then occur when the user leaves the field) or select the entire form (the validation will then occur when the form is submitted). Choose “Validate Form” form the Behaviors panel menu and specify the type of validation you wish to perform, for example, ensuring that a field has not been left blank.

Dreamweaver contains a couple of very useful behaviors which manipulate the content of HTML elements. To use these, you need to give the element and ID (for example). The DIV element offers the greatest flexibility when using this behavior since it can contain just about anything you want. You highlight the element which will trigger the behavior and then choose Show/Hide Elements from the Behaviors panel menu. Click on any listed element then click either the Show or Hide button.

If you have used several JavaScript behaviors on a page, you may find that the amount of code generated by Dreamweaver becomes quite significant. It is therefore usually a good idea to place all of this code in an external JavaScript file and then link this file to your page. To do this, click on the “Code” button in the top left of the page and locate the SCRIPT tags which contain the JavaScript. Select all of the code between the SCRIPT tags and cut it to the clipboard. Next, create a blank file with the file extension .js and paste all of the code inside it. Finally, to link your page to the .js file, position your cursor inside the opening SCRIPT tag and type src = “myfile.js” substituting the name of your JavaScript file for “myfile.js”.

If you would like to learn more about JavaScript training courses, visit Macresource Computer Training, a UK IT training company offering JavaScript training courses at their central London training centre.

categories: Dreamweaver,Adobe Dreamweaver CS3,JavaScript,behaviors,web development,website accessibility,computers and the internet,computer software

Because of its ability to separate design from content, Cascading Style Sheets (CSS) has become an extremely important technology in web development. A single CSS document can contain information regarding the position of elements on all the pages in a web site as well as style information such as font, sizes and colours. In terms of building websites, CSS definitely represents the future.

The range of computer users who have some involvement in building web pages and web sites is vast and a good many of these users choose Dreamweaver as the software tool that helps them create the web content they need without needing to become an expert on underlying technologies such as CSS. Dreamweaver CS3 includes better support for Cascading Style Sheets than previous versions. However, there is still room for improvement.

Previous versions of Dreamweaver assumed that most users would be using tables to control the layout of their web pages. Dreamweaver CS3 is the first version of the program which encourages users to create CSS-based web page layouts. When the users create a new web page, they are offered a series of CSS layouts, on which they can base the new page, consisting of single, double and three column designs.

Pages created using CSS rely heavily on the use of the HTML DIV element, a multipurpose container of web content. Choosing one of the Dreamweaver CSS presets creates a page containing a series of DIV elements complete with placeholder text and the CSS code necessary to control the position and dimension of the DIVs. The placeholder text and HTML code both contain brief explanations of the techniques used and advice on how to customise these basic pages for your own purposes.

The CSS code for pages created using Dreamweaver’s preset layouts is embedded in the page itself. If a user creates a series of such pages, each one will have its own CSS code making updating very time-consuming. It is far more efficient to have all of the CSS code in one external file and link each page to this one file. At present, Dreamweaver doesn’t really make this clear to new users. However, it does have an excellent feature for moving embedded CSS code into an external file. You simply select all of the CSS definitions you wish to externalise then choose Text – CSS Styles – Move CSS Rules.

Moving CSS code into an external file is not something a beginner would be expected to think of doing and is not something that Dreamweaver recommends to new users. So, in spite of the improvements, some familiarity with CSS is still required to get Dreamweaver to handle CSS efficiently.

It is also disappointing that Dreamweaver still automatically generates CSS styles called “style1″, etc. each time the user applies a font or colour to selected text. Surely it would be easier to simply remove these basic attributes and just let the user either apply a style to the selection or, if no styles exist, create a new one. Perhaps this will be introduced in the next release of this excellent program.

Author is a developer and trainer with TrainingCompany.Com, an independent computer training company offering Adobe Dreamweaver Classes at their central London training centre.