Upgrading to XHTML DECO 3001 Tutorial 1 – Part 2 Presented by Ji Soo Yoon 19 February 2004 Slides adopted from

Slides:



Advertisements
Similar presentations
CSCI N241: Fundamentals of Web Design Copyright ©2004 Department of Computer & Information Science Introducing XHTML: Module B: HTML to XHTML.
Advertisements

Dr. Alexandra I. Cristea XHTML.
Elder L. Lionel Kendrick Of the First Quorum of the Seventy It has been from the beginning and it will be till the end that the natural man will have a.
Introducing XHTML: Module C: Document Structure. Goals Understand how to use DTDsUnderstand how to use DTDs Understand the importance of backward compatibilityUnderstand.
1 HTML Standards & Compliance. 2 Minimum Required HTML tags: (must go in this order!)
1. Content – Collective term for all text, images, videos, etc. that you want to deliver to your audience. 2. Structure – How the content is placed on.
HTML/XML XHTML Authoring. Creating Tables  Table: An arrangement of horizontal rows and vertical columns. The intersection of a row and a column is called.
 Fundamentals of Web Design.  Describe the history and theory of XHTML  Understand the rules for creating valid XHTML documents  Apply a DTD to an.
Pengantar Teknologi Mobile 13 Antonius Rachmat C, S.Kom, M.Cs XHTML.
Copyright © 2004 ProsoftTraining, All Rights Reserved. Lesson 3: XHTML Coding © 2007 Prosoft Learning Corporation All rights reserved ITD 110 Web Page.
History Leading to XHTML
HTML5 and CSS3 Illustrated Unit B: Getting Started with HTML
Tutorial 9 Working with XHTML
XHTML 16-Apr-17.
XHTML1 Building Document Structure. XHTML2 Objectives In this chapter, you will: Learn how to create Extensible Hypertext Markup Language (XHTML) documents.
XHTML. XHTML is one of the many XML-based languages that have been defined XHTML is, essentially, a “cleaned-up” version of HTML 4, reformulated using.
17-Jun-15 XHTML 2 What is XHTML? XHTML stands for Extensible Hypertext Markup Language XHTML is aimed to replace HTML.
Unit 2, cont. September 14 HTML,Validating your pages, Publishing your site.
Tutorial 9 Working with XHTML. XP Objectives Describe the history and theory of XHTML Understand the rules for creating valid XHTML documents Apply a.
Creating a Well-Formed Valid Document. 2 Objectives Introducing XHTML Creating a Well-Formed Document Creating a Valid Document Creating an XHTML Document.
Upgrading to XHTML DECO 3001 Tutorial 1 – Part 1 Presented by Ji Soo Yoon 19 February 2004 Slides adopted from
Introducing XHTML: Module B: HTML to XHTML. Goals Understand how XHTML evolved as a language for Web delivery Understand the importance of DTDs Understand.
Introducing HTML & XHTML:. Goals  Understand hyperlinking  Understand how tags are formed and used.  Understand HTML as a markup language  Understand.
Creating a Basic Web Page
Working with XHTML Creating a Well-Formed Valid Document.
XP Tutorial 9New Perspectives on Creating Web Pages with HTML, XHTML, and XML 1 Working with XHTML Creating a Well-Formed Valid Document Tutorial 9.
XP The University of Akron Summit College Business Technology Department Computer Information Systems 2440: 140 Internet Tools Instructor: Enoch E. Damson.
 XHTML is aimed to replace HTML  XHTML is almost identical to HTML 4.01  XHTML is a stricter and cleaner version of HTML  XHTML is HTML defined as.
