Presentation is loading. Please wait.

Presentation is loading. Please wait.

1Frames Recognize a web page that uses a frameRecognize a web page that uses a frame Identify advantages and disadvantages of using framesIdentify advantages.

Published by Modified over 9 years ago

Similar presentations

Presentation on theme: "1Frames Recognize a web page that uses a frameRecognize a web page that uses a frame Identify advantages and disadvantages of using framesIdentify advantages."— Presentation transcript:

1 1Frames Recognize a web page that uses a frameRecognize a web page that uses a frame Identify advantages and disadvantages of using framesIdentify advantages and disadvantages of using frames Be aware of web accessibility issues when using framesBe aware of web accessibility issues when using frames Use the and tags to create a framesetUse the and tags to create a frameset Use the tag to display content when frames are not supportedUse the tag to display content when frames are not supported Create hyperlinks that target framesCreate hyperlinks that target frames Use the tag to create an inline frameUse the tag to create an inline frame

2 2 Overview of Frames Frames allow the use of multiple, independently controllable sections in a browser window. Frames allow the use of multiple, independently controllable sections in a browser window. Each section is called a "frame" and is created as a separate XHTML file. Each section is called a "frame" and is created as a separate XHTML file. Behind the scenes there is another file -- a "master" frameset file that controls the configuration of the entire browser window. Behind the scenes there is another file -- a "master" frameset file that controls the configuration of the entire browser window. http://www.webgrrls.com http://www.webgrrls.com http://www.webgrrls.com http://www.panynj.gov/aviation/jfkframe.H TM http://www.panynj.gov/aviation/jfkframe.H TM http://www.panynj.gov/aviation/jfkframe.H TM http://www.panynj.gov/aviation/jfkframe.H TM

3 3 Possible advantages of Using Frames Ease of Navigation Ease of Navigation Ease of Maintenance Ease of Maintenance Degrades Gracefully Degrades Gracefully Unifies Resources Unifies Resources

4 4 Disadvantages of Using Frames Not Universally Supported Not Universally Supported Not in future W3C Recommendations Not in future W3C Recommendations Bookmark Issues Bookmark Issues Accessibility Issues Accessibility Issues DON’T use unless really need capabilities!

5 5 Questions 1. List three disadvantages of designing a web site with frames. Which disadvantage seems most important to you? Why? 1. List three disadvantages of designing a web site with frames. Which disadvantage seems most important to you? Why? 2. How would you respond to a person who claims that you should never design a web site using frames? Explain. 2. How would you respond to a person who claims that you should never design a web site using frames? Explain. 3. True or False. A web site created using frames is more accessible than a web site that does not use frames. 3. True or False. A web site created using frames is more accessible than a web site that does not use frames.

6 6 XHTML Using Frames tag tag Used to divide up the browser windowUsed to divide up the browser window Container tagContainer tag tag tag Used to configure a single frame or portion of the browser windowUsed to configure a single frame or portion of the browser window Stand alone tagStand alone tag tag tag Used to configure content that should display if the browser does not support framesUsed to configure content that should display if the browser does not support frames Container tagContainer tag

7 7 Sample Frameset DTD & header <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- frameset.dtd"> <head> Sample Frameset Sample Frameset </head>

8 8 CircleSoft Web Design CircleSoft Web Design Site Links Site Links </frameset></html> Sample Frameset XHTML

9 9 XHTML tag The frameset tag The frameset tag Attributes: Attributes: bordercolorbordercolor colscols frameborderframeborder framespacingframespacing rowsrows titletitle

10 10 XHTML tag The frame tag The frame tag Attributes: Attributes: bordercolorbordercolor frameborderframeborder idid longdesclongdesc marginheightmarginheight marginwidthmarginwidth namename noresizenoresize scrollingscrolling srcsrc targettarget titletitle

11 11 XHTML tag The base tag The base tag Used to configure the default target for all the links on an entire web page Used to configure the default target for all the links on an entire web page Stand alone tag Stand alone tag Coded in the header section Coded in the header section

12 12 Inline Frames Also called floating frame Also called floating frame Can be placed in the body of a web page Can be placed in the body of a web page

13 13 XHTML tag The iframe tag The iframe tag Description of the lovely Spring wild flower, the Trillium Description of the lovely Spring wild flower, the Trillium Used to configure the default target for all the links on an entire web page Used to configure the default target for all the links on an entire web page Container tag Container tag

14 14 XHTML tag Attributes Attributes alignalign frameborderframeborder heightheight idid longdesclongdesc marginheightmarginheight marginwidthmarginwidth namename scrollingscrolling srcsrc titletitle widthwidth

15 15 Questions 1. Describe the uses of the area contained between the opening and closing tags. 1. Describe the uses of the area contained between the opening and closing tags. 2. You have created a frameset but the links in the navigation frame do not open in the frame you designed to hold the content. What might be the reason? How would you correct this? 2. You have created a frameset but the links in the navigation frame do not open in the frame you designed to hold the content. What might be the reason? How would you correct this? 3. Describe how the title attribute can be used on a tag to 3. Describe how the title attribute can be used on a tag to

