About frames and framesets  

Resources: to use for images and development of your own practice site

Trees of the MidAtlantic States: pictorial guide for students
http://www2.mcdaniel.edu//Biology/appliedbotany/treeidlab/treeidset.html
Flowers of Hashawa:pictorial guide
http://www2.mcdaniel.edu/Biology/appliedbotany/hashawaapr10/flowerguide.html

A frame is a region in a browser window that can display an HTML document independent of what's being displayed in the rest of the browser window.
A frameset is an HTML file that defines the layout and properties of a set of frames, including the number of frames, the size and placement of the frames, and the URL of the page to be initially displayed in each frame. The frameset file itself doesn't contain HTML content to be displayed in a browser, except in the noframes section (see Handling browsers that can't display frames); the frameset file simply provides information to the browser about how a set of frames should be displayed and what documents should be displayed in them.
To view a set of frames in a browser, enter the URL of the frameset file; the browser then opens the relevant documents to display in the frames. The frameset file for a site is often named index.html, so that it displays by default if a visitor doesn't specify a filename.

Note that a frame is not a file. It's easy to think of the document that's currently displayed in a frame as an integral part of the frame, but the document isn't actually part of the frame--any frame can display any document.

In Dreamweaver, you can create a frameset in either of the following ways:
• To create a frameset with the current document displayed in one of the frames, use the Insert bar's Frames category.
• To create a frameset with all its frames blank, use the Frameset category in the New Document dialog box.
You can format all of your frames and framesets through the Property inspector. You can set scrolling on or off, set width and height, name each frame, and more.


A site that appears in a browser as a single page comprising three frames actually consists of at least four separate HTML documents: the frameset file, plus the three documents containing the content that initially appears inside the frames. When you design a page using framesets in Dreamweaver, you must save each of these four files in order for the page to work properly in the browser.

Deciding whether to use frames
The most common use of frames is for navigation. A set of frames often includes one frame containing a navigation bar and another frame to display the main content pages.
However, designing with frames can be confusing, and in many cases you can create a web page without frames that accomplishes many of the same goals as a set of frames. For example, if you want a navigation bar to appear on the left side of your page, you can either replace your page with a set of frames, or just include the navigation bar on every page in your site. (Dreamweaver helps you create multiple pages that use the same layout; see About Dreamweaver templates.) The following image shows a page design with a frame-like layout that doesn't use frames.


