Another habit I always like to encourage is save early and often. So I am going to save this page and at the same time, I will show you one other thing you should know about inserting images into your pages. Using Ctrl S or you can also choose File, Save. Notice that it says Save Embedded Files. What expression web is doing here is offering to copy all of these images that I linked to even though they are in the Assets folder that came with your DVD. Remember they are in lesson 2 in part 1 sitting in that folder on your desktop, but the new folder that I created for this web site got saved in my My Documents folder inside the My Web sites folder. So these images need to be saved inside that same folder or I run the risk that when I upload my web site, my images will not appear because they will not be there to be uploaded. So, Expression Web knows that and it is offering to copy of all these into the correct folder. All I have to do is say OK for that to happen. And you see immediately now in the folder list, all of my images are listed.
You have another option, if you prefer, you can always import the images before you add them to your pages by choosing File, Import, File. You want to add files or you can add in an entire folder. But in this case I am just going to add a few files that I know I will still need to complete this page and have not already been automatically brought in. So if I choose Add File, Expression Web is opening the folder that actually contains the elements of my active web site. But I want some images that are on my desktop, in my Project files folder, in part 01, lesson 02, front page images.
Are you still with me? Now, I do not expect you to know this, but I know I have not yet inserted this front-top-colors image. I have not yet added my osprey and I still need the background image because I want to add all of those in the next part of this lesson. When I click open, Expression Web gets them all ready to import and when I click OK, you see they also drop into my folder list.
So there are number of ways to bring images into your web site directory. If you copy them into that folder outside of Expression Web just using the Windows Explorer in your operating system, they will not appear in the folder list unless you choose the Refresh button under the View Menu. Now the Refresh button is not highlighted because I have not added anything in here. But if I had dragged these images into My Web site folder, I would not see them here until I hit Refresh.
That is a lot of explanation about how you move files around, but trust me, this is one of the places where I have seen a lot of people getting into trouble because you link to something in a different place on your hard drive and it will work fine all of the time you are testing your site on your local computer, but as soon as you transfer your site up to a remote server all your image references will break. If you already have some experience with web design, some of these things may seem a little basic, but I want to make sure that everybody has the fundamentals before we move on to the more complex aspects of web design.
Transcription by:
Scribe4you Transcription Services