Using Frames in Microsoft Expression Web 2

When you read the title you must have thought Duh! Why an article on frames, one
hardly uses it! Well you are right, use of frames has lessened these days, but designers
still find it handy when they need to incorporate multiple pages in a single page. HTML
Frames have been around for quite some time. And I am sure you must have come
across many designers who have advised you ‘never use frames’. I too was under the
same influence, until I realized that a designer can maintain a list of ‘Best and Worst Web
Design techniques’, but one should not categorize any technique as ‘never use’. There
could be effective uses of frames just as others, so do explore them. In this article we
will explore frames in Microsoft Expression Web 2.

Frames are used to organize your page content into different sections or regions of the
screen. Each frame contains a separate page. And such frames are collectively known as
a frameset. Frames divide the page into various sections, each displaying a different
document. All these frames are controlled by a single controlling page. This controlling
page need not have any content of its own, but it informs the browser about the
frameset and the pages to be displayed in each frame.

When do I use frames?

1.    When you have to separate navigation from the content, frames are beneficial since you
can scroll each frame independent of the other.
 
2.    When you want to display different pieces of content in the same page and want each
portion to be independent of the other. So that when you edit a frame the others are not
altered.

Creating Frames

To create a new Frameset follow these steps:

1.    Go to File menu > New > Page.

 
2.    Select Frames Pages from the list of pages.
 
3.    Browse the list of Frame Pages (See preview of each layout in the rightmost pane).
Choose a suitable frame layout and click OK.
        
 
4.    The new page would look like:
     .

 
.
 Each frame now gives you a choice to create a new page or choose an existing page to
be shown in them. To create a new page click ‘New Page’ button in that frame and then
start creating the page. To choose an existing page, click ‘Set Initial Page…’ to launch the
‘Insert Hyperlink’ dialog box. Enter the URL or browse to the location of the page and
click OK to insert the page.
.

 
 
Configuring Frames
 
        Do one of the following:
 
         Right-click inside the frame and choose ‘Frame Properties…’
 
         Select the frame (click in the frame), go to Format menu > Frames > Frame Properties.
 
        The Frame Properties dialog box has these properties:
 
         Name – Give a name to each frame that can be used later while creating hyperlinks to
open in that frame.
 
         Initial Page – This is the URL of the page that will be displayed when the parent page
first loads.
 
         Long Description – This property takes the path/URL of the file which contains a
description of what appears in the frame, for the viewers.
 
         Title – is a short description of the frame.
 
         Frame Size Width and Row Height – State the dimensions for the frame. These
dimensions could be relative to other frames, percentage of the window size or in pixels.
 
         Margin Width and Height – Specifies the margins for the frame.
 
         Resizable in Browser – Check the box to be able to resize the frame in Design View by
dragging its borders.
 
         Show Scrollbars – Lets you choose if scrollbars should appear and when.
NOTE: If you set the scrollbars to never, the content would go beyond the borders of the
frame and would be never visible to the viewers.
 Other configuration settings:

        Split a frame

Go to the Format menu > Frames > Split Frame. In the Split Frame dialog box (shown
below), choose to split the frame vertically into columns or horizontally into rows.
 
        Delete a frame
In the Format menu > Frame > choose Delete Frame. Expression Web will not ask for
confirmation and remove the frame. But you can still undo delete by CTRL + Z or
pressing the Undo button to restore it.
 
        Insert a Hyperlink
You can create a hyperlink and make it open in a frame. Let us take an example.
The left pane is our navigation pane. Enter a link ‘Dotnetcurry’. Highlight the text and
right-click, choose Hyperlink from menu. In the Insert Hyperlink window, enter the
‘Address’ and click ‘Target Frame…’ Now in the Target Frame window choose the frame
where you want this page (URL) to be displayed. In this example we choose main (see
image below) and click Ok in both the windows to close them.