News & UpdatesProgrammingWeb programming Store My Projects
Links
Affiliates

XML Tutorial – 03 – Syntax Rules II

August 26th, 2009

XML documents use a very simple and self-describing syntax. If you open up the document created in the previous section in a browser it will be displayed as a tree without any stylistic formatting. It is just data wrapped in tags. To make any use of the file a program has to be written that accesses the data.

<?xml version="1.0" encoding="UTF-8"?>
<book>
  <title>Learning XML</title>
  <chapter>What is XML</chapter>
</book>

Keep in mind that XML has very strict rules regarding its structure. If there is an error in the document, for example if a closing tag has been nested improperly, the browser will report the error and won’t display the document.

<a></a><b>Allowed</b>
<a><b>Allowed</b></a>
<a><b>Invalid</a></b>

Content types

Elements can have four different content types. Below the title element has simple content, which is also called text content. Book has element content, because it contains only elements and no text. Chapter has mixed content, because it contains both text and elements. Finally, the para tag has empty content. Elements with empty content can also be shortened as in XHTML, by removing the end tag and including a slash before the closing bracket of the start tag.

<?xml version="1.0" encoding="UTF-8"?>
<book>
  <title>Text content</title>
  <chapter>Mixed content
    <para></para>
    <para />
  </chapter>
</book>

Comments

The comment tag can be useful for leaving notes or for temporarily removing a block of XML data. It has the same notation as the one used in HTML. The tag that may span multiple lines and can appear anywhere in the document.

<!-- This is an XML comment -->

XML Tutorial – 02 – Syntax Rules I

August 26th, 2009

To make an XML document create an empty text file and give it a .xml file extension. The first line in the document must be the XML declaration. This line defines the XML version and the character encoding used in the document.

<?xml version="1.0" encoding="UTF-8"?>

This XML document will describe a book so the first tag is called book. Just as in XHTML the tags are recognized by the angle brackets and all tags must have a closing tag (except for the XML declaration). Unlike HTML, XML tags are not predefined. Any tag names can be used, but they shouldn’t contain spaces or start with numbers or punctuations. Either upper or lower case letters can be used, as long as the opening and closing tags have same casing.

<?xml version="1.0" encoding="UTF-8"?>
<book></book>

This first element is called the root element and each XML document can have only one of them. Inside the root two child elements are included: title and chapter. These are sister elements to each other, because they have the same parent element. All elements can contain both text and child elements.

<?xml version="1.0" encoding="UTF-8"?>
<book>
  <title>Learning XML</title>
  <chapter>What is XML</chapter>
</book>

XML Tutorial – 01 – Introduction

August 26th, 2009

XML stands for Extensible Markup Language and is a language used for describing data. Moreover, XML was not designed to do anything. Instead, it is used by other languages to structure, store, and exchange data. The markup tags in XML are not predefined as they are in HTML. This is why it’s called an extensible language, because you can create your own markup tags. By defining valid tags and semantic – either using a document type definition (DTD) or its successor the XML Schema – it’s possible to create new languages with XML. Some examples of languages specified in XML are: XHTML, SOAP, and RSS.

HTML Tutorial – 18 – Standards

August 25th, 2009

Every HTML document should begin with a reference to a Document Type Definition (DTD), or doctype, to be standard compliant. This definition declares which version of the HTML standard that the document follows and must be placed before the <html> element. The three versions defined are: strict, transitional and frameset.

Strict definition

The strict definition includes only the structural markup without any of the deprecated elements or attributes. Instead, it leaves formatting up to CSS.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/HTML4/strict.dtd">

Transitional definition

The transitional definition includes everything that is deprecated and is intended to smooth the transition over to the strict definition.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/HTML4/loose.dtd">

Frameset definition

The frameset definition is used by frame documents. It contains the same elements as the transitional definition, except that it includes the frameset elements.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/HTML4/frameset.dtd">

XHTML definitions

There are corresponding versions for XHTML documents.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Meta tag

Another standard that should be followed is to include metadata in the document, using the <meta> header tag. The tag requires either the name or http-equivalent attribute, paired with the content attribute. The http-equivalent attribute will cause the metadata to be sent as HTTP header information. The most important metadata is the document’s file format and its character encoding.

<meta http-equiv="Content-Type" 
content="text/HTML; charset=iso-8859-1">

For XHTML documents another MIME type and subtype are used.

<meta http-equiv="Content-Type" 
content="application/xhtml+xml; charset=iso-8859-1" />

Metadata can also be used to help search engines by providing a description of the document and a list of keywords relating to its content.

