XHTML1 Topics Work with the Frameset Document Type Definition (DTD) Create frames Use the target and base attributes Create nested frames Format frames.

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

Intro to HTML Basics HTML = Hypertext Mark-up Language HTML = Hypertext Mark-up Language HTML is a plain-text file that can be created using a text editor.
Frames How to make a page that uses frames. Preview There used to be a time that frames were frowned upon because most browsers did not support them Nowadays.
Frames.
Multimedia and the World Wide Web HCI 201 Lecture Notes #5A.
Web-based Application Development Lecture 9 February 7, 2006 Anita Raja.
COS 125 Day 25. Agenda  Assignment #7 Due  Final capstone progress report due next class  Assignment #8 Posted Due April 25 One more to go  Exam #5.
Frames 1 Lecture HTML: Frames and Miscellaneous Tags.
XP 1 Designing a Web Site with Frames Using Frames to Display Multiple Web Pages Tutorial 5.
XHTML1 Tables and Lists. XHTML2 Objectives In this chapter, you will: Create basic tables Structure tables Format tables Create lists.
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.
The Power of Tables They aren't just for sitting stuff on anymore...
Create a Web Site with Frames
Web Technologies Lecture # 5 : HTML Frames. Objectives n Create/control appearance & placement of frames n Control the behavior of hyperlinks on pages.
Copyright © 2004 ProsoftTraining, All Rights Reserved. Lesson 9: Frames © 2007 Prosoft Learning Corporation All rights reserved ITD 110 Web Page Design.
Chapter 6 Working with Frames.
Lesson 4 HTML Structural Design Techniques
 You've probably come into contact with web sites in which the browser window seemingly allowed you to move around between several different pages. 
Copyright © 2004 ProsoftTraining, All Rights Reserved. Lesson 9: HTML Frames.
Frameset. FrameSet With frames, we can display more than one HTML document in the same browser window. Each HTML document is called a frame, and each.
Using Frames in a Web Site
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.
WHAT are frames? what.html are.htmlframes.html. Intro to Frames HTML frames allow you to display more than 1 HTML document in the same 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.
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.
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.
HTML: Tables & Frames Internet Technology1. HTML: Tables Table tags ► surround the entire table ► header row (text is boldfaced) ► surround each row ►
Frame Page A Frame Page does the following: –Defines the size of each frame. –Defines how the window will be broken up – rows or columns. –Specifies which.
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.
Chapter 12 FRAMES. HOW FRAMES WORK When you view a framed page in a browser, you are actually looking at several HTML documents at once. The key to making.
Copyright (c) 2004 Prentice-Hall. All rights reserved. 1 Committed to Shaping the Next Generation of IT Experts. Project 7: Working with Frames Kelly L.
Working with HTML Frames The Good, The Bad & The Ugly.
Chapter 2 XHTML: Part II The Web Warrior Guide to Web Design Technologies.
CSCE 102 – Chapter 6 (Web Design and Layout) CSCE General Applications Programming Benito Mendoza Benito Mendoza 1 By Benito Mendoza.
Week 11 Creating Framed Layouts Objectives Understand the benefits and drawbacks of frames Understand and use frame syntax Customize frame characteristics.
1 Planning and Laying Out Frames Sketch the frame structure on paper before writing the HTML code two rows two columns.
1 Web Developer Foundations: Using XHTML Chapter 5 Key Concepts.
Kingdom of Saudi Arabia Ministry of Higher Education Al-Imam Muhammad Ibn Saud Islamic University College of Computer and Information Sciences Chapter.
Chapter 8 HTML Frames. 2 Principles of Web Design Chapter 8 Objectives Understand the benefits and drawbacks of frames Understand and use frames syntax.
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.
Jozef Goetz, © 2011 Pearson Education Copyright (c) 2007Prentice-Hall. All rights reserved.
Chapter 5: Windows and 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.
1 HTML Frames
HTML Frames.
© Marty Hall, Larry Brown Web core programming 1 HTML Frames.
Week 9: HTML Tables and Frames HNDIT11062 – Web Development.
HTML Frames. Advantages to Using Frames n flexibility in design n information in different Web pages n remove redundancy. n site easier to manage. n update.
20-753: Fundamentals of Web Programming 1 Lecture 6: Advanced HTML Fundamentals of Web Programming Lecture 6: Advanced HTML.
CSCI N241: Fundamentals of Web Design Copyright ©2004  Department of Computer & Information Science Working with Frames.
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
Web Technology (NCS-504) Prepared By Mr. Abhishek Kesharwani Assistant Professor,UCER Naini,Allahabad.
Site Development Foundations © 2004 ProsoftTraining All rights reserved.
XP New Perspectives on Macromedia Dreamweaver MX 2004 Tutorial 5 1 Adding Shared Site Elements.
Jozef Goetz, © 2011 Pearson Education Copyright (c) 2007Prentice-Hall. All rights reserved.
XHTML Introductory1 Frames Chapter 5. XHTML Introductory2 Objectives In this chapter, you will: Work with the Frameset Document Type Definition (DTD)
HTML Comprehensive Concepts and Techniques Second Edition Creating Frames on a Web Page.
Introduction to HTML.
HTML Structure II (Frame)
FRAMES.
The Web Warrior Guide to Web Design Technologies
Tutorial 8 Designing a Web Site with Frames
Client-Side Internet and Web Programming
Tutorial 8 Designing a Web Site with Frames
HTML Frames
Creating Frames on a Web Page
Presentation transcript:

