Advanced Web Technologies

Blog posts as part of the BSc Internet Application Development programme to discuss my experience while working on the tasks that will be given during the Advanced Web Technologies module.

Week 2: XML vs HTML

Posted by Stephanie Vella
Thursday, 20 October 2011
comments (0)

  1. Have a look at the documents below. Some are XML documents, some are HTML documents, some may be neither. See if you can decide which are which.
  2. Make a list of the distinctive characteristics of an XML document, in terms of things that you can spot when looking at the code.
  3. Assume that (with suitable changes) all these documents could become XML documents. Imagine, and describe, applications that could use these documents.
    4. NB I’ve removed one or more lines from each document to stop it being too easy.

Document 1

  1. This document is an HTML document which also contains javascript inside.
  2. It is an HTML document because it has tags such as "head", "title", "body", "table" and "meta". An HTML document, the root element should be <html>. In this case, inline styling is used instead of an external CSS file.
  3. This could be used to read data. In this case, a set of symptoms can be taken and a range of diagnoses will be offered.

Document 2

  1. This document is an XML document.
  2. The DTD is declared externally, wrapped in a DOCTYPE definition. The second line consists of and XSL declaration, which is used to style the XML document. In this document, "advertising" is the root element.
  3. This could be used to display adverts and contact information as regards to the advert.

Document 3

  1. This document is an HTML document containing javascript code.
  2. In this HTML document, a form is created, and when the button is clicked, the loadFile() function will be called.
  3. This applications could be used for spots analysts to load a list of the countries, and depending on the country, the list of players will be appear.

Document 4

  1. This document is an XML document.
  2. The DTD is declared externally, wrapped in a DOCTYPE definition. In this document, "story" is the root element.
  3. This could be used to load a book in the web browser.

Document 5

  1. This document is an XML document.
  2. The DTD is declared internally, that is, inside the XML document. This XML file is not valid because there are missing end tags for "title", "stanza", "line" and "poem".
  3. This may be used to store a number of poems for educational purposes, such as English literature.

Document 6

  1. This document is an XML document.
  2. The DTD is declared externally. The syntax for a DTD declaration is:
    <!DOCTYPE root-element [element-declarations]>
    Therefore, this XML document contains an error in the root element because the root element in the DTD declaration is "countryCollecton", while in the XML is "countryList".
  3. This may be used to display basic information about a country, for a geography test.

Document 7

  1. This document is an HTML document.
  2. This document does not contain the "title" tag. This file also consists of javascript where the global variable contains an XML string.

Question Sheet:

Question sheet: Lab 2

Week 1: What are the implications of the concept of the document tree?

Posted by Stephanie Vella
Tuesday, 18 October 2011
comments (0)

The document tree is the structure of an HTML or an XHTML document. The elements within the HTML and XHTML document will be linked together and will form a document tree. Apart from the root node, every element has only one parent.[1] A document tree consists of:
  • Ancestor
  • Descendant
  • Parent
  • Child
  • Sibling
In XML, a tree starts at the root node and branches to leaves.[2] The following is an example of an XML document:
1:  <?xml version="1.0" encoding="ISO-8859-1"?>  
2:  <book>  
3:     <author>Sara Shepard</author>  
4:     <title>Pretty Little Liars</title>  
5:     <genre>Young-adult fiction</genre>  
6:  </book>

In the above example, the root element is book and the child elements of the root are author, title and genre.

Sources:

[1] http://www.guistuff.com/css/css_doctree.html
[2] http://www.w3schools.com/xml/xml_tree.asp

Week 1: What are the relative merits of CSS and XSL?

Posted by Stephanie Vella
comments (0)

Both CSS and XSL both refers to stylesheets. CSS can be used to style bith the HTML and XML documents, while XSL is a transformation language used to transform only XML documents.[1]

In order to choose which one to use, W3C recommends the following rule; "Use CSS when you can, use XSL when you must".[2]

The following are the advantages of CSS:[3]
  • The change to the style of the document is easier when using CSS, that is, making changes to only one CSS file instead of going through many HTML files;
  • The CSS file will only be downloaded once, and therefore the requirement of the bandwidth will be reduced;
  • Layout will be consistent in the entire website;
  • It is easier for visitors who would like to view only the web page content, since it separates style from content.
