-
Week 10, November 6
& 8
-
Announcements
|
| |
-
Note: You should be creating backup Web
sites for Final each day you work on it.
|
|
Planning Analysis Sheet. It's time to start
building the pages, shared borders, and content of your Final Web site.
The goal of the PAS is to guide you to finalize the organization and pages
for your Final Web site without focusing on the details of the content of
each page. We will finish part of this in class together this week and you
will finish the rest for homework. Click
here for an example of your PAS at this point.
|
Navigation
in a Frameset Page:
I will open
my Lollipop Gifts practice final on the server,
and you will open your
Final Web with me as we create the frameset, main, banner, and
content pages. Your Final Web site should include a home page that is
almost finished, PAS.doc (Heading, Objective, and References sections
completed), and Final.htm (a page with the Final table
copied/pasted). You should have already created your Child 1 pages and a
Guest Book page and you should have decided upon the content of your
frameset page and at least three of your main pages. Your navigation
structure should look similar to my Lollipop Creations navigation at
this point. Click
here
to see my Lollipop Gifts practice final before I create the frameset
pages.
Today,
we'll create the main pages, frameset page, banner page, and
contents page. Click here to see my Lollipop Gifts practice final
after I create the frameset pages.
Your navigation structure should look similar to my Lollipop
Creations navigation by the end of class today.
Note: The Frames Banner button will be renamed "Lollipop
Creations" so that the banner name will display the Web site name.
Click
here to see a
handout that summarizes all the steps to create
frameset pages.
|
Create the main pages:
-
Create and save
Frame_Main1_description.htm.
Insert a 1-cell, 640-pixel borderless table.
(Click
here for steps if you can't see the bottom of the Insert
Table dialog box.)
Type a brief word
or two describing the contents of this page. I will name my
first main page
Frames_Main1_Gift_Jars.htm.
-
Remove the top shared border from this page; keep the bottom
shared border.
- The
main pages should be unified in design; for example, If you use
headings and backgrounds, keep them consistent. The best way to
accomplish this is to create your first main page, get it
exactly right, and save it. Then click File, Save As,
and create your second frameset main page changing the filename,
title, and content as needed. Continue until all main pages (Frame_Main2_description.htm,
Frame_Main3_description.htm,
etc.) have been created. I will name my second main page
Frames_Main1_Gift_Pails.htm. I will name my third main page
Frames_Main1_Gift_Tins.htm.
|
Create the frameset page:
- Create a frameset page named
Frameset_description.htm (File, New, More page templates, Frames Pages
tab, Banner and Contents).
- Assign a title to the frameset page that generically describes the content of
the frames page so that it will make sense as a hyperlink button in the
navigation link bar. Lollipop Gifts is a title that makes sense
in this Web since the main pages display Lollipop Gifts. I will name my
frameset page Frameset_Lollipop_Gifts.htm and title it
Lollipop Gifts.
- Drag Frameset_desctiption.htm into
the appropriate position in the navigation structure of your Web site,
and delete any frameset placeholder page you might have added from the Web entirely.
|
Create the banner page with a banner and link
bar:
- Create a new page named
Frame_Banner.htm. Remove any shared borders from
this page.
- Insert a page banner (Insert, Page Banner) on the
first line. Change the banner title to the title of the frameset
page. I will title my banner Lollipop Gifts.
- Switch to
Navigation View,
right-click on the navigation screen, and click Portrait/Landscape;
drag and drop Frame_Banner.htm from the Folder List to Navigation View
as a child page of your frameset page.
- Insert
a link bar:
Insert, Web
Component;
Component Type—Link Bars, Bar based on navigation structure, Next; Choose a bar style, Next; Choose an orientation,
Finish; add navigation to point to Child pages under Home and
Home page. Do not place the link bar inside a table because
you want it to spread across the entire top of the frameset page.
In Navigation View, right-click the page icon for
Frame_Banner.htm and uncheck Included in Link Bars.
- Open the
frameset page, and set Frames_Banner.htm as the
initial page in the banner frame.
- If the banner frame is taking up too much screen real estate,
double-click the custom link bar and change the style to a simple one
like a dot style or change the banner to text rather than picture. Or remove the banner frame altogether. Click
here for steps.
-
Preview and test the banner frame links. In order for the custom link bar in
Frames_ Banner.htm to
display the linked pages in a whole page, do this:
From the frameset page, right-click Frames_ Banner.htm, and click
Page
Properties. Under the General tab, Default target frame,
click the Change Target Frame button; in the Target Frame
window, under Common Targets, click Whole Page, OK,
OK.
Create the contents page with a link bar:
- Create a new file named
Frame_Contents.htm. Remove all shared borders
from the current page.
- Switch to
Navigation View,
right-click on the navigation screen, and click Portrait/Landscape;
drag and drop Frame_Contents.htm from the Folder List to Navigation View
as a child page of your frameset page next to
Frame_Banner.htm.
- Drag
your main pages in order from the Folder List to Navigation View
as child pages of Frame_Contents.htm.
- Insert a link bar:
Insert, Web
Component;
Component Type—Link Bars, Bar based on navigation structure, Next; Choose a bar style, Next; Choose an orientation,
Finish; add navigation to point to Child level and Home
page.
- The home page is
already a link in the banner frame and so should not be duplicated
here. However, if you decide not to use a banner frame, you should
create a manual hyperlink that opens the home page in a new
window. Do not add
a home link to the link bar because the home page would open in the
main frame instead of a whole window. Do not
place this link bar inside a table.
-
Open the frameset page, and set Frames_Contents.htm
as the initial page in the contents frame.
-
Preview and test the contents frame links. In order for the custom link bar in Frames_
Contents.htm to display the linked pages in a whole page, do this:
From the frameset page, right-click Frames_ Contents.htm,
and click Page Properties. Under the General tab,
Default target frame, click the Change Target Frame button;
in the Target Frame window, under Current frames page, click the main
frame window in the diagram on the right.
Trouble? If that doesn't work, do this: Open Frames_ Contents.htm,
right-click, and click Page Properties. Click the Change Target Frame
button; under Common targets, click Whole Page, OK. Then
return to the frameset page to the contents frame and repeat setting the target
of Frames_ Contents.htm
to the main
page as shown below.
If desired, delete the banner frame and
add a home page link to the contents page:
- If your banner frame is taking up too much screen real estate, you
are free to remove it. To remove the banner frame, open the frameset
page and click the banner frame. Click Frames, Delete Frame.
Next, you will need to add a home page hyperlink to the contents frame.
- Open the contents page, create a 2-row borderless left-aligned table
and drag and drop your the link bar into Row 2.
- Click in Row 1 and create a manual hyperlink to the home page and
set the hyperlink Target Frame to open in a Whole Page. You cannot
simply modify the custom link bar and add the home page as a link
because it will open the home page in the main frame, which you do not
want.
Note: If you want to create a custom button using
pictures from your theme with matching text and a hotspot
hyperlink, try this:
Insert the Picture: Tools, Site Settings, Advanced
tab, check Show hidden files and folders;
Insert Picture
From File button; in the Look In box, browse to
_themes/ThemeName; click the View button and select
Preview; point to each picture to preview and double-click the
desired picture to insert it.
You might want to use a different picture to represent the home
page since it has a different behavior than the buttons on the
link bar below it.
Determine the font for the button text: Format,
Theme; in the Theme task pane, point to the thumbnail
for the current theme, click the list arrow, Customize;
in the Customize Theme window, click, Graphics button; Item
box—select Horizontal Navigation; click Font tab, and
write down the font Style and Size; cancel out of all
windows. Select the inserted picture in Row 1; from the PIctures
toolbar, click the Text button to Insert a text label; use the same font style, size, and
position of the buttons as was used on the Contents page link bar.
If desired, eliminate the frameset borders:
- With frameset page open, Frames, Frame Properties, Frames Page,
Frames tab, uncheck Show Borders.
|
|
| Discuss T4WS, Garden Gill, and FinalHP. |
|
|
Session 5.2, pp. 304-324
- Understanding Frames, p. 304
Q:
Why use a frames page?
A: When you have multiple pages in a Web site (like the list of
survey forms on the
CAOT Surveys
page or perhaps a list of items for sale) and screen real estate is
not an issue, you might consider a frames page to display them. On our
Assignment
Sheet page, I chose not to use a frames page because I didn't want to
lose screen real estate and because I included the Excel
Spreadsheet information on the page so the page included
more than just navigation bars. |
|
p.
309, Step 9. To name files in a frames page
for easy identification later: Try naming pages like this:
Frameset.htm, Frame_Banner.htm, and Frame_Content.htm.
Being able to distinguish amongst these files could be important such as
in Item 15 of your Final Web site.
You could also right-click the file, click Properties, Summary
tab, and type a Comment which would be visible in Folders
view. It is also a good idea to organize all frameset pages on a given
topic into a unique folder. |
p.
309, Step 9: Right-click irr.htm, click
Properties, Summary tab, and type Frameset for the Comment which would be
visible in Folders view. |
|
p.
314. To
manually specify a target frame: If you have trouble with the
hyperlinks in the Contents frame displaying the target in the
main frame, right-click the hyperlink and click Hyperlink Properties;
in the Edit Hyperlink window, click the Target Frame
button, and type main in the Target setting box. For a
home page hyperlink, the target would be Whole Page or type
_top in the Target setting box. |
|
p.
319, Step 9. To create link
bars in the banner and contents frame for navigation on
a frameset page: It is better to use a link bar
for navigation in a frameset page than it is to use
manual hyperlinks. When pages are
added or deleted from child level 1 pages or main pages
or link bars, the link bars will be updated
automatically. If you created manual hyperlinks, you
will have to remember to update them each time and the
chance for errors increases.
- Banner Frame: Drag the banner and contents
page into the navigation structure under the frameset
page. Unless you take this step, you cannot add link
bars on these pages. Because you do not want these
pages to show in a link bar, right-click both pages and deselect Included
in Link Bars. Open the banner page, and insert a
link bar based on the navigation structure in the
contents pane using the horizontal style set to
display Child pages under home; right-click and click
Page Properties; under the General tab,
Default target
frame, click the Change Target Frame button; in the
Target Frame window, click Whole Page, OK, OK.
- Contents Frame: Drag the main pages into
the navigation structure on the same level as or under the contents page. Edit
the navigation button names as needed. Insert a link
bar based on the navigation structure in the contents
pane using the vertical style set to display same
level or child
level, depending on where you have dragged your main
pages.
|
p.
323: When we have finished Tutorial 5, I will create
navigation in the frameset page, irr.htm, for
Garden using FrontPage navigation link bars, banners,
and shared borders that will mimic the navigation
created in this tutorial for this frameset page. Click
here to see a
handout that summarizes steps to create frameset pages with link bars
based on navigation structure. I will be demonstrating
this approach in detail in two weeks when you create
your frameset pages with me for your Final Web site.
|
|
|
|
garden Web
site solution: At the end of each tutorial, I
will publish to the garden Web so that you will
always have the correct solution for the next tutorial.
You will find it at
http://ca112.lacitycollege.edu/ca112axx/garden in which xx
will be replaced by your assigned publishing number. You will then be
ready to open garden as it should be after the Review Assignment on p. 325 and continue working on it in Tutorial
6.
As always, the best way to learn to use FrontPage is to practice;
therefore, publish the garden Web site you
have been working on in class to
http://ca112.lacitycollege.edu/ca112axx/gardenPractice,
open gardenPractice, and continue working on it as desired. |
|

