HTML Concepts and Techniques Fourth Edition Project 6 Using Frames in a Web Site.

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

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.
HTML Concepts and Techniques Fourth Edition Project 2 Creating and Editing a Web Page.
© Paradigm Publishing, Inc Access 2010 Level 1 Unit 2Creating Forms and Reports Chapter 6Creating Reports and Mailing Labels.
Project 8 Creating Style Sheets.
Multimedia and the World Wide Web HCI 201 Lecture Notes #5A.
Intermediate Level Course. Text Format The text styles, bold, italics, underlining, superscript and subscript, can be easily added to selected text. Text.
Microsoft Office 2007 PowerPoint Web Feature Creating Web Pages Using PowerPoint.
Web Content Management System Website Maintenance Demonstration Introduction to Macromedia Contribute Jamie Uprichard.
Chapter 3 Tables and Page Layout
Saving a Word Document as a Web Page
Start -> All Programs -> Classes -> Web Expressions -> Dreamweaver.
Create a Web Site with Frames
FIRST COURSE Creating Web Pages with Microsoft Office 2007.
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
Copyright © 2004 ProsoftTraining, All Rights Reserved. Lesson 9: HTML Frames.
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.
Creating Tables in a Web Site.  Define table elements  Describe the steps used to plan, design, and code a table  Create a borderless table to organize.
1 Advanced Frame Options Using NORESIZE  By default, users may resize frames unless you specify the NORESIZE attribute in the tag  Examples:
HTML Concepts and Techniques Fourth Edition Project 3 Creating Web Pages with Links, Images, and Formatted Text.
HTML Comprehensive Concepts and Techniques Third Edition Project 3 Creating Web Pages with Links, Images, and Formatted Text.
Adding an Inline Style Sheet Page without Inline Style Sheet Page with Inline Style Sheet.
HTML Concepts and Techniques Fourth Edition Project 8 Creating Style Sheets.
Creating Tables in a Web Site
Dreamweaver CS4 Concepts and Techniques Chapter 7 Page Layout with Frames.
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.
Web Technologies Website Development Trade & Industrial Education
Website Development with Dreamweaver
Web Design ATBs. ATB #1 List headings and size ATB #2 Define HTML.
HTML: Tables & Frames Internet Technology1. HTML: Tables Table tags ► surround the entire table ► header row (text is boldfaced) ► surround each row ►
WEBiT Adding a new page. 1. View a page like the one you wish to create a. Navigate to a page with a similar layout to the new page you wish to create.
HTML Concepts and Techniques Fourth Edition Project 6 Using Frames in a Web Site.
Microsoft Word 2007 Getting Started. Menus These features below contain many of the functions that were in the menu of previous versions of Word. –The.
CAREER WEB PAGE DESIGN Name. View Rubric for detailed information and grading scale Web Site Criteria.
1 Creating a Second Web Page This section shows you how to create the Huntington Beach Web site.
CSCE 102 – Chapter 6 (Web Design and Layout) CSCE General Applications Programming Benito Mendoza Benito Mendoza 1 By Benito Mendoza.
Microsoft Publisher 2010 Chapter 7 Advanced Formatting and Merging Publications with Data.
1 Planning and Laying Out Frames Sketch the frame structure on paper before writing the HTML code two rows two columns.
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.
HTML Concepts and Techniques Fifth Edition Chapter 6 Using Frames in a Web Site.
Chapter 5 Quick Links Slide 2 Performance Objectives Understanding Framesets and Frames Creating Framesets and Frames Selecting Framesets and Frames Using.
Using Frames in a Website GMU November 12-13, 2004.
1 Creating Links within a Web Page  These links are especially useful on long Web pages  Links at the top of the page point to areas further down the.
1 Creating the Header Page The header frame always displays on the AHS Web site The image (screagle.gif) that will go in the header is contained on the.
HTML Concepts and Techniques Fourth Edition Project 5 Creating an Image Map.
Who Wants to be a Millionaire? LIFELINES 1.50/50 2.Poll the audience 3.Ask Another Student.
Using Frames in a Web Site Project 6. Project Objectives Project 6: Using Frames in a Web Site 2 Define terms related to frames Describe the steps used.
Web Design Part I. Click Menu Site to create a new site root.
Microsoft FrontPage 2003 Illustrated Complete Designing Web Pages with Layout Tables.
HTML Concepts and Techniques Fifth Edition Chapter 4 Creating Tables in a Web Site.
HTML Concepts and Techniques Fifth Edition Chapter 3 Creating Web Pages with Links, Images, and Formatted Text.
Introducing Dreamweaver. Dreamweaver The web development application used to create web pages Part of the Adobe creative suite.
1 Creating the Home Page. 2 Creating a Table Table attributes  Two rows and two columns  No border  Left-aligned Change the vertical alignment of the.
HTML Comprehensive Concepts and Techniques Second Edition Project 2 Creating a Web Site with Links.
1 Creating Links Lesson 2. 2 In the center column type : Home | Order Now | Contact Us This is the navigation button which will link to the other pages.
Web Site Development - Process of planning and creating a website.
Creating Web Pages with Links, Images, and Embedded Style Sheets
XP New Perspectives on Macromedia Dreamweaver MX 2004 Tutorial 5 1 Adding Shared Site Elements.
XP New Perspectives on Creating Web Pages With Word Tutorial 1 1 Creating Web Pages With Word Tutorial 1.
HTML Comprehensive Concepts and Techniques Second Edition Creating Frames on a Web Page.
Creating Web Pages in Word. Sharing Office Files Online Many Web pages are created using the HTML programming language. Web page editors are software.
Creating Frames on a Web Page
Using Frames in a Web Site
Creating Frames on a Web Page
Layout and Design with Tables and Frames
Presentation transcript:

