Scribd
Upload
24 views

WT-II-HTML & XHTML-Basic Tags 02

The document discusses the origins and evolution of HTML and XHTML. It describes how HTML was first released in 1991 and has evolved over time, with XHTML being a stricter version of HTML. It also provides basic information on HTML syntax and tags, and covers common elements like paragraphs, headings, and text formatting.

Uploaded by

GANAPATHI RAM
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
24 views

WT-II-HTML & XHTML-Basic Tags 02

The document discusses the origins and evolution of HTML and XHTML. It describes how HTML was first released in 1991 and has evolved over time, with XHTML being a stricter version of HTML. It also provides basic information on HTML syntax and tags, and covers common elements like paragraphs, headings, and text formatting.

Uploaded by

GANAPATHI RAM
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 38

http://info.cern.

ch/
HTML & XHTML
 Origins and Evolution of HTML
 Basic Syntax
 Standard HTML Document Structure
 Basic Text Formatting
 Images
 Hypertext Links
 Lists
 Tables
 Frames and Forms.
Analogy
Origins and Evolution of HTML and XHTML

• HTML stands for Hyper Text Markup Language .

• Hyper Text is text which contains links to other texts .

• It is a markup language consists of a set of markup tags.

• HTML uses markup tags to describe web pages.

• HTML markup tags are usually called HTML tags.

• HTML tags are keywords surrounded by angle brackets like <html> .


Origins and Evolution of HTML

• HTML tags come in pairs like <b> and </b> .

• The first tag in a pair is the start tag, the second tag is the end tag .

• Start and end tags are also called opening tags and closing tags

• XHTML stands for Extensible Hypertext Markup Language.

• XHTML is almost identical to HTML 4.01.XHTML is a stricter and

cleaner version of HTML 4.01.


HTML Timeline
1991 HTML 1.0 1995 HTML 2.0 1996 HTML 3.2 1997 HTML 4.0 1999 HTML 4.1

HTML 1.0 HTML 2.0 HTML 3.2 (W3C) HTML 4.0 HTML 4.1
HTML 1.0 was the first HTML 2.0 included First version Introduced many new A cleanup of 4.0, • it
release of HTML to everything from the developed and features and faces 2 problems - it
the world. original 1.0 standardized deprecated many specifies loose syntax
The language was specifications • HTML exclusively by the older features. • rules it’s specification
very limiting. 2.0 was the standard W3C Support for HTML’s does not define how
for website design new supporting a user agent
until January 1997 • presentational (browser) is to
Defined many core language, CSS. recover when
HTML features for the erroneous code is
first time. encountered.
XHTML Timeline
HTML 4.0
2000 XHTML 1.0 2001 HTML 2.0 2008 HTML 3.2

HTML 1.0 XHTML 1.1 HTML 5


XHTML 1.0 is three standards:
Modularization of Latest specification of
Strict, Transitional and Frameset.
XHTML 1.0 , drops the HTML..
some of the features HTML5 was published
Strict standard requires all of the
of its predecessor as a Working Draft by
syntax rules of XHTML1.0 to be
such as frames. the W3C
followed.

Transitional standard allows


deprecated features of XHTML1.0
to be included.

Frameset standard allows the


collection of frame elements and
attributes to be included although
they have been deprecated.
Basic
Basic Syntax of HTML
• Fundamental syntactic units of HTML are called tags. Elements are defined by tags.

Tag format:

• Opening tag: <title>

• Closing tag: </title>


• Comment form: <!-- … -->.Comments increases the readability of programs.
Browsers ignore comments, unrecognizable tags, line breaks, multiple spaces, and
tabs.
Standard HTML Document Structure
Standard HTML Document Structure
Standard HTML Document Structure
Try it Yourself

 To Create the HTML Layout

 To Create the title for your webpage


Basic Text Formatting
Basic Text Formatting
• Describes how the text content of an XHTML document can be formatted with XHTML
tags .
1. Paragraphs
2. Line Breaks
3. Preserving white space
4. Headings
5. Block Quotes
6. Font styles & size
7. Character Entities
8. Horizontal Rules
9. Meta Element
1. Paragraphs
• Text is normally placed in paragraph elements .

• The <p> tag breaks the current line and inserts a


blank line ( the new line gets the beginning of
the content of the paragraph).
• The closing tag is required in XHTML, not in
HTML.
• Also multiple spaces in the text are replaced by
single space.
Try it Yourself

 To use <p> tag to create news article


2. Line Breaks
• The effect of the <br /> tag is the same as that of <p>,

except for the blank line.

• It can have no content therefore no closing tag!


Try it Yourself

 To create to many news articles paragraph.


3. Preserving whitespaces

• It is used to preserve white spaces in text.

• Text in a <pre> element preserves both spaces and line breaks. </pre> .

• It blocks the browser from eliminating multiple spaces


Try it Yourself

 To use <pre> tag to create more news articles paragraph.


4. Headings
• Six sizes, 1 - 6,are used for specifying
heading.
• It is specified with <h1> to <h6>.

• 1, 2, and 3 use font sizes that are larger


than the default font size.
• 4 uses the default size.

• 5 and 6 use smaller font sizes.


Try it Yourself

 To create news articles Headlines with different font size.


5. Block Quotes
• The Content of <blockquote> can be made to look different from the surrounding text.

• It set a block of text off from the normal flow and appearance of text.

• Browsers often indent, and sometimes italicize.


Try it Yourself

 To create news articles Headlines with different headings.


6. Font styles & size (can be nested)

• Bold - <b>

• Italics - <i>

• Smaller - <small>

• Superscripts

• Subscripts

• Code

• Strong
7. Character Entities
• To include special characters
8. Horizontal Rules
• <hr />

• Used to separate the parts of a document from each other making the document easier to
read by placing horizontal line between them. This causes a line break and draws a line
across the screen .
9. Meta Element
• The meta element (for search engines) Used to provide additional information about a
document, with attributes, not content .
• Two attributes that are used to provide information are name and content
HTML vs XHTML
XHTML
• XHTML stands for EXtensible HyperText Markup Language

• XHTML is a stricter, more XML-based version of HTML

• XHTML is HTML defined as an XML application

• XHTML is supported by all major browsers


Why XHTML?
• XML is a markup language where all documents must be marked up correctly (be "well-formed").

• XHTML was developed to make HTML more extensible and flexible to work with other data
formats (such as XML).

• In addition, browsers ignore errors in HTML pages, and try to display the website even if it has
some errors in the markup.

• So XHTML comes with a much stricter error handling.


The Most Important Differences from HTML
• <!DOCTYPE> is mandatory

• <html>, <head>, <title>, and <body> are mandatory

• Elements must always be properly nested

• Elements must always be closed

• Elements must always be in lowercase

• Attribute names must always be in lowercase

• Attribute values must always be quoted

• Attribute minimization is forbidden

You might also like