frames l.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
FRAMES PowerPoint Presentation
Download Presentation
FRAMES

Loading in 2 Seconds...

play fullscreen
1 / 38

FRAMES - PowerPoint PPT Presentation


  • 180 Views
  • Uploaded on

FRAMES . Pros and Cons. Barbara Jacobs Dick Delaney Bob Rogalski. A frame is a section of the browser window capable of displaying the contents of an entire Web Page. What are Frames?. Source: Patrick Carey (2003), New Perspectives on Creating Web Pages with HTML 3 rd Edition.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'FRAMES' - uri


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
frames

FRAMES

Pros and Cons

Barbara Jacobs

Dick Delaney

Bob Rogalski

what are frames
A frame is a section of the browser window capable of displaying the contents of an entire Web PageWhat are Frames?

Source: Patrick Carey (2003), New Perspectives on Creating Web Pages with HTML 3rd Edition

what are frames continued
The multiple views of frames offer designers a way to keep information visible, while other views are scrolled or replaced.

For example:

Within the same window, one frame may display a static banner, a second frame a navigation menu and a third frame the main document that can be scrolled through or replaced by navigating in the second frame

What are Frames? (continued)

Source: http://www.w3.org/TR/REC-html40/present/frames.html#h-16.1

an example of frames
An Example of Frames

This figure shows a common use of frames: displaying a table of contents in one frame, while showing individual pages from the site on the another.

Source: Creating Web Pages with HTML, 3rd e, Tutorial 5 (C. Hueckstaedt)

plan your frames
Plan your Frames
  • Frame issues to consider
    • What information will be displayed in each frame
    • How do you want the frames to be placed on the Web page
    • What is the size of each frame
    • Which frames are static (always showing the same content)
    • Which frames will change in response to hypertext links being clicked
    • What Web pages will users first see when they access the site
    • Should users be permitted to resize the frames

Source: Patrick Carey (2003), New Perspectives on Creating Web Pages with HTML 3rd Edition

frames document tags
Frames Document Tags

Source: Deborah S & Eric J Ray, HTML 4 for Dummies

frameset attributes
<frameset> Attributes

Source: Deborah S & Eric J Ray, HTML 4 for Dummies

frameset attributes con t
<frameset> Attributes (con’t)

Source: Deborah S & Eric J Ray, HTML 4 for Dummies

frame attributes
<frame> Attributes

Source: Deborah S & Eric J Ray, HTML 4 for Dummies

frame attribute con t
<frame> Attribute (con’t)

Source: Deborah S & Eric J Ray, HTML 4 for Dummies

iframe attributes
<iframe> Attributes

Source: Deborah S & Eric J Ray, HTML 4 for Dummies

iframe attributes con t14
<iframe> Attributes (con’t)

Source: Deborah S & Eric J Ray, HTML 4 for Dummies

sample frame syntax
Sample Frame Syntax

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN"><html><head><title>This Site - Welcome</title></head>

<frameset cols="40%, 30%, 30%"><frameset rows="150, *">

<frame src="keyboards.html" name="keyboards“ frameborder="1" marginwidth="2" marginheight="2"><frame src="monitors.html" name="monitors" frameborder="1" marginwidth="2" marginheight="2"></frameset><frame src="cpus.html" name="cpus" frameborder="1" marginwidth="2" marginheight="2"><frame src="mice.html" name="mice" frameborder="1" marginwidth="2" marginheight="2">

<noframes>

<body><p>Content of the noframes version.<ul><li>Some information<li>More information</ul></body></noframes>

</frameset></html>

Source: http://www.sbrady.com/hotsource/html/frames.html

slide16
Pros
  • Frames allow you to keep pertinent information always on the screen.For example, if you click any of the links on the Frames Links page, you will open a frameset. The top frame is always in view so that you can get back to the HTML Web site. If this were in a table and you had scrolled to the bottom of the screen, you wouldn't see those options as easily.

Source: http://webdesign.about.com/cs/framesproscons/index.htm

cont pro s
Cont. Pro’s
  • Some studies have shown that viewers of the web have a tendency not to scroll very much. While I believe that people will scroll if they find the page interesting, it is better to keep things you want them to see at the top of the page, or in a static frame.
  • Keep the user happy!

Source: http://webdesign.about.com/cs/framesproscons/index.htm

cont pro s18
Cont. Pro’s
  • Frames provide a simple way to create a Table of Contents for your site.It's simple because you only need one page of HTML to create the table of contents. If you do a TOC in a table on every page, you have to recreate the same information over and over.

Source: http://webdesign.about.com/cs/framesproscons/index.htm

cont pro s19
Cont. Pro’s
  • Frames create an advertisment that is always present.
  • Advertising may be annoying, but it is an easy way to generate revenue for a Web site. Even if your ads are simply link exchange banners, they are more likely to be hit if they are right in front of your viewers.

Source: http://webdesign.about.com/cs/framesproscons/index.htm

cont pro s20
Cont. Pro’s
  • Frames allow you to "brand" your site.
  • In the same fashion that you can create an advertising space, you can create a space for your Web site logo or Company Information and keep it in a frame so that it is always in view of your readers. Branding helps your audience remember your site, especially if you have a compelling graphical element that allows them to remember you. And if it is always present in a frame, they are more likely to remember it.

Source: http://webdesign.about.com/cs/framesproscons/index.htm

the cons of frames

The “cons” of Frames

by Robert Rogalski

cons pros
Cons > Pros
  • The cons very greatly outweigh the pros.
  • Frames can be useful and tolerable if designed properly.
  • Frames can represent a nuisance if not designed and implemented properly.
