Search This Blog

Monday, October 11, 2010

Chapter 5 - Designing a Web Site with Frames (Part2)

Working with Frames and Links

  • By default, clicking a link within a frame opens the linked file inside the same frame

  • You can display hyperlinks in many ways:
    -in a different frame
    -in a new window
    -in the entire window

  • When you want to control the behavior of links in a framed page, there are two required steps:
    -give each frame on the page a name
    -point each hyperlink to one of the named frames

  • Files and links in a Web Site

    Assigning a Name to a Frame

  • To assign a name to a frame, add the name attribute to the frame tag

  • The syntax for this attribute is:
    <frame src=“url” name=“name” />

    -case is important in assigning names: “information” is considered a different name than “INFORMATION”

  • Setting the Frame Names

    Specifying a Link Target

  • You can use the target attribute to open a page in a specific frame

  • The syntax for this is: target=“name”

  • When a page contains dozens of links that should all open in the same frame, HTML provides a way to specify a target frame for all the hyperlinks within a single page

  • Using Reserved Target Names

  • Reserved target names are special names that can be used in place of a frame name as the target

  • They are useful in situations:
    -where the name of the frame is unavailable
    -when you want the page to appear in a new window
    -when you want the page to replace the current browser window

  • All reserved target names begin with the underscore character ( _ ) to distinguish them from other target names

  • Reserved target names are case-sensitive, they must be entered in lowercase

  • Using the _self target

    Using the <noframes> Tag

  • Use the <noframes> tag to allow your Web site to be viewable using browsers that do or do not support frames

  • When a browser that supports frames processes this code, it ignores everything within the <noframes> tags and concentrates solely on the code within the <frameset> tags

  • When a browser that doesn’t support frames processes this code, it doesn’t know what to do with the <frameset> and <noframes> tags, so it ignores them

  • When you use the <noframes> tag, you must include <body> tags, this way, both types of browsers are supported within a single HTML file

  • The <noframes> Syntax

  • The syntax for the <noframes> tag is:
    page content

  • Frameless Version of a Web Site

    Inserting the Noframes Code

    Working with Frame Borders

  • There are additional attributes you can apply to the <frame> tag that allow you to change border size and appearance. For example:
    -you can remove borders from your frames to free up more space for text and images
    -you can change the color of the frame border so that it matches or complements the color scheme for your Web site

  • To change the color of a frame’s border, use the bordercolor attribute

  • The attribute can be applied either to an entire set of frames, using the <frameset> tag, or to individual frames, using the <frame> tag

  • The syntax for this attribute is:

  • Setting the Border Color

  • Applying the bordercolor attribute to the <frameset> tag affects all of the frames and nested frames within the set

  • If you apply the bordercolor attribute to a single <frame> tag, that particular color of the border changes in Internet Explorer, but in Netscape Navigator, all of the frame borders change

  • View the page using different browsers and browser versions

  • Web Site with Brown Frame Border

    Setting the Border Width

  • Another way of modifying frame borders is to change their widths using the border attribute

  • The border attribute can be used only in the <frameset> tag, and not in individual <frame> tags

  • The syntax for the border attribute is: <frame frameborder=“value”>
    -value is the width of the frame borders in pixels

  • Removing the Frame Borders

  • Some Web designers prefer not to show frame borders in order to give the illusion of having a single Web page rather than three separate ones, while other Web designers believe that hiding frame borders can confuse users as they navigate the Web site

  • Creating Inline Frames

  • Another way of using frames is to create a floating frame

  • An inline frame, or floating frame, is displayed as a separate box or window within a Web page

  • The frame can be placed within a Web page in much the same way as an inline image

  • The Floating Frames Syntax

  • The syntax for a floating frame is:
    <iframe src=“url”>
    alternate content

    -URL is the name and location of the file you want to display in the floating frame
    -the alternate content is the content you want displayed in the browser that don’t support inline frames
    -in addition to these attributes, you can use some of the other attributes you used with fixed frames, such as the marginwidth, marginheight, and name attributes

  • Attributes of inline frames

    Creating an inline frame

    Viewing a Floating Frame

    back to top