Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
In Dreamweaver CS5 Essential Training, Adobe Certified Instructor James Williamson explores the tools and techniques of Dreamweaver CS5, Adobe's web design and development software. This course covers both the ins and outs of Dreamweaver, as well as recommended best practices for crafting new web sites and files, the fundamentals of HTML and CSS, and how to ensure clean and accessible code. The course also includes how to use tools in Dreamweaver to create and style web pages, manage multiple sites, and add user interactivity with widgets and scripting. Exercise files are included with the course.
One of the things that Dreamweaver is known for is its ability to handle many of the complex tasks of creating Web pages visually, with Dreamweaver automatically generating the code behind the scenes. Even when working with objects that are relatively simple to code, such as tables, Dreamweaver speeds up the process of generating the code into a single click. The secret behind much of this success is the Insert panel. And in this movie, I want to take a moment to explore the Insert panel in a little bit more detail. Now, in my current Workspace, you are going to find the Insert panel at the very top, docked as this horizontal bar.
And you may experience it in different ways. It doesn't have to stay this way. It can undock and float as a vertical panel. It can dock inside the panel dock. Or as we had it, it can dock as a horizontal panel. Now, I like the horizontal panel approach better myself, because I am able to see more of these icons at the same time. Now, your icons can either display in color, as they are dong here, or if I right-click the panel, I can turn off that and make them appear in black and white. Notice that it also affects some of the other icons in your interface as well.
So if you like that sort of color approach to let you know exactly what those icons are, or if you like sort of the subdued black and white version, you can go that way. I kind of tend towards color myself, because when you are working with Spry sets, for example, the blues represent widgets and the green represents things like your Form elements. So it's kind of nice sometimes to have that color-coding. Now, you will notice that the Insert panel is broken up into these different groups. So you have Common objects. We have Layout objects, Form objects, Data, Spry.
We have a whole list of objects here that we can switch back and forth. Now, depending upon what type of page you are working on, let's say you are working on a Dynamic Page, you are working with PHP or ColdFusion, you are going to see additional groups show up. We do have a data grouping, but you are going to see, if you are working on ColdFusion, for example, you are going to see a ColdFusion tab show up that gives you access to a lot of ColdFusion objects. Now, to insert any of these objects on the page, you simply click on a certain location and, say, insert a Table, or a Div Tag, or an Image. So it can really speed up a lot of the common day-to-day processes that you are going to be doing when building Web pages.
Well, the Insert panel can do a lot of things for you, some things that aren't even visual, that you have to hand- code, for example. Let me show you. If I go right over here to our Head objects, I can grab that pulldown menu. And I can see that I have Meta tags, Keywords, Descriptions, all sorts of things. So I am going to go in and choose Keywords. And maybe for my Explore California Web site, for example, I want to type in tours, California, explore, snowboarding, hiking. The list could go on and on.
I think you get the idea. You could just go in and type in any of the Keywords that represent your site. I am going to go ahead and click OK. And now if I switch over to Code View, you can see, in the head of my document, I now have a nice Meta tag here, giving all the Keywords for my site. So I can use the Insert panel to do a lot of those common tasks that don't require me to go into Code and do, which I really, really like. Now, you may notice this little grouping on the end called Favorites. Now, if you click on that tab, initially, Favorites is going to be empty. Well, Favorites is really a place for you to access the objects that you use over and over and over again.
So you probably really won't know your Favorites until you start using Dreamweaver for a little while. But once you do, and you notice that you commonly have to keep clicking back and forth between these tabs, you can just locate them all in Favorites and save yourself a little bit of time. Let me show you what I mean. If we right-click the Insert panel, you notice we have the option to Customize our Favorites. And when we do that, we are going to get a menu that comes up showing all of these different objects, and then what we are going to add to our Favorites. So if we are going to do things like Named Anchors a lot, for example, I can select that, click this arrow.
It will move it over into our Favorites. Insert Div Tags. I do that a lot, so I am going to go ahead add that. Maybe inserting Images, inserting a Table. Notice that there is no set order that you have to go in. You can do these in any way that you want. What's really nice about this is you are going to see some options that you don't normally see up in the menu. Inserting FlashPaper, although, I doubt a lot of people are doing that anymore, it's still there. We can go down through this entire listing. And if you finish one grouping, you can actually add a separator. So maybe after that, I want to do some Flash objects.
So maybe I am going to insert Flash Video and just a SWF file, and insert another separator. Now, remember earlier I told you that working on different types of pages would cause those panels to come up. Well, if you scroll down through here, you can find some of those. So for example, there are my Form objects. Now, this is CFML, which has to do with ColdFusion pages. I could add those to my Favorites if I wanted to and they would be up, even if I wasn't working on a ColdFusion page. So I could just keep going through these and find XSLT, Data. There is some really cool stuff in here.
So make sure you go through and say, "You know what, I do a lot of Spry work, so maybe Spry Data Set, Spry Regions, maybe some of the Spry Validation objects." And as I go through my HTML, maybe Table Tags, Table Rows, Table Header Cells. Those allow you to build individual items within your table. Okay. So we have got quite a list here for our Favorites. I am going to go ahead and click OK. You will notice that now I get an entirely new section here that combines a lot of these groups together.
It gives me quick access for my Spry Sets, my Flash Objects, and Common objects like Tables and Div Tags that I am going to be inserting day-to-day. So if you like working visually or if you are just looking for a really quick way to generate standards-compliant, clean HTML for complex objects, the Insert panel is your likely panel of choice. For new Web designers, the Insert panel is a great way to learn how specific objects are structured by examining the code that they create. By creating a Favorites section, you could easily customize the Insert panel to organize the objects that you use the most and create an efficient way for you to work within Dreamweaver.
Find answers to the most frequently asked questions about Dreamweaver CS5 Essential Training.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.