section2 notes

8/6/2019 Section2 Notes

1/13

## SECTION 2 - XHTML and DTD ##Code rules

AttributesFont SIZE/COLOR

Font Color

XHMTLGOALSEvolution

User AgentsRulesTags being written outEmpty Elements

DTDXHTML Documument Type

Transitional DTDFrameset DTDStrict DTDPresentational Material

Validating XHTMLXHTML Elements/attributes

Block-level elementsInline elements

Standard AttributesDefining the languageTitle attributeXHTML Namespace


2/13

XHTMLGoals1) to separate the way documents are structured from the way

they are displayed2) eliminate sloppy code- make it well-formed

User Agents

web expansion to mobile phones, PDAs, software for visuallyimpaired

devices of receiving and displaying data many items still not available: frames, tables, graphics

- these are in development other applications may collect and process data, but not display

HTML is not suitable - allows sloppy code, transition to visual

page 19


3/13

Sloppy code...

(type exactly-and it will still work)Chapter 4 - The Apes

"...Old Tantor; the elephant alone of all the wild savage life,feared him not. When tantor trumpeted, the great ape scur -ried with his fellows high among the trees of the secondterrace..."

from Tarzan of the Apes
by Edgar Rice Burrows

XHTML Rules

1) lower case tags2) all tags must close- eg)

.....

3) must give proper instruction to browser (DTD)4) must include base tags 5) tags imbedded based on importance

...

page 20


4/13

Some of the tags being written out of StrictXHTML - CSS replaces almost all:

etc...

Empty Elements

Do not contain content between the opening and closing tags

becomes
becomes
becomes

long way of writing tags
(doesn't validate)

page 21


5/13

DTD - Document Type Definition

- required for ALL XHTML documents- defines tags and attributes that can be used

- if the document conforms = valid; if not = invalid- use a Validator to check if code is valid (w3.org)- when the browser opens an HTML document, it first compares

the code to the DTD and then determines if anything is missing.It ignores anything it doesnt know.

XHTML Document Type

1) choose which type of HTML you will use:frames, CSS, visual components (eg. or )2) MUST include declaration,

3) Choose type of XHTML DTD: Strict, Transitional, Frameset

PUBLIC= DTD is available on the web (system used if local) Public identifier string must have URL - if the browser does not have

XHTML 1.0 built in, it will attempt to located the DTD at the URL if no DOCTYPE, will revert to HTML

page 22


6/13

Transitional DTD allows you to continue using some discontinued items with

well-formed requirements of XHTML

Great American Novel

It was a dark and stormy night bright and sunny day.

Lightning streaked the sky, followed by an angry explosion of thunder.High, soft clouds accented the sky and a soft wind gently swayed thetrees.

Frameset DTD- includes and elements- will eventually be written out in favor of STRICT DTD

Strict DTD- includes and elements- will eventually be written out in favor of STRICT DTD

page 23


7/13

Document

Does it have frames?

Does it use presentational markup Use XHTML 1.0 Frameset

no yes

Use XHTML 1.0 Strict Is all of the presentation markup in a stylesheet?

No yes

Use XHTML 1.0 Transitional Use XHTML 1.0 Strict

(presentation material = text color, font faces, text size, borders, cell padding

- if any of these tags exist, it must be transitional.)

Validating XHTML

browser may ignore errors and display

Markup is valid when it contains no errors (example: forget -ting to close a tags bracket) and no illegal tags or attributes(example: the height attribute, applied to a table, is not legalXHTML)

http://validator.w3.org

or for mac: http://validator.w3.org/file-upload.html1) browse for file2) iso-9959-1; western OR charset=utf-8

page 24


8/13

Code protocol/rules lower case (for XHTML) 5 spaces for first tab, 3 spaces for next (for tables) each tag on its own line

carriage returns disregarded space bar makes only one space, no matter how many times you

hit it. tabs ignored multiple

tags ignored use comments to put notes in html-

Elements

structure tags use < and > travel in pairs with a start and stop Hello World

Attributes descriptive terms that further describe or expand a tag only apply to the opening tag separated from the tag by a space ALWAYS followed by =" "-

tags can have multiple attribute-

page 25


9/13

page 26

Borrowing the DTD

URL: www.w3.orgView Menu > View Source

Installing Firefox Developer Tools1) open the Firefox Browser2) www.firefox.com3) Top Menu > Addons > Search : Web Developer4) Web Developer App by Chris Pederick > install

Simple XHTML document

A Simple XHTML DocumentA Simple XHTML Document

This is a simple XHTML document. XHTML is a refor -

mulation of HTML 4.0 in XML. XML is the eXtensible Markup Language, andwas designed to both meet the formatting need of modern web-designers, whileattempting to retain the content emphasis of HTML/SGML's past.
UsingXHTML (and XML), a web-designer can customize the formatting of their docu -ments to their heart's content, as well as create well-formed documents which con -tain information easily accessible by external programs.


10/13

XHTML ElementsELEMENT DESCRIPTION Address Block quotation (must contain

tags) Deleted text

Generic block-level container Definition list Form control group Interactive form- Heading elements Horizontal rule Inserted text Alternate script content Ordered list

Paragraph Preformatted text Table Unordered list

Block-level elements- appear on their own line- can contain other block-level elements and inline elements

Inline elements- text-level- not on their own line, but within the block-level element
, etc- not well formed if the block level is embedded in the inline

eg)

hello
This is incorrect
page 27


11/13

Central Valley Farmers' Market WebCentral Valley Farmer's Market

The Central Valley Farmers' Market offers plenty

of fresh picked fruits, vegetables, herbs, and flowers. You will also findlots of baked goods, jams, honey, cheeses, and other products.

Standard Attributes

- to configure elements- always followed by ="..."- some attributes can only be used with certain elements

eg) img src=""

ATTRIBUTE DESCRIPTIONclass identifies various elements as part of the same groupdir specifies the direction of the text

id uniquely identifies an individual element in a documentlang / xml : lang specifies the language in which the contents of an element

were originally writtenstyle defines style information for a specific elementtitle provides descriptive text for an element

page 28


12/13

Defining the language- web sites are viewed internationallylang - defines the language for htmlxml : lang - defines language for xml

- use both for XHTML- a 2-letter code represents the language eg. "en"- also define the direction that the language is read in

eg. "ltr"

Title Attribute

provides descriptive text for an element text appears when the mouse hovers over the object also referred to as a ToolTip in Internet Explorer only works on newer browsers

Titles and languages

Mum got run over by a lorry after eating a packet of crisps for afters.

page 29


13/13

page 30

XML Namespace organizes elements and attributes of an XML document into

separate groups attribute of html

namespace for XHTML is XMLNS must be used for proper XHTML documents

section2 notes

Documents