scrollbar mania or not
Scrollbar Mania (or not)
  • Frames can mean added scrollbars on the page (a bad thing).
  • If the browser is restored to a smaller size, scrollbars may appear on each frame. This may include horizontal scrollbars on a frame if the width of that frame is too small.
  • If the scrolling attribute is set to “no” within the <frame> tag, and if the browser is restored to a smaller size, clipping of content may occur, and thus the user may not be able to scroll down the frame to see additional content (if any). This is common when viewing content on a left-framed list of links.
  • A possible solution: Always set scrolling equal to “auto” within the <frame> tag for each and every frame. At the same time, set the frameborder attribute equal to zero to avoid the slider tray from appearing on the page.
spidering problem
Spidering Problem

Let’s take a look at this code. Notice that there is no <body> tag…

<html>

<head>

<title>cnyrock</title>

</head>

<frameset cols="140,*" border="0">

<frame src="menu.html" frameborder="0" marginwidth="0“ marginheight="0" scrolling="no“ noresize="noresize" />

<frame src="message.html" frameborder="0" marginwidth="0" marginheight="0" scrolling="auto" name="main" />

</frameset>

</html>

slide25
The page just shown is the first page of the Web site which initiates the framed pages. Since this first page consists of no links and no content, the search engine will not be able to spider the rest of the pages associated with that site.
  • A possible solution: Place the following code between the <frameset> opening and closing tags:

<noframes>

<body>

link(s) to the next page(s)

</body>

</noframes>

Also, implement the <meta name=“keywords” content=“key words” /> tag between the <head> opening and closing tags so that search engines can index the frameset page.

search retrieval problems
Search Retrieval Problems
  • When searching for a site with frames, the user might retrieve 1 frame instead of the entire site, hence not being able to view the whole site.
  • A possible solution: Have each frame consist of a home link, or better yet, JavaScript code that forces all frames to appear (beyond the scope of this course).
im proper linking
(Im)proper Linking
  • A link to another site within a frame might load that site into that same frame, which means the other frame is remaining intact with a different site.
  • A possible solution: Always have links consists of the attribute target=“_blank” which will bring up a new browser window for that link.
frames can break
Frames Can Break
  • It has been experienced that frames may not load properly or not at all. Sometimes when loading a site with frames, one frame might load up while another frame is missing.
  • A Possible Solution: Try maximizing the browser and refreshing the page for optimal results.
bookmarking back reload
Bookmarking, Back, & Reload
  • If attempting to bookmark a frame, that frame might not get bookmarked; but rather, the frameset page will get bookmarked instead.
  • If you want to go back to a previous frame, the back button may or may not give you the previous frame.
  • If at a certain frame, reloading the page will more than likely reload the entire site.
printing problems
Printing Problems
  • One of the most major problems with frames.
  • Only one frame at a time can get printed.
  • A possible solution: Click on File and then click on Print Preview to see exactly what you are printing!
i frames
I-Frames
  • An i-Frame loads a new browser or image on the same page you are currently at. However, the image must fit the i-frame perfectly. If the image size is larger than the i-frame size, then scrollbars within the i-frame will appear and/or there will be image cutoff. If the image size is smaller than the i-frame size, then the background of the i-frame will be noticed (if that background is of different color).
frame incompatible browsers
Frame-Incompatible Browsers
  • Older browsers or browsers that don’t recognize frames will not be able to access the frames.
  • A possible solution: Place the <noframes> beginning and ending tags within the frameset that redirects the user to a non-framed site via a hyperlink. Also, user must update browser to the latest version!
some good news
Some Good News…
  • For the most part, we no longer have to worry about browsers being “frame-incompatible.”
  • Today, about 99% of browsers are now frame-compatible. An example of a “browser” that falls into the 1% category is WebTV.
  • Most people today update or should update their browser to the latest version. A lot of computers today automatically update software. Using a well-known browser that supports frames such as Netscape or Internet Explorer is an optimal solution in getting the most out of the Web.
summary
Summary
  • Frames let you have several different HTML documents visible within a single browser window, providing at least the possibility for visually interesting or easy-to-navigate sites.
  • Each frame consists of an individual HTML document.
  • Frames lets you put multiple separate HTML documents on a single web page, each in an individual box.
questions
Questions
  • What are frames?
  • Why would you use frames in your HTML documents?
  • Would you use 3 or 4 frames on your web site? Why or Why not?
  • What other concerns are there using frame? Please Explain
questions36
Questions
  • What types of negative experiences have you had with frames while surfing the net?
  • Can you think of additional “cons” with frames?
  • If frames are so bad, then why are they not being deprecated?
information sources
Information Sources
  • http://www.w3.org/TR/REC-html40/present/frames.html#h-16.1
  • Patrick Carey (2003), New Perspectives on Creating Web Pages with HTML 3rd Edition, Cambridge, MA, Course Technology
  • Creating Web Pages with HTML, 3e, PowerPoint tutorial 5
  • HTML 4 for Dummies
  • http://www.sbrady.com/hotsource/html/frames.html
  • http://webdesign.about.com/cs/framesproscons/index.htm
works cited
Works Cited

Momp’s Web Design. “Frames Tutorial: The Pros & Cons of Frames..!” 2001-2003

Momp’s Web Design.

<http://www.mompswebdesign.com/tutorials/frames2.html>

Owen, Dave. “The Pros & Cons of Using Frames in Web Pages”

Wavelength Media. Media College.

<http://www.mediacollege.com/internet/html/frames/pros-cons.html>