Week 11, Case Problem 2.
This is next week's homework, but we will start it this
week if time allows. |
|
|
|
|
E-mail assignments
with this e-mail icon to me no later than Sunday at noon unless
otherwise announced. No assignments are accepted late. In all e-mail
messages, the subject line should be Your Name, last 4 numbers of your
student ID, project ID.
|
T5PT, up to 10 points: The
URL for Tutorial 5 Practice Test is
http://caot.lacitycollege.edu/112/TestsPractice/tutorial_5_practice.htm.
When you click this URL, the Tutorial 5 Practice test will open in your
browser. Type your name in the Name box, answer each question, then click
Check Your Work. You may retake the test as many times as you want
until you earn the desired score.
When you are satisfied with the score, paste a print screen into homework.htm
that shows your name and the score. Paste the print screen at the top of the
page so your most recent test is always shown first. When you are finished, open
homework.htm in Internet Explorer by clicking the Preview button. Click inside the Address
box and press Ctrl-C to copy the URL to homework.htm. Open your e-mail client and
paste the URL into the body of the message. You should see a hyperlink to
homework.htm appear. The e-mail subject line should be Your Name, last
4 digits of your student ID, T5PT.
| 90-100% |
= |
10 pts. |
| 80-89% |
= |
5 pts. |
| Below 80% |
= |
0 pts. |
|
| Final Web Site: Continue working on
your PAS and your Final Web site. In particular, finish your home page
content and add all Child Level 1 pages with titles if you have not
already done so to your Final Web site. See the
Final Exampage for details. You should
try to include all features to your Final Web site that we have covered in
class to this point. |
| Continue
to work on your Planning Analysis Sheet. See the
Final Exam page for details. |
|
Extra credit assignments are due no later than Sunday evening. |
Last revised
Monday, November 05, 2007 11:55 AM.
|