Dreamweaver Interactive Video tutorial
Discover everything you need to know to build your website step by step from start to finish with this Dreamweaver Tutorial.
Dreamweaver Interactive Video tutorial

Adobe Dreamweaver has always offered solid tools for designing, building, and managing Websites. The latest version offers powerful tools for PHP programmers, a new tool for inspecting CSS, support for popular PHP-based content management systems, and a few simplifications that make setting up sites and building CSS-based layouts easier.

Dreamweaver CS5′s most significant additions are aimed at web developers building PHP-driven sites. PHP is a free, open source web programming language used on millions of sites (including FaceBook, Flickr and Digg) and drives many of the most Dreamweaver CS5′s most significant additions are aimed at web developers building PHP-driven sites. PHP is a free, open source web programming language used on millions of sites (including FaceBook, Flickr and Digg) and drives many of the most popular content management systems such as Drupal, Joomla and WordPress.

Dreamweaver CS5 includes expanded code hinting support for PHP, so that as you type PHP code into a web document, Dreamweaver lists functions and keywords that match. You can then select one of Dreamweaver’s suggestions and have it write in the Dreamweaver CS5 includes expanded code hinting support for PHP, so that as you type PHP code into a web document, Dreamweaver lists functions and keywords that match. You can then select one of Dreamweaver’s suggestions and have it write in the rest of the code, saving your fingers from typing and speeding up your programming.

Another great feature for those working with server-side programming is the enhanced Live View. Live View, which has been around since Dreamweaver CS4, uses Apple’s WebKit (the rendering engine behind Safari and Chrome) to display a page as it would appear in a browser (well, in Safari, at least). When in Live View you can easily preview Another great feature for those working with server-side programming is the enhanced Live View. Live View, which has been around since Dreamweaver CS4, uses Apple’s WebKit (the rendering engine behind Safari and Chrome) to display a page as it would appear in a browser (well, in Safari, at least). When in Live View you can easily preview pages that are created on the fly by a server-side programming language like PHP.

]]>

CSS (Cascading Style Sheets) is a web designer’s most important tool for crafting beautiful sites, and Dreamweaver already sports great tools for creating, editing, and managing CSS. CS5 adds an excellent tool for inspecting CSS while in Live View. The new Inspect Mode lets you mouse around a page, and visualise the normally invisible space added by padding and margins; as you mouse over an element, Dreamweaver highlights the space added by margins in yellow, and the space added by padding in purple.

Dreamweaver CS5 includes numerous small refinements as well. A revised “site setup” procedure greatly simplifies the process of getting Dreamweaver ready to work on a website. Now there’s only one method for setting up a site (in previous versions you could choose either the time consuming “site definition wizard” or the confusing “advanced” setup process), that merely requires you to tell Dreamweaver where to find your site’s files, and what you’d like to name the site.

The program also includes quite a few small, user interface changes that provide more working room and a more logical organisation of buttons. In addition, the “starter” CSS layouts that have shipped with Dreamweaver since CS3 have been rewritten and simplified to provide better guidance, and ease of use for those learning CSS-based page layout.

Dreamweaver CS5 has built-in support for Adobe’s BrowserLab service. This web-based service is a godsend to beleaguered web designers who try to make sure their designs work in all major browsers. BrowserLab is basically a giant screenshot machine that takes pictures of a web page using a wide range of browsers on both Windows and Macs, this is especially useful for Mac users who don’t have access to a Windows machine or multiple versions of Internet Explorer.

Within Dreamweaver CS5, you can choose to preview a page you’re working on in Adobe Browserlab, this launches your web browser and sends your page off to BrowserLab, which takes screenshots and presents them to you so you can compare your design across multiple browsers. BrowserLab isn’t a Dreamweaver CS5-only service, however. Dreameaver CS4 users can download an extension to work with BrowserLab, and you can even use the service without Dreamweaver at all.