Chapter 1 Understanding the Web Design Environment Principles of Web Design, 4 th Edition.
Week 1 Understanding the Web Design Environment. 1-2 HTML: Then and Now HTML is an application of the Standard Generalized Markup Language Intended to.
1 © Netskills Quality Internet Training, University of Newcastle Introducing XML © Netskills, Quality Internet Training University.
CS134 Web Design & Development Creating a Basic Web Page Mehmud Abliz.
Chapter 1 XHTML: Part I The Web Warrior Guide to Web Design Technologies.
1 HTML intro The development of HTMLThe development of HTML The transition from HTML to XHTMLThe transition from HTML to XHTML XHTML syntax, tags, and.
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.
3 XHTML.
1 HTML XHTML. 2 Understand the Doctype tag Know the html tags which are now classed as depreciated Understand how Dreamweaver adds styles Add styles to.
1 XHTML محمد احمدی نیا 2 Of 19 HTML vs XHTML  XHTML is a stricter and cleaner version of HTML.  by combining the strengths of HTML.
XHTML Web and Database Management System. HTML’s History HTML was initially defined by Tim-Berners-Lee in 1990 at CERN (European Organization for Nuclear.
1 Web Developer Foundations: Using XHTML Chapter 2 Key Concepts.
XHTML. Introduction to XHTML What Is XHTML? – XHTML stands for EXtensible HyperText Markup Language – XHTML is almost identical to HTML 4.01 – XHTML is.
CIS 1315 – Web Development for Educators CIS 1315 HTML Tutorial 9: Working With XHTML.
XP Tutorial 9 1 Working with XHTML. XP SGML 2 Standard Generalized Markup Language (SGML) A standard for specifying markup languages. Large, complex standard.
Chapter 1 Understanding the Web Design Environment Principles of Web Design, 4 th Edition.
Lesson 4.
Copyright (c) 2004 Prentice-Hall. All rights reserved. 1 Committed to Shaping the Next Generation of IT Experts. Creating XHTML Documents Essentials for.
Fundamentals of Web Design Copyright ©2004  Department of Computer & Information Science Introducing XHTML: Module C: Document Structure.
Web Development & Design Foundations with XHTML Chapter 2 HTML/XHTML Basics.
Lecture: Web Design Assis. Prof. Freshta Hanif Ehsan Faculty of Computer Science Kabul Polytechnic University Spring Semester
Copyright © 2003 Pearson Education, Inc. Slide 1-1 Created by Cheryl M. Hughes The Web Wizard’s Guide to XHTML by Cheryl M. Hughes.
XP Tutorial 9New Perspectives on HTML and XHTML, Comprehensive 1 Working with XHTML Creating a Well-Formed Valid Document Tutorial 9.
XP Review 1 New Perspectives on JavaScript, Comprehensive1 Introducing HTML and XHTML Creating Web Pages with HTML.
Tutorial 9 Working with XHTML. New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition 2 Objectives Describe the history and theory of XHTML.
Tutorial 9 Working with XHTML. XP Objectives Describe the history and theory of XHTML Understand the rules for creating valid XHTML documents Apply a.
XHTML1 Building Document Structure N100 Building a Simple Web Page.
HTML5 and CSS3 Illustrated Unit B: Getting Started with HTML.
What is XHTML? XHTML stands for Extensible Hypertext Markup Language
Creating a Well-Formed Valid Document
CITA 330 Section 3 XHTML.
Tutorial 9 Working with XHTML
Tutorial 9 Working with XHTML
XHTML
Introducing HTML & XHTML:
Tutorial 9 Working with XHTML
XHTML 7-May-19.
XHTML 29-May-19.
محمد احمدی نیا XHTML محمد احمدی نیا
HTML5 and CSS3 Illustrated Unit B: Getting Started with HTML
Presentation transcript:

Upgrading to XHTML DECO 3001 Tutorial 1 – Part 2 Presented by Ji Soo Yoon 19 February 2004 Slides adopted from and Beginning XHTML ©2000 Wrox Presshttp://faculty.northseattle.edu/jkent/it111/lecture_notes.html

This is accomplished through the use of three DTDs: Transitional, Frameset, and Strict Even though the XHTML DTDs are an improvement over HTML, they may still be too large for many types of user agents such as PDAs or mobile phones Many of the elements found in XHTML 1.0, such as graphics, tables, and frames, may not be useable on many user agents Creating XHTML Documents

Document Type Definition (DTD) The World Wide Web Consortium (W3C) created XHTML to make the transition to XML-based Web pages easier To facilitate the transition, the W3C provided three types of XHTML DTDs: Transitional, Frameset, and Strict

XHTML DTDs W3C Recommendation: Use a Document Type Definition to identify the type of markup language used in a web page XHTML 1.0 Strict  May be considered to be the ‘core’ XHTML DTD  Use this when you want really clean markup, free of presentational clutter  Use this together with Cascading Style Sheets  Use this whenever possible XTML 1.0 Transitional  Contains everything that is within the Strict DTD plus some additional tags and attributes  Likely to be phased out in future versions of XHTML  This is the least strict specification for XHTML 1.0  Use this when you need to take advantage of HTML's presentational features  Use this when you want to support browsers that don't understand Cascading Style Sheets XHTML 1.0 Frameset  Contains everything that is within the Strict DTD plus some additional tags and attributes  Likely to be phased out in future versions of XHTML  Use this when you want to use HTML Frames to partition the browser window into two or more frames

Strict DTD The Strict DTD eliminates the elements that were deprecated in the Transitional DTD and Frameset DTD

Transitional DTD Elements and attributes that are considered to be obsolete and that will eventually be eliminated are said to be deprecated. The Transitional DTD allows you to continue using deprecated elements along with the well-formed document requirements of XML.

Transitional DTD

Frameset DTD The Frameset DTD is identical to the transitional DTD, except that it includes the and elements Allows you to split the browser window into two or more frames, which are independent, scrollable portions of a Web browser window, with each frame capable of displaying a separate URL

DOCTYPE All documents begin with a declaration  The declaration states the XHTML version of the document and the XHTML DTD (Transitional, Frameset, or Strict) with which the document complies Modern browsers are aware of the and will examine it to determine what rendering mode to enter (standards vs. quirk) Using the declaration allows validation software to identify the DTD being followed in a document, and verify that the document is syntactically correct  all tags used are part of a particular specification and are being used correctly

The Declaration XHTML VersionDOCTYPE XTHML 1.0 Strict XHTML 1.0 Transitional XHTML 1.0 Frameset XHTML 1.1 XHTML 2.0 (still in progress)

XHTML Version Summary XHTML VersionDescription XTHML 1.0 StrictA reformulation of HTML 4.0 strict using XML. This language is rule enforcing and leaves all presentation duties to technologies such as Cascading Style Sheets (CSS). XHTML 1.0 TransitionalA reformulation of HTML as an XML application. The transitional form preserves many of the basic presentation features of HTML 4.0 transitional but applies the strict syntax rules of XML to HTML. XHTML 1.1A minor change to XHTML 1.0 that restructures the definition of XHTML 1.0 to modularize it for easy extension. It is not commonly used at the time of this writing and offers minor gains over XHTML 1.0. XHTML 2.0 (still in progress) A new implementation of XHTML circa 2003 that may not provide backward compatibility with XHTML 1.0 and traditional HTML. XHTML 2 will likely remove most or all presentational tags left in HTML and will introduce even more logical ideas to the language.

XHTML Elements and Attributes The data contained within an element’s opening and closing tags is referred to as its content You must close empty elements by adding a space and a slash before the tag’s closing bracket

Block-Level and Inline Elements Two basic types of elements can appear within a document’s element: block-level and inline  Block-level elements are elements that give a Web page its structure  Inline, or text-level, elements describe the text that appears on a Web page Unlike block-level elements, inline elements do not appear on their own lines; they appear within the line of the block-level element that contains them

Block-Level Inline Elements 2

Standard Attributes You place attributes before the closing bracket of the starting tag, and you separate them from the tag name or other attributes with a space Many XHTML attributes are unique to a specific element or can only be used with certain types of elements XHTML also includes several standard, or common, attributes that are available to almost every element, with a few exceptions

Standard Attributes 2

Standard Attributes 3 In order to be a considerate resident of the international world of the Web, you should designate the language of your elements using the lang and xml:lang attributes The lang attribute is used in HTML documents, whereas the xml:lang attribute is used in XML-based documents

Boolean Attributes A Boolean attribute specifies one of two values: true or false The presence of a Boolean attribute in an element’s opening tag indicates a value of “true”, whereas its absence indicates a value of “false” When a Boolean attribute is not assigned a value, it is referred to as having a minimized form Recall that all attribute values must appear within quotation marks

Boolean Attributes 2 This syntax also means that an attribute must be assigned a value  For this reason, minimized Boolean attributes are illegal in XHTML You can still use Boolean attributes in XHTML provided you use their full form You create the full form of a Boolean attribute by assigning the name of the other attribute itself as the attribute’s value

Required Elements To better understand how an XHTML document is structured, in this section you study in detail the three elements that must be included in every XHTML document: the,, and elements

The Element All HTML documents must include an element, which tells a Web browser that the instructions between the opening and closing tags are to be assembled into an HTML document The element is required and contains all the text and other elements that make up the HTML document The element is also the root element for XHTML documents and is required for XHTML documents to be well formed

The XHTML Namespace All of the predefined elements in an XHTML document are organized within the XHTML namespace that you declare in the element In order to understand what a namespace is, recall that you must define your own elements and attributes in an XML document You identify each element by the namespace to which it belongs A namespace organizes the elements and attributes of an XML document into separate groups

The XHTML Namespace 2 For elements, you add the namespace and colon before the tag name in both the opening and closing tags A default namespace is applied to all of the elements and attributes in an XHTML document, with the exception of elements and attributes to which local namespaces have been applied You specify a default namespace for an XHTML document by using the xmlns namespace attribute in the element

The Element The elements within a document’s head section contain information about the Web page itself The document head does not actually display any information in a browser  Rather, it is a parent element that can contain several child elements

Child Elements of the Element A parent element is an element that contains other elements, known as child elements

The Element The document body is represented by the element and contains other elements that define all of the content a user sees rendered in a browser XHTML documents consist of elements that contain content, as opposed to HTML documents, which consist of content that contains elements

The Element 2 In HTML, you can also use various attributes in the element that affect the appearance of the document, such as the bgcolor attribute for setting the background color and the text attribute for setting the default color of text Basic body elements such as the and elements are some of the most frequently used elements in Web page authoring

Headings Heading elements are used for emphasizing a document’s headings and subheadings, which helps provide structure by hierarchically organizing a document’s content There are six heading elements, through

Paragraphs and Line Breaks The paragraph ( … ) and line- break ( ) elements provide the simplest way of adding white space to a document White space refers to the empty areas on a page  It makes a page easier to read and is more visually appealing

Paragraphs and Line Breaks 2 It is tempting for beginning Web page authors to try and pack each page with as much information as possible, but experienced Web page authors know that the presence of white space is critical to the success of a page, whether you are creating a Web page or a traditional printed page

Horizontal Rules The empty horizontal-rule ( ) element draws a horizontal rule on a Web page that acts as a section divider Horizontal rules are useful visual elements for breaking up long documents Although the element is technically a block-level element, it cannot contain any content because it is an empty element

Comments Comments are nonprinting lines that you place in your code to contain various types of remarks XHTML comments begin with an opening comment tag

First XHTML Page <!DOCTYPE html PUBLIC "//W3C//DTD XHTML 1.0 Strict//EN" " My First XHTML Document My First HTML Document Hello, visitor Greetings from Ji Soo Yoon This page written by: Ji Soo Yoon © 2004 and beyond Checking this page for validation click here

For More Information World Wide Web Consortium  Greg’s Web  W3Schools  XHTML with examples 