A page to help the beginner find your way around the screen
At the top
At the top of the screen is a pale blue bar with File, Edit, View, Insert, Modify, Text, Commands, Site, Window and Help
Each of these opens a drop-down menu with choices, some of which lead to further choices.
Note: DW arrows leading to menus are little black triangles pointing to the right. Where there is a triangle there is more to see. Click on a triangle and it will reveal more and point downwards. To hide the list revealed, click on the arrow again.
Below the top menu bar is a slightly darker blue one with an arrow and Insert on it. Click on the arrow to expand the bar to show: Common, Layout, Forms, Data, Spry, Text, Favourites. Each of these are tabs that on clicking reveal a row of icons. Mouse over the icons to reveal words that show what they are.
Use Window from the top menu bar to show or hide other sections or menus or to put the window back to default.
On the left are three icons and words: Code, Split, Design. Code shows you what DW is writing as you work, Design view is your page view with what you are adding and Split shows both at once.
Next to the right is the title of the file (not the same as the file name) see dictionary.
Then to the right are more icons. A useful one to note is the globe: this allows you to Preview your page to see what it would look like on the Web.
At the bottom
At the bottom of the screen is the Properties Inspector bar. Properties are formatting or attributes that you add or change.
When you have things on the page and click on or select them you will see the Properties Inspector Bar change as it offers different things to format.
Clicking on Page Properties at the bottom of the bar brings up a limited menu of things to change, including font and margins. Also note in the Properties bar the opportunity to format headings (format box on the far left) and font (below format)
Above the Properties Inspector Bar is the Tag Selector bar showing elements such as <body>, eg:
Notice also the things on the same bar on the right. They include the window size and the file size of the page, both in pixels, and the speed the page is likely to load on the web, eg:
On the right
Four blue horizontal bars stacked together: CSS, Application, Tag Inspector, Files. Each has an arrow leading to more.
Click on the Files arrow to show three tabs: Files, Assets, Snippets.
Files has various boxes and icons and then a list of the files you have in your site. It may be blank if you have not started yet. When you have files it will show your Site, and its files and folders.
In the middle
When you have a page open (which DW calls a file) you will have space to write and put things (called elements) such as images.
At the top there is a tab giving the name of the file.
General
Get to know the menu bars and icons. As with most computing applications there are usually several ways to achieve the same thing. For example you can use Insert on the top menu bar to get the drop-down menu, or the Insert bar with its icons, to allow you to insert the same things.
To return the screen appearance to its default: Click on Window on the top menu bar, then Workspace Layout, then Default, (or Designer, depending on your DW version/computer)
See the Define a Site instruction page to get started with a site and index page, and the files and names page on distinguishing between files and folders, names and titles, and how best to use them.
Do not forget Dreamweaver Help which is very useful. Use Help from the top bar or click on an element and then the little question mark in a circle on the far right of the Properties Inspector Bar to open DW help on aspects of that element.
page updated 27/5/10