Core Computer: Dreamweaver Notes
The Dreamweaver Interface - some brief notes
If they aren't already open, open the following workspace components and look at them:
This is the area in which you build your web page. With in this area there are several component you should have open all the time. The two main ones are the Insert bar and the Properties inspector.
At the top of the window the name of the folder you are working in is displayed followed by the title of the document. If there is a small asterisk next to the title it means you have not saved it recently. Below that is the document tool bar here field next to title you can title your document. You can also switch from code view to design view here. Preview in browser is also on this bar. These features are constantly demonstrated in class and as you build your web site you will become very familiar with them.
To open go to Window > Insert
The Insert bar you will also become very familiar with as you will use it all the time. It contains buttons for creating or inserting various types of objects, such as images, tables, layers, and so on. This click to add approach becomes very familiar. You can also use the Insert menu to insert many of the items found in the Insert bar. If you ever need to hide the insert bar for moment because your screen is cluttered see the arrow just below the word insert click it and the bar is hidden. The arrow will now point right click it again and the bar is revealed. Handy.
To open go to Window > Properties
The Property inspector displays properties for the selected object or text, allowing you to modify those properties. How does this work? After inserting an image or text or any other object from the insert bar you can shape the appearance here. It is context sensitive meaning it it changes with what ever object you have selected. Context menus can be tricky when first learning. I have seen them drive some students batty. This is because they change depending on the object currently selected.
Notice the small arrow at the right hand base if you click this The Property inspector expands and displays more options depending on what object is selected. Leave it open otherwise you might miss noticing all the options that available to you.
At the base of the window is the status bar this provides information about the HTML tag that is being used, the window size and the download statistics. The window size pop-up menu is something that is easily missed. As discussed in class every browser interprets HTML differently on different platforms and screen settings. In Dreamweaver you can simulate the size of browser windows by dragging the resize handle in the right hand corner of the document window but there is a better way to simulate the size of browser window. Notice the small arrow next to the window size information click it to reveal a number of settings available. Use this feature to get a rough idea of what your page will look like in different browser windows.
These notes are written for students who undertake the Core Computer course at School of Art, Australian National University. Students of the course should feel free to contact any member of staff with comments questions and general suggestions..
< Home Index > < Staff Contact > < Class groups > < Assessment >
< Basics Module > < Photoshop 1 Module> < Photoshop 2 Module> < Illustrator Module > <3D Module > < Web Design Module >
< Terms and Jargon > < Online Resources >
