Sign In | Subscribe
Start learning today, and be successful in your academic & professional career. Start Today!
Loading video...
This is a quick preview of the lesson. For full access, please Log In or Sign up.
For more information, please see full course syllabus of Adobe Dreamweaver CS6
  • Discussion

  • Study Guides

  • Download Lecture Slides

  • Table of Contents

  • Transcription

  • Related Books

Bookmark and Share

Start Learning Now

Our free lessons will get you started (Adobe Flash® required).
Get immediate access to our entire library.

Sign up for Educator.com

Membership Overview

  • Unlimited access to our entire library of courses.
  • Search and jump to exactly what you want to learn.
  • *Ask questions and get answers from the community and our teachers!
  • Practice questions with step-by-step solutions.
  • Download lesson files for programming and software training practice.
  • Track your course viewing progress.
  • Download lecture slides for taking notes.
  • Learn at your own pace... anytime, anywhere!

The Assets Panel

  • You can open the Assets panel by going to Window->Assets
  • The Assets panel is designed to help you locate and view the various assets within your website
  • This panel is arranged based on the type of asset, the left column of icons allows you to access the various assets within your website
  • This panel is very handy, there is lots of information in it
  • Click on the first icon in the upper left and you can view all the images within your website root folder
  • If you expand this panel, you can get the file size and dimensions, along with the location of the image
  • We will be using this panel to perform a variety of tasks throughout his course

The Assets Panel

Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.

  • Intro 0:00
  • Assets Panel 0:35
    • Colors Used
    • URLs Outside the Website
    • Flash Files
    • Shockwave Files
    • Movie Files
    • Scripts, Templates, Library
    • Images Category

Transcription: The Assets Panel

We're now going to take a look at a very important panel in Dreamweaver--or at least, I consider it to be, because it comes in so handy.0000

And it is one of those somewhat hidden panels that you might not even notice.0010

I tend to find, in my Dreamweaver classes, even if a lot of people in the class have used Dreamweaver, even for a couple of years, they don't even know this panel exists.0015

Let's take a look at it, and I'll show you how to navigate it and also what different information is stored within this panel.0026

What I'm going to do is make this panel on the right just a little bit bigger, so it will be easier for you to see.0035

And I'm going to open up the Assets panel here and close this up.0042

Now, the Assets panel is right underneath the Files panel, in the same tab group.0048

Here is my Files panel in the Window menu; here is my Assets panel.0055

Here is Files, and the Files tab is always the first one; the second one is Assets--by default, anyway.0061

Now, what this panel does, you can very quickly see, now that I have made it a little bit bigger; and let me make it just a little bit bigger than this, so you can see it all.0070

What the Assets panel does is help organize your content within your website within Dreamweaver; plus, it gives you a lot of information.0081

First of all, the Assets panel has this list on the left-hand side; and if you hover over each of these icons, you will see what they are.0091

Right now, I don't have a library or template item within my website; if I did, they would be showing here, just like our images showed.0101

I'll start at the top with Images; if I move into Colors, you can see, these are the various colors that are used within my website.0111

When we talk about Web Safe and Non Web Safe, you really don't have to worry about that anymore.0122

I'll just ignore this type; that is something we needed to do back in the day when monitors were not very good.0128

We have excellent monitors now, so this is a nonissue.0137

If I go to the next one, it shows me any URLs; now, a URL is a hyperlink, and what this is referencing is URLs outside your website.0141

I don't have those set up in my website yet, so there is nothing showing here.0152

The next one down is my Flash files, my SWF files; and right now, you can see there aren't any in here; I will be adding some...so I can add a Flash file, and I will also be adding a Flash video.0158

This next one you may never have heard of: it was a Macromedia (which was purchased by Adobe) format.0176

This has been in here for quite some time, and it was a Shockwave format--not used anymore.0186

The next one down would list any movies we have; now, if you have movies within your website folder, they should be showing up here.0193

You can see, I don't have anything listed right now; I will be adding those later to the site.0203

The next one is scripts; then we have templates and library items.0209

Those will be added later in the course, which is why we are not really seeing much.0216

But let's go back to the Images area: this is what I find to be the most valuable within the Assets panel, so I usually stay in the Images section.0221

It is the very first category on the upper left.0232

Now, what I can do within this Assets area for images is: notice, if I click on an image, it gives me a nice display of the image; and if I move this size, you can see it does resize it smaller and larger for me.0236

So, if I need to see it a little bit better before I choose an image, I can do that.0253

And, as I go down the list, what I can do is use the up and down arrow on my keyboard, and I can pop right through these images if I need to quickly scan them to grab an image for my website.0260

The other thing this does, you can see right here (and I'll stretch this out just a little bit): it gives you the dimensions--in other words, the sizes--of your images.0274

You can tell, this is a large one, whereas some of these are quite a bit smaller.0285

It is very handy to be able to look at those, especially if you're creating a new page, you know you have some images in your website, and you want to do a quick scan of them to figure out which image should go on this page.0292

This is a great way to do it; and then, you can double-check the size of that image to make sure it would fit where you want to place it.0305

The next piece here is the actual file size of that image; you can see, some of these are small (all the way down to 33K); others get up a little bit bigger (229K).0313

The next one is the type of image (and I'll make this a little bit bigger and make that higher); you can see, these are organized by type.0327

I have a couple of fireworks images in here; a lot of these are JPEG images, so that is where you can tell if it's a GIF or a JPEG, or what type of image it is.0338

And the last piece--this one also comes in very handy: I have been in many websites where they have the image folders and images divided up into a variety of different folders, and you know you want that image, but you can't figure out where it's located in your files in order to access it.0350

You can see, in this example, everything is within a single Images folder; here is an Extras folder--so there is one that is a little bit different.0370

I can go into here, and if I see that image, I can look up the path, and I can locate that image.0380

So, just be aware that the Assets panel is available; when you first define a site in Dreamweaver, and Dreamweaver gives you that message about caching (making the site cache), what it is doing is organizing the information within this Assets panel, as well as organizing it for the Files panel.0387

The Assets panel is right next to the Files; you can always move it or rearrange as you like.0410

These panels are customizable, but just be aware: there is a lot of good information in here if you need it.0417

And if you don't, you just pop this back into this area.0424

But we'll take a look at the Assets panel a little bit further when we go to insert an image, because it comes in very valuable then.0429

But for now, just be aware: it's right next to the Files panel as a tab, and it's available to assist you as you create your web pages.0437

That is the Assets panel in Dreamweaver.0448