<meta name="description" content="document description">
<meta name="keywords" content="list, of, keywords">

Another common use of the <meta> tag is to automatically redirect a visitor to a new page after a specific number of seconds.

<meta http-equiv="refresh" content="0; url=newpage.html">

HTML Tutorial – 17 – XHTML

August 25th, 2009

XHTML or Extensible HyperText Markup Language is the successor to HTML. It is a reformulation of HTML using XML and is therefore almost identical to HTML. However, XHTML is stricter, so there are a few important differences.

Closing tags are required

First, XHTML requires all elements to be closed, so previous optional end tags must be included. Elements that do not have an end tag gets one in the start tag by adding a forward slash before the closing angle bracket. Commonly, there is a space between the tag name and the slash, although this is optional.

<p></p>
<br />

Lowercase tags and attributes

Secondly, XHTML is lowercase-only for all tag and attribute names, unlike HTML which is case-insensitive.

<P>Invalid</P>
<p>Correct</p>

Mandatory quoted values

Third, all attributes must have a value specified. For attributes that do not have any values this means that they must use their own names as their value. Also, double quotes are required around all values.

<p align="left"></p>
<hr noshade="noshade" />

Proper nesting

Fourth, elements must be properly nested. That is, an inner element must be closed before the outer element is closed.

<a><b>Correct</b></a>
<a><b>Invalid</a></b>

XML namespace

In XHTML, an XML namespace must be specified that will be used throughout the document. This is done by placing the xmlns attribute within the <html> start tag. The xmlns attribute can be placed within any element to define one or more alternative namespaces within the document.

<html xmlns="http://www.w3.org/1999/xhtml"></html>

Declaring encoding

There is an optional XML declaration that can be placed at the top of an XHTML document. This line specifies the XML version and character encoding of the document. Typically, it is set to the current version 1.0 of XML along with the common 8-bit Unicode character set.

<?xml version="1.0" encoding="UTF-8"?>

There is an issue in IE6 with this declaration that causes the document to render incorrectly. Therefore, the header <meta> tag is typically used instead to specify the character encoding.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

DTD required

XHTML must validate against one of the three XHTML Document Type Definitions (DTD), which will be covered in the next chapter. Thus, one of the lines below must be included before the <html> element.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

To summarize, a standards-compliant XHTML web document includes the following elements.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" 
        content="text/html; charset=utf-8" />
  <title>Learning XHTML</title>
</head>
<body></body>
</html>

HTML Tutorial – 16 – Multimedia

August 25th, 2009

The element used for embedding multimedia and applications in HTML is called <object>. It replaces older tags such as <applet> and <embed>. The <object> element enables the inclusion of objects such as images, video, flash, sounds and applications into a webpage.

To include an object one of two attributes are used to specify its location. The data attribute is used to embed data that the browser can display by itself, such as a document or an image. The type attribute is used in combination with the data attribute to identify the data file type.

<object data="pvt.png" type="image/png"></object>

The other attribute for specifying the object’s location is classid. This attribute is used if the object needs to execute an external program, such as a media player, active-x control or Java applet. Codetype is typically used together with this attribute to identify the content type of the expected data. If codetype is omitted, the type attribute will be used instead.

The codebase attribute provides an alternative base URL from which the browser will retrieve the object. The value of this attribute is a link pointing to a directory containing the object referenced by the classid attribute. The standby attribute can be used to display a message while the browser is downloading the object data. Some other attributes are available that are the same as for the image tag. Most importantly, the height and width attributes, which control the size of the object.

The <param> tag is used to specify an input parameter to the object. This tag may only appear inside an object element and has no content or end tag. It required two attributes: either name and value or id and value. Together, they define a name/value pair that is passed to the object.

Below is an example of how the object element can be used to show a video file.

<object id       = "mediaPlayer" 
        width    = "640" 
        height   = "545"
        classid  = "CLSID:6BF52A52-394A-11d3-
                    B153-00C04F79FAA6"
        codebase = "http://activex.microsoft.com/
                    activex/controls/mplayer/en/
                    nsmp2inf.cab#Version=5,1,52,701"
        standby  = "Loading Microsoft Windows 
                    Media Player components..." 
        type     = "application/x-oleobject" VIEWASTEXT>
           <param name="url"       value="MyVideo.avi">
           <param name="autoStart" value="true">
           <param name="wmode"     value="transparent">
           <param name="uiMode"    value="full">
           <param name="loop"      value="false">            
</object>
  1. 1
  2. ...
  3. 31
  4. 32
  5. 33
  6. 34
  7. 35
  8. 36
  9. 37
Ads