XHTML1 Topics Work with the Frameset Document Type Definition (DTD) Create frames Use the target and base attributes Create nested frames Format frames Use the element Create inline frames

XHTML2 Frames must be defined in a separate document from other HTML code Because of the many problems and complaints associated with frames, they are deprecated in XHTML in favor of tables If frames are deprecated, then why study them at all? The Frameset DTD

XHTML3 You study frames primarily because they are so widely used and will more likely continue to be widely used for some time Because frames are so common, the W3C created the Frameset DTD to allow Web page authors to create frames in well-formed documents until the Web completely switches to XML-based Web sites using the Strict DTD The Frameset DTD

XHTML4 Creating Frames Using frames, you can split a single Web page into multiple windows, each of which can open a different document Frames are independent, scrollable portions of a Web browser window, with each frame capable of displaying a different document

XHTML5 Creating Frames

XHTML6 Creating Frames You divide a document into frames using the element The element and other elements are the only items that you can place inside a element The element replaces the element that is used in non-frame documents You can create frames in a document in horizontal rows, vertical columns, or both

XHTML7 Creating Frames Two attributes of the element, rows and cols, determine whether frames are created as rows or columns –The rows attribute determines the number of horizontal frames to create –The cols attribute determines the number of vertical frames to create

XHTML8 Creating Frames

XHTML9 Creating Frames It is helpful to use an asterisk (*) in your document to represent the size of frames that do not require an exact number of pixels or exact window percentage The asterisk allocates any remaining screen space to an individual frame You can use combinations of pixels, percentages, and the asterisk to create frames The element creates the initial frames within a document

XHTML10 Creating Frames You use the empty element to specify options for individual frames The src attribute of the element specifies the document to be opened in an individual frame

XHTML11 Creating Frames

XHTML12 Using the target and base Attributes One popular use of frames creates a table of contents frame on the left side of a Web browser window with a display frame on the right side

XHTML13 Using the target and base Attributes

XHTML14 Using the target and base Attributes The target attribute determines in which frame or Web browser window a document opens When you are using the same target window or frame for a long list of hyperlinks, it is easier to use the target attribute in the element instead of repeating the target attribute within each hyperlink You use the target attribute with the element to specify a default target for all links in a document, using the assigned name of a window or frame

XHTML15 Nesting Frames Each individual frame within a window can contain its own set of frames You accomplish this nesting by including a element inside another element Frames that are contained within other frames are called nested frames In Figure 5-9, the first element creates the four parent frames in the window

XHTML16 Nested Frames

XHTML17 Frame Formatting

XHTML18 The frameborder Attribute One other attribute you should understand is the frameborder attribute, which specifies whether to display a border around the frame You assign to the frameborder attribute a value of “1” to display a border and a value of “0” to suppress the border

XHTML19 The frameborder Attribute To completely suppress a border between two frames in Internet Explorer, you must include the framespacing attribute and assign to it a value of zero The framespacing attribute determines the amount of space between frames in Internet Explorer The framespacing attribute is proprietary to Internet Explorer

XHTML20 The longdesc Attribute For accessibility, you should include the longdesc attribute in your elements and assign to it the URL of a Web page containing a long description of the frame The inclusion of the longdesc attribute is especially important for a frame that displays image, video, or other types of multimedia as its contents You should use the longdesc attribute in a element in addition to a title attribute

XHTML21 The marginheight and marginwidth Attribute The marginheight and marginwidth attributes determine the margins of the frame in pixels Figure 5-13 shows the Beowulf Web page from Figure 5-12 after the attributes marginheight= “50” and marginwidth=“50” have been added to the element for the middle frame

XHTML22 The marginheight and marginwidth Attribute

XHTML23 The noresize Attribute The Boolean noresize attribute disables the user’s ability to resize an individual frame Normally, users can adjust the size of frames to suit their own purposes You use the noresize attribute when you want to add a title that should always be visible in a frame or on a Web page To disable resizing of a frame, add the noresize attribute to the element and assign to it a value of “noresize” using the following statement: noresize=“noresize”

XHTML24 The scrolling Attribute By default, a Web browser automatically adds scroll bars to a frame when the contents of the frame are larger than the visible area You can disable a frame’s scroll bars using the scrolling attribute The scrolling attribute can take one of three values; yes, no, and auto

XHTML25 The scrolling Attribute A value of yes always turns on the scroll bars, even when the contents of a frame fit within the visible area A value of no completely disables a frame’s scroll bars, even when the contents of a frame do not fit within the visible area Auto turns the scroll bars on and off, depending on the visibility of the contents within a frame

XHTML26 The Element The element displays a message to users of Web browsers that are not capable of displaying frames For your frameset document to be well formed, you must place the element within a element The element must also include a element in order to be well formed The element usually precedes the last element

XHTML27 Inline Frames You can insert an inline frame into a non-frame document using the element The element creates an inline frame that displays another document within the body of the current document You use an inline frame when you want to display another document within the current document, but you do not need to divide the Web browser into multiple frames

XHTML28 Element Attributes

XHTML29 Inline Frames You can create inline frames using either an empty element or by using an … tag pair If you use an … tag pair, then you should include as its content a message to users of Web browsers that are not capable of displaying frames, the same as with the element