Home » Internet » Web Development

Dreamweaver's Approach To Css

Dec 28, 2007
Cascading Style Sheets (CSS) has become as pivotal a technology in the building of websites as HTML. Originally, CSS was mainly used for defining the appearance of text (font, size, colour, etc.). However, with the improvement of browser compatibility with the CSS specification, CSS is now the recommended method of controlling all aspects of the presentation of HTML documents within the browser window.

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.

Dreamweaver CS3 is the first version of the program which assumes that the user will want to use CSS to control the layout of their web pages. To assist inexperienced and would-be web developers, each time a new page is created, the program allows the user to choose allocate a preset CSS layout to the page. There are about 30 such layouts and they come in single, double and three column varieties.

Instead of using tables to control positioning of web page content, CSS page layout makes extensive using of the DIV element an HTML construct which can contain just about anything, including other DIVs. The preset pages created by Dreamweaver CS3 contain a series of DIV element with the CSS code that controls their positioning. The placeholder text within the DIVs includes useful tips on customising the preset pages for your own use.

CSS works most efficiently when you can place all of your CSS code in one external file and link that file to each of your HTML pages. Dreamweaver CS3 still does not make it easy for inexperienced users to create CSS-based pages in this way. If the user creates ten web pages based on Dreamweaver's preset CSS designs, each will have its own code embedded within the page itself. There is, however, a great feature for moving embedded code across to an external CSS file. You just select a series of CSS definitions, right-click and choose "Move CSS Rules" which is available in the "CSS Styles" section of the context menu.

Although this ability to move CSS around is really great, it's not something that beginners will necessarily think of doing. It points to the fact that Dreamweaver could still do with a few enhancements to its implementation of CSS.

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.
About the Author
The writer of this article is a developer and trainer with Macresource Computer Solutions, an independent computer training company offering Adobe Dreamweaver training courses at their central London training centre.
Please Rate:
(Average: Not rated)
Views: 267
Print Email Share
Article Categories