In this lesson, we will be using a special version of the California Wildlife site. So the first thing I want you to do is to open that site in expression web. We will do that the same way you would open any existing website you want to work on that is not already loaded into the program.
First choose file, open site. Now it is not on this list because it is not loaded into the program yet, but I can find it on my hard drive and simply select it to open it. I know it is on the desktop because it is on project files. If you have the full version of this training video, the project files should have been installed onto you desktop when you first loaded the video. If you do not have the project files, you can still follow along. You just would not be able to use the same assets that I am using as I go through the exercises.
To find this version of California Wildlife site, open the project files folder by simply double clicking on it. In part 1 lesson 4, you will find a version of the California Wildlife website that I will be using in this lesson. Select open and expression web will load all of the files in folders into the work space.
I am going to start by working on a page that is in the friend’s folder so that I can just double click to open it and I want dear.htm. Again, I can double click to open it. Remember that same list of files and folders are also on my folder list so I can open and close files by clicking them here as well as in the main work area.
I have already created a couple of layers and add it some images to get this page started. But let us have another layer now. Notice, it jumps to the top of the page when I create the new layer and then I am going to drag it down to right about here. In this layer, I want to add a few pieces of texts that I am going to use as links that go pages deeper in this subsection. I have already created that text for you too. It is on a word document waiting in the background. So I am just going to use alt +tab to switch over the Microsoft word and copy and paste the text that I want to use to link. Control +6 to copy, alt +tab to come back and control +V to paste.
Notice that when I pasted that text MSO normal appeared right above it. It is also in the break trail at the top of the page. When you are looking at there is a class style Microsoft office normal. When you copy and paste text my Microsoft word into expression web, this style is automatically generated to preserve whatever styling you were using in word. Notice also that it has appeared in the apply styles dialog and if I click to manage styles, it is also listed here. Essentially, expression web automatically created that style when I pasted in the text.
What I really want to do for the styles for this text is defined some styles that will affect the way links look on my page because I am about to link each of these words to another page and I do not just want to use the default blue and red colors for links.
So let me show you the easiest way to define style for links on your page. First cut a file then properties. Under the formatting tab, you will find a place where you can set all four of the link options. So instead of default blue, I can choose more colors, use my select button and let us get a nice deep forest green for our Wildlife site.
For visited links, I will use more of a brown color. If you are not familiar with link options, this first option, hyperlink, is how the link will display on a browser if nobody has clicked on it yet. The visited link setting is how the link will appear after the link has been selected so my user can distinguish between links they have clicked on before and once they have not visited yet.
The active hyperlink option specifies the color the link would be as someone clicks on it and the hover hyperlink is the color the link would be when they roll their cursor over it. This is kind of a cool setting because it unable you to create a roll over effect that link color will change as somebody rolls their cursor over it and change again as they click on it. I think three different
