Markup

1
You Asked For It

• Markup
• Programming Markup Dynamically
• (XML and DHTML)

2
Tonight

• We will talk about
• The Definition of a Markup Language
• Past and Present Markup Languages
• What Each Language Can and Cant Do
• Using Markup Languages
• Manipulating Markup Languages
• How to Apply this Knowledge to Your Projects
• You will see
• Theory
• Applied Theory as Examples
• We will also
• Take a 5 minute break because breaks are good.

3
What is a Markup Language?

• markup (encoding) making explicit an
  interpretation of text
• Text markers used to provide information about
  text.
• markup language a set of markup conventions used
  together for encoding texts it must specify what
  markup is allowed, what markup is required, how
  markup is to be distinguished from text, and what
  the markup means.
• The defined method of interpreting text.

4
Simple Markup Example

• ltSENTENCEgtThis is text.lt/SENTENCEgt

5
The General System

• Standard Generalized Markup Language(SGML)
• Concept in the 60s / First Specification in 1980
• Generic Language for Structured Documents
• Used in Large Scale Publishing Systems
• Definitions from The Gentle Introduction
• SGML is an international standard for the
  definition of device-independent,
  system-independent methods of representing texts
  in electronic form''
• SGML is a metalanguage, that is, a means of
  formally describing a language, in this case, a
  markup language''

6
SGML The Proud Daddy
SGML
HTML
XML
TEI
ML-STD
Others
7
Defining the Family

• SGML is used to Define Child Markup Languages
• Document Type Definitions (DTDs) are the means
  of creating the children.
• Rules of the Language
• Vocabulary of the Language (possibly)
• HTML, XML, XHTML, etc all have DTDs

8
Markup LanguagesDO NOTHING ON THEIR OWN!

• After all this defining definitions of
  definitions
• They are simply text descriptions of text.

9
So, What Makes HTML, XML, etc Work?

• Markup languages are dependant on the parsers
  that act on them.
• Web browsers may contain HTML, XML or XHTML
  parsers.
• Cell phones may contain WML or HDML parsers.
• Server-Side programs may contain those (or other)
  parsers.
• Parsers read the text and act (as they are
  programmed to) on the markup.

10
The Parser Explained
Parser
Thing
(1) Request Action
(2) Loading the Document
(3) Processing the Data The parser moves through
the document, step by step, and acts on the
markup based on the defined set of rules
(Processing Instructions)
DOC
Processing Instructions
11
Why do HTML Parsers (browsers) Act Differently?
Parser
Thing
Different Browsers Have Slightly Different
Processing Instructions This is why the resulting
display sometimes differs.
DOC
Processing Instructions
12
Will this Problem Go Away?

• Not any time soon
• Because, each Parser and Its Processing
  Instructions are Built by Different Companies
  (therefore, by different people)
• Because, the Market Drives Browser Makers to
  Include Innovations Beyond the HTML
  Specifications

13
Then, How Can I Be Sure My Markup will Be
Formatted Properly?

• First, Understand the Problem
• Identify your Target Browsers (Parsers)
• Realize the Differences
• Determine the Projects Tolerance Level for those
  Differences
• Second, Decide on a Solution
• Code Generically and Trust the Parsers
• Develop Specific Browser Formatting

14
Code Genericallyand Trust the Parsers

• Designers
• Dont Expect Pixel Precision
• Design For the Fluid Nature of HTML
• Allow for different screen resolutions, color
  palates, etc
• Developers
• Follow the Standards
• Quality Assurance
• Validate the HTML against the Standards
• Visually Test with Tolerance

15
Develop SpecificBrowser Formatting

• Basic Solution Steps
• Determine the Target Browsers
• Develop HTML for Each Browser
• Separate HTML
• Combined HTML
• Problems with the Solution
• If there are multiple browsers targeted, the
  content is often duplicated (in a separate HTML
  model) or formatting is very complex (in a
  combined HTML model.)

16
These Problemsare Not New

• In the Dark Ages, documents were stored in
• formats that mixed content and formatting,
• causing many maintenance and interoperability
• problems for publishers.
• Sound familiar? More on this in a bit.

17
Then A New Idea Was Presented (in the 60s)

• William Tunnicliffe, chairman of the Graphic
  Communications Association (GCA) Composition
  Committee, presented during a meeting at the
  Canadian Government Printing Office in September
  1967
• Topic -- the separation of the information
  content of documents from their format
• This is one of the major reasons
• for the development of SGML.

18
Then, Couldnt HTML be a Step Backwards?

• Yup.

19
Why is the Separation of Content from its
Formatting a Good Idea?

• Changes in Content do not Require Changes in
  Formatting
• Allows for Programmatic Location of Content
• Ease of Searching
• Reuse of Content Segments
• Multiple Presentations of Content Made Simpler
• Multiple Sources of Content Can Share Formatting
  Rules

20
What Does That Mean?!?
Internet Users
F
Formatting In One Place Formatting needs to be
changed in one place.
Content in Another Content can come from multiple
sources.
FC
Content and Formatting on Each Page A change in
formatting means a change in EVERY page.
21
Another Example Benefit
Multiple Format Rule Sets Different formatting
can be applied to the same content.
Single Content Set Content remains unaffected.
Internet Users
22
The World Wide Web Consortium has Gotten Smarter

• Recently, the W3C has realized its mistakes and
  returned to the original reasoning behind SGML.
• XML
• XSL
• XLL
• XHTML

23
Weve Got a Couple of Tricks of Our Own(i.e.
stuff we did before the new technologies)

• Storing Content in a Database, Assembling HTML
  through Templates (ASPs, PERL Scripts, etc)
• Storing Content in the File System, Separate from
  its Formatting Templates
• Server-Side Browser Detection Used to Adjust HTML
• Proper Use of Cascading Style Sheets

24
The SGML Family Grows to Help Solve the Problem
SGML
TEI
ML-STD
Others
HTML 4.0
CSS
XML
HTML 4.1
XHTML
XSL
25
XML, What is it?

• A Way to Structure Data (Content), Independent of
  Formatting
• A Subset of SGML
• Simpler Rules and Implementation
• Retains the Power of Extensibility
• Parent Standard to a Host of Other Standards
• XSL
• XLL
• XML-RPC / SOAP

26
Can XML Help Solve the Problem of Formatting?
Internet Users
XML

• Provides Generic Structures for Data that can be
  Transformed into another XML form (HTML, HDML,
  WML, etc)

27
Show Me!

• Link to XSL viewer.

28
DHTMLManipulating HTML

• DHTML uses scripting to manipulate HTMLs content
  and formatting
• Uses a view of the HTML known as the Document
  Object Model (DOM)
• Once again, there are MAJOR differences between
  browser implementations

29
Browser Scripting

• Lightweight Programming
• Executed By the Browser
• Languages
• JavaScript (NS)
• Jscript (IE) close to JavaScript
• VBScript (IE)
• Often Limited to Content and Objects within the
  HTML

30
Document Object Models (DOMs)

• Provide Scripts with Access to the HTML Document
• Organizes HTML into Tree-Like Structures

Parser
Script
Access HTML
Provides a View of the Document
Document Table Row Cell Cell
Content
DOC
31
What can it do?

• Change the HTML contents
• Change the HTML tag attributes
• Create new content and tags
• But It must have the data needed for the
  changes available to the browser from user
  interaction or in client side data structures.

32
DHTML Example Discussion
33
Part of the Delivery Explains It Series