Many professional web designers prefer not to use frames, and many people who browse the web dislike frames
. In most cases this dislike is due to having encountered sites that use frames poorly or unnecessarily (such as a frameset that reloads the contents of the navigation frames every time the visitor clicks a navigation button). When frames are used well (such as when they're used to keep navigation controls static in one frame while allowing the contents of another frame to change), they can be very useful for some sites.
Not all browsers provide good frame support, and frames may be difficult for visitors with disabilities to navigate, so if you do use frames, always provide a noframes section in your frameset, for visitors who can't view them. You may also want to provide an explicit link to a frameless version of the site, for visitors whose browsers support frames but who don't like using frames.
Advantages to using frames include the following:
• A visitor's browser doesn't need to reload the navigation-related graphics for every page.
• Each frame has its own scrollbar (if the content is too large to fit in a window), so a visitor can scroll the frames independently. (For example, a visitor who has scrolled down to the bottom of a long page of content in a frame doesn't need to scroll back up to the top to use the navigation bar if the navigation bar is in a different frame.)
Disadvantages to using frames include the following:
• Precise graphical alignment of elements in different frames can be difficult.
• Testing the navigation can be time-consuming.
• The URLs of the individual framed pages aren't displayed in the browser, so it can be difficult for a visitor to bookmark a specific page (unless you provide server code that allows them to load a framed version of a particular page).

To ensure that your frameset appears correctly in browsers:
1. Create your frameset and specify a document to appear in each frame
2. Save every file that's going to be displayed in a frame. Remember that each frame displays a separate HTML document, and each document must be saved. Also save the frameset file.
3. Set the properties for each frame and for the frameset. This includes naming each frame, setting scrolling and non-scrolling options, and more.
Tip: You may also want to set the title attribute for a frame, to improve accessibility. (Note that the title attribute is not the same as the name attribute.) To set the title attribute, select the frame and choose Modify > Edit Tag; then select the Style Sheet/Accessibility category and enter a title in the Title text box. Alternatively, enable the accessibility authoring option for frames; for more information, see Authoring for accessibility.
4. Make sure to set the Target property in the Property inspector for all your links so that the linked content appears in the correct area

Creating frames and framesets
There are two ways to create a frameset in Dreamweaver: you can design it yourself, or you can select from several predefined framesets. Choosing a predefined frameset automatically sets up all the framesets and frames needed to create the layout and is the easiest way to create a frames-based layout quickly. You can insert a predefined frameset only in the Document window's Design view.

To create a new empty predefined frameset:
1. Choose File > New.
2. In the New Document dialog box, select the Framesets category.
3. Select a frameset from the Framesets list.
4. Click Create.

If you must create your own framer design follow the following directions: NOT THIS FIRST TIME!

Creating and editing a frameset
Before creating a frameset or working with frames, make the frame borders visible in the Document window's Design view by choosing View >Visual Aids > Frame Borders.
To create a frameset:
Choose a splitting item (such as Split Frame Left or Split Frame Right) from the Modify > Frameset submenu.
The window is split into frames, and the document you started with appears in one of the frames.
To split a frame into smaller frames, do one of the following:
• To split the frame where the insertion point is, choose a splitting item from the Modify > Frameset submenu.
• To split a frame or set of frames vertically or horizontally, drag a frame border from the edge of the Design view into the middle of the Design view.
• To split a frame using a frame border that isn't at the edge of the Design view, Alt-drag (Windows) or Option-drag (Macintosh) a frame border.
• To divide a frame into four frames, drag a frame border from one of the corners of the Design view into the middle of a frame.
Tip: To create three frames, start with two frames and then split one of them. It's not easy to merge two adjacent frames without editing the frameset code, so turning four frames into three frames is harder than turning two frames into three frames.
To delete a frame:
Drag a frame border off the page or to a border of the parent frame.
If there's unsaved content in a document in a frame that's being removed, Dreamweaver prompts you to save the document.
Note: You can't remove a frameset entirely by dragging borders. To remove a frameset, close the Document window that displays it. If the frameset file has been saved, delete the file.

Viewing and setting frame properties
Use the Property inspector to view and set most frame properties. To change the background color of a frame, set the background color of the document in the frame.
To view or set frame properties:
1. Select a frame by doing one of the following:
• Alt-click (Windows) or Shift-Option-click (Macintosh) a frame in the Document window's Design view.
• Click a frame in the Frames panel.
2. Choose Window > Properties to open the Property inspector if it isn't already open.
3. To see all of the frame properties, click the expander arrow in the lower right corner of the Property inspector.
.
To change the background color of a document in a frame:
1. Place the insertion point in the frame.
2. Choose Modify > Page Properties.
3. Click the Background pop-up menu to select a color.

Use the Page Properties dialog box to specify a variety of options for the page.
To open the Page Properties dialog box, choose Modify > Page Properties.

Title specifies the page title that appears in the title bar of the Document window and most browser windows.

Background Image and Background specify a background image and background color for the page.

Text and Links define default colors for text, links, visited links, and active links.

Left Margin and Top Margin specify the sizes of page margins in the body tag, for Microsoft Internet Explorer only. Netscape Navigator ignores these values, using Margin Width and Margin Height instead. For best cross-browser results, provide margin values for both browsers instead of just one browser; fill in all four margin values instead of just two. To ensure that no margins appear in either browser, set all four values to 0. Dreamweaver doesn't display page margins in the Document window; to see the margins, use Preview in Browser.

Margin Width and Margin Height specify the sizes of page margins in the body tag, for Netscape Navigator only. Internet Explorer ignores these values, using Left Margin and Top Margin instead. For best cross-browser results, provide margin values for both browsers instead of just one browser; fill in all four margin values instead of just two. To ensure no margins in both browsers, set all four values to 0. Dreamweaver doesn't display page margins in the Document window; use Preview in Browser to see the margins

To change the fonts that Dreamweaver uses to display each encoding, choose Edit > Preferences or Dreamweaver > Preferences (Mac OS X) and select New Document. Note that the fonts you select in the New Document preferences do not affect how visitors see your pages; visitors specify their own fonts (for a given encoding) in their web browsers. For more information, see Setting Fonts preferences.

Tracing Image specifies an image to use as a guide for copying a design. See Using a tracing image. This image is for reference only, and does not appear when the document is displayed in a browser.

Image determines the opacity of the tracing image, from completely transparent to completely opaque.

Document Folder displays the folder in which the current document is saved, if it has been saved.

Site Folder displays the path of the local root folder for the site in which the current document is saved, if it has been saved. See Setting up a Dreamweaver site.


Creating jump menus
A jump menu is a pop-up menu in a document, visible to your site visitors, listing options that link to documents or files. You can create links to documents in your website, links to documents on other websites, e-mail links, links to graphics, or links to any file type that can be opened in a browser.
A jump menu can contain three basic components:
• A menu selection prompt, such as a category description for the menu items, or instructions, such as "Choose one:" (Optional)
• A list of linked menu items: a user chooses an option and a linked document or file opens. (Required)
• A Go button. (Optional)

To insert a jump menu in your document, use the Jump Menu form object.
To create a jump menu:
1. Open a document, and then place the insertion point in the Document window.
2. Do one of the following:
• Choose Insert > Form Object > Jump Menu.
• Select the Form tab in the Insert bar, and then click the Jump Menu button.
The Insert Jump Menu dialog box appears.3. Complete the dialog box.
4. Click OK.

Setting Insert Jump Menu options
The purpose of this dialog box is to set up a jump menu.
Procedure
1. Click the plus (+) button to add a menu item.
Click the button again to add additional menu items. Select a menu item and click the minus (-) button to remove an item.
2. Select a menu item, and then use the arrow keys to move it up or down in the list.
3. In the Text field, type the text you want to appear in the menu list for a menu item.
To use a menu selection prompt, such as "Choose One," enter your selection text in the Text field for the first menu item.
4. In the When Selected Go To URL text box, click the folder icon to browse to the file to open, or type the file path in the text box.
5. In the Open URLs In pop-up menu, select a location in which to open the file:
• Main Window opens the file in the same window.
• Frame opens the file in the frame you select.
Note: If the frame you want to target doesn't appear on the Open URLs In pop-up menu, close the Insert Jump Menu dialog box, and name the frame in your document.
6. In the Menu Name text box, type a name for the menu item.
7. Under Options, select Insert Go Button After Menu to add a Go button instead of a menu selection prompt.
8. Under Options, select Select First Item After URL Change if you use a menu selection prompt (such as Choose One).
9. Click OK.
Troubleshooting jump menus
Once users choose a jump menu item, there is no way to reselect that menu item if they navigate back to that page, or if the Open URL In field specifies a frame. There are two ways to work around this problem:
• Use a menu selection prompt, such as a category, or a user instruction, such as "Choose one:". The menu selection prompt is reselected automatically after each menu selection.
• Use a Go button, which allows a user to revisit the currently chosen link.
Note: Select only one of these options per jump menu, in the Insert Jump Menu dialog box, because they apply to an entire jump menu.


Your job is to create a frameset and include some content in all three "pages".

Frist create a frame folder, put in all your picture files.. then start the process... you can use the images etc from one of the web sites listed above.