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

Slides:



Advertisements
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.
Advertisements

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.
Create a Web Site 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.
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.
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 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.
HTML BASICS Creating Web Pages with HTML CIS 133 Web Programming Concepts 1.
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.
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)
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.
XHTML. Introduction to XHTML What Is XHTML? – XHTML stands for EXtensible HyperText Markup Language – XHTML is almost identical to HTML 4.01 – XHTML is.
HTML: Tables & Frames Internet Technology1. HTML: Tables Table tags ► surround the entire table ► header row (text is boldfaced) ► surround each row ►
The Web Wizard’s Guide to HTML Chapter Seven Frames.
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.
1 Web Developer & Design Foundations with XHTML Chapter 3 Key Concepts.
HTML Structure & syntax. Introduction This presentation introduces the following: Doctype declaration HTML Tags, Elements and Attributes Sections of a.
1 HTML Frames
1 Web Developer Foundations: Using XHTML Chapter 5 Key Concepts.
Lesson 4.
Introduction to Programming the WWW I CMSC Winter 2003 Lecture 6.
Web111a_chapt05.ppt HTM: Section 5 Frames A section of the browser window capable of displaying an entire web page Display multiple web pages on the screen.
META tag META tag is the element in the HTML that interacts with the search engines. It’s contain 2 attributes that should always be used: NAME: is an.
Jozef Goetz, © 2011 Pearson Education Copyright (c) 2007Prentice-Hall. All rights reserved.
The Web Wizard’s Guide to HTML Chapter Seven Frames.
Using Frames in a Website GMU November 12-13, 2004.
HTML B OOT C AMP Chapter 11 Frames Kirkwood Continuing Education © Copyright 2015, Fred McClurg All Rights Reserved.
HTML: Tables & Frames Internet Technology.
HTML Hypertext Markup Language. WORKING WITH FRAMES.
Tutorial 8 Designing a Web Site with Frames. 2New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition Objectives Explore the uses of frames.
Web Development & Design Foundations with XHTML Chapter 2 HTML/XHTML Basics.
HTML Frames.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 7 Key Concepts 1 Copyright © Terry Felke-Morris.
Introduction to Web Site Development John Hurley Department of Computer Science California State University, Los Angeles Lecture 4: Favicons Tables and.
XP Review 1 New Perspectives on JavaScript, Comprehensive1 Introducing HTML and XHTML Creating Web Pages with HTML.
Frames. Dividing a page, called frameset, into frames, allow the visitor to see more than one page at a time Each frame contains its own Web page, and.
INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn.
1 HTML Frames
Microsoft FrontPage 2003 Illustrated Complete Creating a Frames Page.
Web Technology (NCS-504) Prepared By Mr. Abhishek Kesharwani Assistant Professor,UCER Naini,Allahabad.
INT222 – Internet Fundamentals
Site Development Foundations © 2004 ProsoftTraining All rights reserved.
Iframe.
Jozef Goetz, © 2011 Pearson Education Copyright (c) 2007Prentice-Hall. All rights reserved.
HTML And the Internet. HTML and the Internet ► HTML: HyperText Markup Language  Language in which all pages on the web are written  Not Really a Programming.
XHTML Introductory1 Frames Chapter 5. XHTML Introductory2 Objectives In this chapter, you will: Work with the Frameset Document Type Definition (DTD)
HTML Tables Tables are defined with the tag. A table is divided into rows (with the tag), and each row is divided into data cells (with the tag). td stands.
HTML Comprehensive Concepts and Techniques Second Edition Creating Frames on a Web Page.
© 2016 Pearson Education, Inc., Hoboken, NJ. All rights reserved.
What is XHTML? XHTML stands for Extensible Hypertext Markup Language
Tutorial 8 Designing a Web Site with Frames
Designing a Web Site with Frames
Client-Side Internet and Web Programming
Table of Contents Creating Frames Frameset Tag and its attributes
XHTML
Table of Contents Creating Frames Frameset Tag and its attributes
Table of Contents Creating Frames Frameset Tag and its attributes
Tutorial 8 Designing a Web Site with Frames
HTML Basic Structure.
XHTML 7-May-19.
XHTML 29-May-19.
Presentation transcript:

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 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 TM TM TM TM

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 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 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 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 Sample Frameset DTD & header <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" " frameset.dtd"> <head> Sample Frameset Sample Frameset </head>

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

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

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

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 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 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 XHTML tag Attributes Attributes alignalign frameborderframeborder heightheight idid longdesclongdesc marginheightmarginheight marginwidthmarginwidth namename scrollingscrolling srcsrc titletitle widthwidth

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