Things You Can Do With Dreamweaver

Over 100 Different Dreamweaver Tips and Techniques

by
Jennifer Kyrnin
Updated May 22, 2017

Adobe Dreamweaver is such a powerful tool for Web designers, because it has so many things you can do with it. Of course, all those things you can do make it challenging to learn. Find out some of the many things that Dreamweaver can do, including changes in the latest version, CS5. And don't forget to check out the things that are missing from Dreamweaver CS5.

  • Defining a Site

  • Start a new website
  • Create a website
  • Set up only the parts of the site that you need, when you need them * New in CS5
  • Set up remote, QA, and testing servers for more complete workflows * New in CS5
  • Create and publish new directories
  • Change the doctype
  • Include meta data in your pages

  • Putting Your Site Live

  • Define a remote site
  • FTP files to the Web server
  • Use a version control system to check files in and out
  • Connect with Subversion for more advanced version control * New in CS5
  • Leave notes for your teammates

  • Creating Web Pages

  • Write a page in WYSIWYG mode
  • Write a page in HTML
  • Create a new page from a template
  • Create a new page from scratch
  • Create a template
  • Save files to your site directory
  • Define the page properties

  • CSS

  • Use CSS style sheets
  • Adding inline styles
  • Create an external style sheet
  • Attach an external style sheet
  • Create class, ID, tag, and compound CSS selectors
  • Edit existing CSS rules
  • Create CSS for printable pages
  • Enable and disable style properties * New in CS5
  • Inspect CSS box model visually * New in CS5

  • Text

  • Modify text
  • Use different fonts
  • Insert a line break
  • Use special characters
  • Include today's date
  • Write comments
  • Apply HTML tags to text
  • Add HTML attributes to tags

  • Links

  • Link text and images
  • Check site links
  • Change the default link colors (link, visited, hover, active)
  • Create tool tips on links
  • Create mailto links
  • Create web page anchors

  • Images

  • Add graphics to a page
  • Edit images
  • Resize images
  • Add alt text to images
  • Add additional accessibility options to images
  • Align images and text
  • Create a rollover image
  • Use image maps
  • Use tracing images
  • Use image placeholders
  • Insert Fireworks HTML
  • Insert Photoshop files

  • Layout

  • Use the included free tempates * New CSS starter layouts in CS5
  • Insert divs for layout
  • Edit divs in the CSS styles panel
  • Insert absolutely positioned elements
  • Format absolutely positioned elements in the property inspector
  • Use rulers, grids, and guides

  • Lists

  • Add bulleted and numbered lists
  • Customize list bullets and numbers

  • Tables

  • Create a table
  • Add header rows and columns
  • Use transparent images to hold table cells open
  • Create fixed width and flexible width columns
  • Change the border styles of tables
  • Embed a table within a table
  • Import tabular data

  • Forms

  • Use a mailto form
  • Define form actions
  • Add text, radio, checkbox, file, image, select boxes, and hidden form fields
  • Make your forms accessible with fieldset and label fields
  • Create custom submit buttons
  • Validate forms with JavaScript (Spry)

  • Databases and PHP Scripting

  • Attach your site to a database
  • Set up a PHP/mySQL site
  • Use Spry elements to connect to the database
  • Insert data objects into your pages
  • Test and update a Spry data source or display
  • Edit complex dynamic sites in design view
  • Discover all dynamically related files to assemble PHP CMS sites (WordPress, Joomla, and Drupal) * New in CS5
  • Custom class hinting for PHP code, including third-party frameworks like the Zend framework * New in CS5

  • Frames

  • Build a framed website
  • Edit noframes content
  • Format and style your frames
  • Set up default link targets between frames

  • Add Interactivity

  • Build a photo album (No longer in CS5)
  • Add sound to web pages
  • Create a drop-down menu
  • Use Dreamweaver behaviors to open pop-up windows, create jump menus, play sound, swap images, and more
  • Add RSS feeds to a site
  • Insert Flash text as a rollover
  • Insert CSS text as a rollover
  • Insert other plugins
  • Add Spry menu bar, tabbed panels, accordion, tool tip, and collapsible panel
  • Use the Widget Browser to find new widgets for your site, without needing to know JavaScript

  • Test Your Pages

  • Test your pages in Live View to see the changes due to JavaScript and interactivity * New in CS5
  • Validate your HTML
  • Preview your pages in several browsers
  • Use BrowserLab to preview your pages in other operating systems *New in CS5
  • Use Device Central to check how the pages look on mobile devices
  • Check browser compatibility
  • Change the settings to match what your site needs to work with
  • Check internal site links
  • Test your site's accessibility (No longer in CS5)
  • Convert a Word Document to HTML

  • Customize Dreamweaver

  • Add extensions
  • Disable extensions
  • Customize Dreamweaver with shortcuts

  • Increase Your Efficiency

  • Use built-in keyboard shortcuts
  • Use code snippets
  • Create and use templates
  • Generate new pages from custom templates
  • Update templates
  • Include one file in another with the Dreamweaver library
  • Update library items
  • Include one file in another using SSI
  • Use search and replace