Download ppt "1Frames Recognize a web page that uses a frameRecognize a web page that uses a frame Identify advantages and disadvantages of using framesIdentify advantages."

Similar presentations

Frames. What are frames? The ability to divide the browser window into sections that can function independently of one another. Navigation within the.

Frames. What are frames? The ability to divide the browser window into sections that can function independently of one another. Navigation within the.
XP 1 Designing a Web Site with Frames Using Frames to Display Multiple Web Pages Tutorial 5.

XP 1 Designing a Web Site with Frames Using Frames to Display Multiple Web Pages Tutorial 5.
Tutorial 8 Designing a Web Site with Frames. XP Objectives Explore the uses of frames in a Web site Create a frameset consisting of rows and columns of.

Tutorial 8 Designing a Web Site with Frames. XP Objectives Explore the uses of frames in a Web site Create a frameset consisting of rows and columns of.
Create a Web Site with Frames

Create a Web Site with Frames
Chapter 6 Working with Frames.

Chapter 6 Working with Frames.
XP Tutorial 5New Perspectives on HTML, XHTML, and DHTML, Comprehensive 1 Designing a Web Site with Frames Using Frames to Display Multiple Web Pages Tutorial.

XP Tutorial 5New Perspectives on HTML, XHTML, and DHTML, Comprehensive 1 Designing a Web Site with Frames Using Frames to Display Multiple Web Pages Tutorial.
XHTML1 Topics Work with the Frameset Document Type Definition (DTD) Create frames Use the target and base attributes Create nested frames Format frames.

XHTML1 Topics Work with the Frameset Document Type Definition (DTD) Create frames Use the target and base attributes Create nested frames Format frames.
Basics of HTML Shashanka Rao. Learning Objectives 1. HTML Overview 2. Head, Body, Title and Meta Elements 3.Heading, Paragraph Elements and Special Characters.

Basics of HTML Shashanka Rao. Learning Objectives 1. HTML Overview 2. Head, Body, Title and Meta Elements 3.Heading, Paragraph Elements and Special Characters.
1 Advanced Frame Options Using NORESIZE  By default, users may resize frames unless you specify the NORESIZE attribute in the tag  Examples:

1 Advanced Frame Options Using NORESIZE  By default, users may resize frames unless you specify the NORESIZE attribute in the tag  Examples:
XP 1 Tutorial 5 Using Frames in a Web Site. XP 2 Tutorial Objectives  Describe the uses of frames in a Web site  Lay out frames within a browser window.

XP 1 Tutorial 5 Using Frames in a Web Site. XP 2 Tutorial Objectives  Describe the uses of frames in a Web site  Lay out frames within a browser window.
XP Using Frames in a Web Site Ali Alfayly. XP Tutorial Objectives Create frames for a Web site Control the appearance and placement of frames Control.

XP Using Frames in a Web Site Ali Alfayly. XP Tutorial Objectives Create frames for a Web site Control the appearance and placement of frames Control.
FRAMES. With frames, we can display more than one HTML document in the same browser window. Each HTML document is called the same browser window. Each.

FRAMES. With frames, we can display more than one HTML document in the same browser window. Each HTML document is called the same browser window. Each.
HTML BASICS Creating Web Pages with HTML CIS 133 Web Programming Concepts 1.

HTML BASICS Creating Web Pages with HTML CIS 133 Web Programming Concepts 1.
1 Web Developer & Design Foundations with XHTML Chapter 5 Key Concepts.

1 Web Developer & Design Foundations with XHTML Chapter 5 Key Concepts.
CIS67 Foundations for Creating Web Pages Professor Al Fichera Reference for CIS127 and CIS 137.

CIS67 Foundations for Creating Web Pages Professor Al Fichera Reference for CIS127 and CIS 137.
Chapter 1 XHTML: Part I The Web Warrior Guide to Web Design Technologies.

Chapter 1 XHTML: Part I The Web Warrior Guide to Web Design Technologies.
XHTML1 Building Document Structure Chapter 2. XHTML2 Objectives In this chapter, you will: Learn how to create Extensible Hypertext Markup Language (XHTML)

XHTML1 Building Document Structure Chapter 2. XHTML2 Objectives In this chapter, you will: Learn how to create Extensible Hypertext Markup Language (XHTML)
Introduction. Document Structure Overview  XML declaration (prolog)  Document type declaration  Root element (namespace)  Document header  Document.

Introduction. Document Structure Overview  XML declaration (prolog)  Document type declaration  Root element (namespace)  Document header  Document.
Chapter 2 HTML Basics Key Concepts Copyright © 2013 Terry Ann Morris, Ed.D 1.

Chapter 2 HTML Basics Key Concepts Copyright © 2013 Terry Ann Morris, Ed.D 1.
XHTML. Introduction to XHTML What Is XHTML? – XHTML stands for EXtensible HyperText Markup Language – XHTML is almost identical to HTML 4.01 – XHTML is.

XHTML. Introduction to XHTML What Is XHTML? – XHTML stands for EXtensible HyperText Markup Language – XHTML is almost identical to HTML 4.01 – XHTML is.

Similar presentations

Ads by Google