HTML Concepts and Techniques Fourth Edition Project 6 Using Frames in a Web Site

Project 6: Using Frames in a Web Site 2 Project Objectives Design and create a frame structure Change frame scrolling options Name a frame content target Identify Web pages to display at startup Set frame rows Create a header page with text Create a navigation menu page with text links Create a home page

Project 6: Using Frames in a Web Site 3 Creating a Frame Definition File Example: A frameset is used to define the layout of the frames that are displayed

Project 6: Using Frames in a Web Site 4 Creating a Frame Definition File

Project 6: Using Frames in a Web Site 5 Frame Tag Attributes

Project 6: Using Frames in a Web Site 6 Structure of frames home.htm header.htm Menu.htm framedef.htm

Project 6: Using Frames in a Web Site 7 Start framedef.htm file <!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Frameset// EN " Bill Thomas Illustrations

Project 6: Using Frames in a Web Site 8 Start framedef.htm file Note that there is no

Project 6: Using Frames in a Web Site 9 Defining Columns and Rows in the Frameset <!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Frameset// EN " Bill Thomas Illustrations

Project 6: Using Frames in a Web Site 10 Specifying Attributes of the Header and Menu Frames (rows)

Project 6: Using Frames in a Web Site 11 Specifying Attributes of the Header and Menu Frames (rows) What if frameborder = “yes”? What if scrolling = “yes”?

Project 6: Using Frames in a Web Site 12 Ending the frameset of the first column

Project 6: Using Frames in a Web Site 13 Specifying Attributes of the Main Frame

Project 6: Using Frames in a Web Site 14 Ending the Framesets

Project 6: Using Frames in a Web Site 15 Creating the Header Page-header.htm <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" " Bill Thomas Illustrations

Project 6: Using Frames in a Web Site 16 Creating the Menu Page-menu.htm <!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Frameset// EN " Bill Thomas Illustrations

Project 6: Using Frames in a Web Site 17 Insert the body with options <!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Frameset// EN " Bill Thomas Illustrations

Project 6: Using Frames in a Web Site 18 Add the tables Cross Hatch Full Color Ink Wash Order Form

Project 6: Using Frames in a Web Site 19 Add link questions and comments to

Project 6: Using Frames in a Web Site 20 Create the home.htm Insert an image (see the file)

Project 6: Using Frames in a Web Site 21 Viewing and Printing the Frame Definition File Using a Browser Start your browser Click File on the menu bar and then click Print on the File menu Click the Options tab in the Print dialog box Click As laid out on screen to select it and then click the Print button

Project 6: Using Frames in a Web Site 22 Viewing and Printing the Frame Definition File Using a Browser

Project 6: Using Frames in a Web Site 23 Testing the Links Click the Cross Hatch link on the navigation menu Click the Full Color link on the navigation menu Click the Ink Wash link on the navigation menu

HTML Concepts and Techniques Fourth Edition Project 6 Complete Using Frames in a Web Site