Web Design Programs: Time Saving Tips For Dreamweaver

Learn some time saving tips for making the most of Dreamweavers many features.

Nobody ever said creating your own web page was going to be a snap! But Dreamweaver sure takes most of the frustration out of the HTML coding process. Being such a richly featured program has its drawbacks, however. Many users (especially those coming from straight coding backgrounds as opposed to HTML editors) dive in without taking the time to learn some of the nifty shortcuts Dreamweaver provides for creative web page design.

Use Keyboard Shortcuts

You are probably already familiar with some popular keyboard shortcuts such as Ctrl + C for copy and Ctrl + V for paste from other programs you might use. Many of these keyboard combos work in Dreamweaver as well. But Dreamweaver offers lots of other shortcuts that will help shave time off of your web page development process. Here are a few shortcuts you should without doubt memorize, as you will be using these commands frequently in Dreamweaver:

Check Links: F8

With a single tap of the F8 key you can check your entire site for broken links and orphaned files (files that exist within the site but that no other files link to).

Preview in browser: F12

Pressing the F12 key will open your current web page in whatever browser you have designated as your default.

Hide/show panels: F4

This shortcut is a terrific help - it quickly allows you to toggle between hiding and showing all of the active panel sets. Hiding the active panel sets gives you lots more screen real estate to work on.

Show/hide rulers: Ctrl + Alt + R

Show/hide grids: Ctrl + Alt + G

If you frequently work in Design view, use the Ctrl + Alt + R keyboard shortcut to quickly show or hide the horizontal and vertical rulers along the edge of the page, helping you to position items on the page more precisely. Likewise, the Ctrl + Alt + G lets you toggle the onscreen grid.

By design, keyboard shortcuts are displayed next to commands in the drop-down menus. If no keyboard shortcut is shown next to a command, then there is no shortcut currently defined for that command. But that doesn't mean you are stuck sticking to mouse only moves for that command. Use the Edit > Keyboard shortcuts command to open the Keyboard Shortcuts dialog box where you can create your own shortcut key combos, edit existing shortcuts, or select a predetermined set of shortcuts. For specifics, click the Help button in the Keyboard Shortcuts dialog box.

Use Buttons

Once you've gotten the hang of keyboard shortcuts, take time to learn what all those button icons on the Dreamweaver Insert Bar and at the top of each of the Panel sets are there for. The buttons are shortcuts to some of the most popular commands in Dreamweaver, yet they are often ignored because users don't know what the buttons represent. For example, at the top of the Assets Panel, on the File tab, there are buttons for refreshing the file list and connecting to a remote host. On the Common Insert Bar (just under the menus), there are buttons for inserting a table, a hyperlink, or today's date.

Dreamweaver provides tool tips for each of its button icons. A tool tip contains the name of commands associated with the button. To view a tool tip, simply hover your mouse pointer over the button (don't click) - the tool tip will appear just under your cursor.

Change Insert Bars

The Insert Bar located under the menus is not a static toolbar as in other programs. You can change this toolbar to suit the tasks you are doing at the moment. The default bar is the Common Insert Bar. Click on the dropdown arrow next to Common to choose alternative sets of toolbar buttons. True to its name, the Insert Bar provides an alternative means to accessing many of the commands found under the Insert menu.

© High Speed Ventures 2011