On the other hand CSS also have some disadvantages:[4]
  • CSS layout is rendered differently and therefore CSS will not work consistently when using different browsers;
  • CSS does not have any variables;
  • CSS is a style language rather than a layout language and therefore poor layout controls for flexible layouts.
XSL has the following advantages on CSS:[5]
  • XSLT and XSL-FO are combined and therefore a much more complex and powerful styling language is created;
  • XSLT is turing complete;
  • XSLT is capable of creating content and capable of generating multiple contents.
A disadvantage of XSL is that:
  • XSL-FO is complex and therefore it is very difficult to implement an FO processor.

Sources:

[1] http://www.w3.org/Style/
[2] http://www.w3.org/Style/CSS-vs-XSL
[3] http://www.vordweb.co.uk/css/advantages-of-css.htm
[4]http://www.articlesbase.com/web-design-articles/advantages-and-disadvantages-of-using-css-833019.html
[5] http://www.pubarticles.com/article-the-difference-between-css-and-xsl-1240385227.html

Week 1: What is the current status of XSL?

Posted by Stephanie Vella
comments (0)

Extensible Stylesheet Language (XSL), currently version 2.0 [1], is used to transform the XML documents. XSL consists of the following three parts: [2]

  • Extensible Stylesheet Language Transformation (XSLT) is a W3C recommendation used to transform XML documents to other XML documents or into XHTML documents; [3]
  • Extensible Stylesheet Language Formatting Objects (XSL-FO) is used to format the XML data for output; [2]
  • XML Path Language (XPath) is used to go through the elements and attributes of an XML document. [4]

Sources:

[1] http://www.w3.org/TR/xslfo20/
[2] http://www.w3schools.com/xslfo/xslfo_intro.asp
[3] http://www.w3schools.com/xsl/xsl_intro.asp
[4] http://www.w3schools.com/xpath/default.asp

Week 1: What is the current status of CSS?

Posted by Stephanie Vella
comments (0)

Cascading Style Sheets (CSS), released on 17th December 1996, are used in conjunction with HTML, to define how the HTML elements will be displayed in a web page. [1]
The following are the levels of CSS:

  • CSS Level 1 - is the first specification published on the 17th of December 1996; [2]
  • CSS Level 2 - is the second specification published on the 12th of May 1998 and later revised on the 11th of April 2008. CSS level 2 included a number of new features; [3]
  • CSS Level 2 Revision 1 - is an update to fix the errors that have been found in the second specification. It have been published as a Recommendation on the 7 of June 2011; [4]
  • CSS Level 3 - is the latest standard of CSS, still under development, where new features have been added, to make the styling of the web page more interesting. [5]

Sources:

[1] http://w3schools.com/css/css_intro.asp
[2] http://www.w3.org/TR/2008/REC-CSS1-20080411/
[3] http://www.w3.org/TR/2008/REC-CSS2-20080411/
[4] http://www.w3.org/2011/05/css-pr.html.en
[5] http://www.w3schools.com/css3/css3_intro.asp

Week 1: What is the first Browser to read XML?

Posted by Stephanie Vella
comments (0)

XML stands for eXtensible Markup Language.  It is a markup language designed to carry data and not to present data. [1]

Microsoft Internet Explorer 4 was the first web browser to support XML, it had the following features: [2]

  • An XML parser which have been used to read XML files and hand them off to applications such as viewers for processing;
  • XML Object Model (XML OM) uses the Document Object Model (DOM).  Using the XML parsers, XML OM allow access to the structured data. This gave the developers power to interact on the data;
  • XML Data Source Object (XML DSO) uses dynamic HTML’s (DHTML) data binding features to connect the XML data and add it to the HTML page.

In Microsoft Internet Explorer 5 Beta, there have been alot of updates to the XML features that have been offered in Internet Explorer 4. [3]

Sources:

[1] http://www.w3schools.com/xml/xml_whatis.asp
[2] http://xml.coverpages.org/msXMLFAQ200006.html#xmlfaq_topic11
[3] http://www.cme-ch.com/span/span4_xml_tools.htm

Subscribe to: Comments (Atom)