Showing posts with label General. Show all posts
Showing posts with label General. Show all posts
Monday, February 28, 2011
I start writing again - finally!
I have been away from blogging for quite some time. This can be attributed to my busy schedule (and some what laziness :-). However, I now plan to write on regular basis. I have some interesting topics in mind to start with. I also plan to finish my incomplete 'LINQ Explained' series. Honestly, LINQ is one topic which requires thorough and deep understanding of concepts before talking about it. In coming days, I also plan to blog about SharePoint Server, Enterprise Concepts and ASP.NET. So stay tuned for more...
Saturday, June 19, 2010
Understanding HTML, XHTML and DHTML
As programmers, we come across the terms HTML, XHTML and DHTML on a daily basis. The difference between these is subtle but important to understand. This post will elaborate these concepts in further details. I would suggest reading my other post HTML Document Structure before proceeding.
HTML
Hyper Text Markup Language or HTML is a markup language used for creating web documents. It has the following characteristics:
1. HTML is a markup language and not a programming language.
2. HTML is an application of SGML (Standard Generalized Markup Language). SGML is a system for defining markup languages.
3. HTML markup consists of elements where each element has a start and end tag. The content of the element is contained between the two tags.
4. HTML also includes character reference and symbols such as ‘<’ is used to represent the ‘<’ sign.
5. An HTML document allows comments.
6. HTML documents are validated by Document Type Definition or DTD.
XHTML
Extensible Hyper Text Markup Language or XHTML is the reevaluation of HTML 4. Both have sharp resembles but with subtle differences. However, the most critical difference between the two is that XHTML is an application of XML . This means that XHTML follows the XML syntax rules for validating web documents. These rules include the following:
1. XHTML is case-sensitive.
2. The entire document has only one root element.
3. Elements must be nested in the correct order.
4. Every element must have a closing tag leading to a well-formed document. Elements without content such ‘br’ must have a self-closing tag.
5. The element tags and attributes are in lowercase.
6. Attributes must be in double or single quotes.
7. Each attribute must have a corresponding value. There is no notion of default values.
8. If there is a syntax error in the XHTML document, the entire document is aborted from loading.
9. Comments are limited in XHTML.
10. The id attribute is used instead of name attribute.
Since XHTML complies with the above rules, it is portable across different platforms including web browsers, mobile phones, palm devices or any reduced browser. HTML, on the other hand, can ignore these rules altogether leading to document with syntax errors.
XHTML also deals with CSS differently. This includes the following characteristics:
1. Element Selectors are case sensitive.
2. In HTML certain properties (background, overflow) of the BODY element applies to the root HTML element as well. This is not true for XHTML.
3. In HTML, even if we omit some tags, elements still exist in the DOM and hence the CSS properties apply to them. This is not true for XHTML. The CSS will only apply to elements with proper markup.
4. MIME types (Content-Type header specified in HTML/XHTML document) are very important when using style-sheets in XHTML document. An XHTML document can work with application/xhtml+xml, application/xml and text/xml MIME types. An XHMTL document using text/xml MIME type is parsed as HTML. However, a style sheet written specifically for XHTML document may not work with text/xml MIME type (since its interpreted as HTML).
XHTML also deals with JavaScript differently. Some of these characteristics include the following:
1. XHTML does not support the .innerHTML property.
2. XHTML does not support document.write () otherwise it confuses the browser which is unable to tell whether a document is well formed or not. For example suppose we have a tag </MyTag> somewhere in the document. Obviously this is not a well formed tag. However, if somewhere above JavaScript uses the statement ‘document.write (“<MyTag>”);’ it will make it a valid tag. This means that unless the document is fully served, the browser cannot if it is a well formed document.
3. DOM methods are replaced by respective namespace-based methods.
DHTML
Unlike HTML and XHTML, Dynamic HTML or DHTML is not an industry standard and is not supported by W3C, IEEE or ISO. The term DHTM was coined by Microsoft. DHTML represents a set of several technologies/standards including HTML/XHTML, DOM, CSS and JavaScript. The merger of these technologies leads to development of Rich Client Applications. HTML/XHTML and CSS are used to create the static but rich visual appearance while JavaScript and DOM are used to make the web applications dynamic.
With this we come to the end of this post. I hope this post has given you a good idea about the difference between HTML, XHTML and DHTML. Do provide your feedback and stay tuned for more…
HTML
Hyper Text Markup Language or HTML is a markup language used for creating web documents. It has the following characteristics:
1. HTML is a markup language and not a programming language.
2. HTML is an application of SGML (Standard Generalized Markup Language). SGML is a system for defining markup languages.
3. HTML markup consists of elements where each element has a start and end tag. The content of the element is contained between the two tags.
4. HTML also includes character reference and symbols such as ‘<’ is used to represent the ‘<’ sign.
5. An HTML document allows comments.
6. HTML documents are validated by Document Type Definition or DTD.
XHTML
Extensible Hyper Text Markup Language or XHTML is the reevaluation of HTML 4. Both have sharp resembles but with subtle differences. However, the most critical difference between the two is that XHTML is an application of XML . This means that XHTML follows the XML syntax rules for validating web documents. These rules include the following:
1. XHTML is case-sensitive.
2. The entire document has only one root element.
3. Elements must be nested in the correct order.
4. Every element must have a closing tag leading to a well-formed document. Elements without content such ‘br’ must have a self-closing tag.
5. The element tags and attributes are in lowercase.
6. Attributes must be in double or single quotes.
7. Each attribute must have a corresponding value. There is no notion of default values.
8. If there is a syntax error in the XHTML document, the entire document is aborted from loading.
9. Comments are limited in XHTML.
10. The id attribute is used instead of name attribute.
Since XHTML complies with the above rules, it is portable across different platforms including web browsers, mobile phones, palm devices or any reduced browser. HTML, on the other hand, can ignore these rules altogether leading to document with syntax errors.
XHTML also deals with CSS differently. This includes the following characteristics:
1. Element Selectors are case sensitive.
2. In HTML certain properties (background, overflow) of the BODY element applies to the root HTML element as well. This is not true for XHTML.
3. In HTML, even if we omit some tags, elements still exist in the DOM and hence the CSS properties apply to them. This is not true for XHTML. The CSS will only apply to elements with proper markup.
4. MIME types (Content-Type header specified in HTML/XHTML document) are very important when using style-sheets in XHTML document. An XHTML document can work with application/xhtml+xml, application/xml and text/xml MIME types. An XHMTL document using text/xml MIME type is parsed as HTML. However, a style sheet written specifically for XHTML document may not work with text/xml MIME type (since its interpreted as HTML).
XHTML also deals with JavaScript differently. Some of these characteristics include the following:
1. XHTML does not support the .innerHTML property.
2. XHTML does not support document.write () otherwise it confuses the browser which is unable to tell whether a document is well formed or not. For example suppose we have a tag </MyTag> somewhere in the document. Obviously this is not a well formed tag. However, if somewhere above JavaScript uses the statement ‘document.write (“<MyTag>”);’ it will make it a valid tag. This means that unless the document is fully served, the browser cannot if it is a well formed document.
3. DOM methods are replaced by respective namespace-based methods.
DHTML
Unlike HTML and XHTML, Dynamic HTML or DHTML is not an industry standard and is not supported by W3C, IEEE or ISO. The term DHTM was coined by Microsoft. DHTML represents a set of several technologies/standards including HTML/XHTML, DOM, CSS and JavaScript. The merger of these technologies leads to development of Rich Client Applications. HTML/XHTML and CSS are used to create the static but rich visual appearance while JavaScript and DOM are used to make the web applications dynamic.
With this we come to the end of this post. I hope this post has given you a good idea about the difference between HTML, XHTML and DHTML. Do provide your feedback and stay tuned for more…
Thursday, June 17, 2010
HTML Document Structure
In this post, I will talk about HTML Document Structure. This post is not a tutorial on HTML for which you can find many useful links online. This post will give you an overview of what a typical HTML Document looks like. So let us dive in straight.
What is HTML
Hyper Text Markup Language or HTML is a markup language (and not a programming language) used for creating web pages. One may ask what a markup language is. Well a markup language uses tags to create different parts of a document. To better understand this, you must notice when a person reviews a document and marks (underline, highlight) any spelling, grammatical or technical mistakes. At the end of the review, the document will probably have several markups. The same concept applies to a markup language where different tags create the contents of a webpage.
A HTML document contains different parts known as elements. For example, to make some text bold, we use the <b></b> element. Each element can be divided into three parts; Start Tag, Content and End Tag. A tag is a ‘markup’ which is delimited by < and >. The End tag has an additional ‘/’ after <. In the above example, the start tag is <b> and the end tag is </b>. The contents of the element are surrounded by the start and end tags. Some elements (such as new-line break </br>) do not need a closing tag as they have no Content.
Each element can also have attributes. An attribute represents a property of the element. For example, an input element has a type attribute where the type may specify it as button or text box. Attribute values must be delimited in single or double quotes. Attributes are only included in the start tag and are case-insensitive. However, their values can be case-sensitive.
The following listing shows what a typical HTML document looks like:
Listing 1
Now let us explore the above document in greater detail.
!DOCTYPE Declaration
Each HTML Document begins with Document Type Declaration or DOCTYPE. This is a standard defined under HTML rules. The !DOCTYPE defines the version of HTML used by the HTML document. This information is used by web browsers to validate the document’s syntax.
The DOCTYPE instructs the browser to associate a particular Document Type Definition or DTD - which defines set of rules for a markup language – with an HTML document. Typically, a browser consists of a layout engine which performs “switching” to switch over to the particular DTD defined in the DOCTYPE definition. This way, the browser knows precisely which DTD Rules to apply to render the HTML Web Page correctly. Following are the different DOCTYPE definitions supported by HTML 4.01:
HTML 4.01 Strict : This DTD includes standard HTML elements and attributes but does not include presentational elements such as fonts. This DTD does not allow Framesets. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional : This DTD includes standard HTML elements and attributes in addition to presentation elements including fonts. Frameset is not allowed. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset : This DTD is the same as HTML 4.01 Transitional in addition to Frameset support. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
The above are the standard DTD types supported by HTML 4.01. With the release of XTHML (HTML which conforms to XML standards - more on this in my following post), the following additional DTD types have been introduced:
XHTML 1.0 Strict: Similar to its HTML 4.01 Strict counterpart with support for XHTML. The definition is of the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional : Similar to its HTML 4.01 Transitional counterpart with support for XHTML. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset : Again similar to its HTML 4.01 Frameset counterpart with support for XHTML. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.1: Similar to its XHTML 1.0 Strict in addition to allowing adding modules. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
HTML Element
The HTML element is the root element and acts as the parent container for the rest of the elements. The rest of the elements are contained within the start and end tag or the HTML element as shown in Listing 1. The two child elements of the HTML element are discussed in the following paragraphs.
HEAD Element
The HEAD element holds set of different tags which provide page related information. This section is the first part to be loaded in the browser. The HEAD section contains the following elements:
Title : Provides a brief description of the webpage such as ‘HTML Tutorial’ or ‘Welcome to my homepage’
STYLE : This element defines the stylesheet for a webpage. A stylesheet defines the visual layout of a webpage including colors, margins, background etc.
META : META element allows defining information about the document. It is like information about information. It does not describe the contents of he webpage. For example, this information can include the author of the page, page language, date-created etc. This information is in the form of name/value pairs and is also used by Search Engines while indexing the webpage.
SCRIPT :This element allows defining scripts such as JavaScript, VB Script for the webpage.
Amongst the above, only the TITLE element is a visual. The rest are non-visual elements used for information keeping. As mentioned above, the HEAD sections loads first in the browser that’s why you can see the title even before the page is rendered.
BODY Element
The BODY element defines the contents of a webpage. The contents of the webpage may include headings, tables, paragraphs, images, hyperlinks etc. The body may be implemented using the BODY or the FRAMESET element. Framesets are used to divide the webpage into different portions.
What is HTML
Hyper Text Markup Language or HTML is a markup language (and not a programming language) used for creating web pages. One may ask what a markup language is. Well a markup language uses tags to create different parts of a document. To better understand this, you must notice when a person reviews a document and marks (underline, highlight) any spelling, grammatical or technical mistakes. At the end of the review, the document will probably have several markups. The same concept applies to a markup language where different tags create the contents of a webpage.
A HTML document contains different parts known as elements. For example, to make some text bold, we use the <b></b> element. Each element can be divided into three parts; Start Tag, Content and End Tag. A tag is a ‘markup’ which is delimited by < and >. The End tag has an additional ‘/’ after <. In the above example, the start tag is <b> and the end tag is </b>. The contents of the element are surrounded by the start and end tags. Some elements (such as new-line break </br>) do not need a closing tag as they have no Content.
Each element can also have attributes. An attribute represents a property of the element. For example, an input element has a type attribute where the type may specify it as button or text box. Attribute values must be delimited in single or double quotes. Attributes are only included in the start tag and are case-insensitive. However, their values can be case-sensitive.
The following listing shows what a typical HTML document looks like:
Listing 1
<!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>
<title>Untitled Page</title>
</head>
<body>
<h1>HTML Document</h1>
<p>This post talks about a HTML Document</p>
</body>
</html>
Now let us explore the above document in greater detail.
!DOCTYPE Declaration
Each HTML Document begins with Document Type Declaration or DOCTYPE. This is a standard defined under HTML rules. The !DOCTYPE defines the version of HTML used by the HTML document. This information is used by web browsers to validate the document’s syntax.
The DOCTYPE instructs the browser to associate a particular Document Type Definition or DTD - which defines set of rules for a markup language – with an HTML document. Typically, a browser consists of a layout engine which performs “switching” to switch over to the particular DTD defined in the DOCTYPE definition. This way, the browser knows precisely which DTD Rules to apply to render the HTML Web Page correctly. Following are the different DOCTYPE definitions supported by HTML 4.01:
HTML 4.01 Strict : This DTD includes standard HTML elements and attributes but does not include presentational elements such as fonts. This DTD does not allow Framesets. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional : This DTD includes standard HTML elements and attributes in addition to presentation elements including fonts. Frameset is not allowed. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset : This DTD is the same as HTML 4.01 Transitional in addition to Frameset support. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
The above are the standard DTD types supported by HTML 4.01. With the release of XTHML (HTML which conforms to XML standards - more on this in my following post), the following additional DTD types have been introduced:
XHTML 1.0 Strict: Similar to its HTML 4.01 Strict counterpart with support for XHTML. The definition is of the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional : Similar to its HTML 4.01 Transitional counterpart with support for XHTML. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset : Again similar to its HTML 4.01 Frameset counterpart with support for XHTML. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.1: Similar to its XHTML 1.0 Strict in addition to allowing adding modules. The definition takes the following form:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
HTML Element
The HTML element is the root element and acts as the parent container for the rest of the elements. The rest of the elements are contained within the start and end tag or the HTML element as shown in Listing 1. The two child elements of the HTML element are discussed in the following paragraphs.
HEAD Element
The HEAD element holds set of different tags which provide page related information. This section is the first part to be loaded in the browser. The HEAD section contains the following elements:
Title : Provides a brief description of the webpage such as ‘HTML Tutorial’ or ‘Welcome to my homepage’
STYLE : This element defines the stylesheet for a webpage. A stylesheet defines the visual layout of a webpage including colors, margins, background etc.
META : META element allows defining information about the document. It is like information about information. It does not describe the contents of he webpage. For example, this information can include the author of the page, page language, date-created etc. This information is in the form of name/value pairs and is also used by Search Engines while indexing the webpage.
SCRIPT :This element allows defining scripts such as JavaScript, VB Script for the webpage.
Amongst the above, only the TITLE element is a visual. The rest are non-visual elements used for information keeping. As mentioned above, the HEAD sections loads first in the browser that’s why you can see the title even before the page is rendered.
BODY Element
The BODY element defines the contents of a webpage. The contents of the webpage may include headings, tables, paragraphs, images, hyperlinks etc. The body may be implemented using the BODY or the FRAMESET element. Framesets are used to divide the webpage into different portions.
Sunday, January 31, 2010
ASP.NET 4.0 Quick Video Series
If you are interested in learning ASP.NET 4.0 without spending many hours (and money of course :) reading books, then you must follow the ASP.NET 4.0 'Quick Hit' video series at the official ASP.NET site. The link to this series is Video Series.
Hope this helps...
Monday, December 28, 2009
Windows Vista SP2 to the rescue
If you are one of Windows Vista users and have been pulling your hair due to performance issue then you should install Windows Vista SP2 immediately. You can download it from the following link:
Windows Vista SP2
I installed it recently, stopped a few Startup services and have stopped complaining about Vista ever since (Good work Microsoft - a bit late though)
Thursday, December 24, 2009
XCopy and Insufficient Memory Error
Recently I came across an interesting situation pertaining to XCopy so I thought of sharing my experience with you. As part of my daily backup procedure, I use the MS-DOS based XCopy command in a .bat file (scheduled) to copy over a large number of files from one machine to the other. The XCopy command has been working fine ever since until recently I noticed that the entire data was not copied over.
I ran the .bat file manually to see what was going on. After some time, the command window displayed the following message:
Insufficient Memory…
I was using a powerful machine and memory (RAM) was not an issue. After doing some googling, I finally figured out the source of the problem which had nothing to do (at least in my case) with having enough memory. The problem was a long file name which didn’t allow the XCopy command to run to completion. You must be surprised but read on.
The XCopy command fails to handle a fully qualified filename (filename + path) which is greater than 254 characters (which is by the way also the maximum path length allowed by Microsoft OS). The message Insufficient Memory… is very misleading and doesn’t reveal the actual problem.
I went ahead to shorten the name of a few files which fixed the problem. But if this is not the desired solution for you then you can look into using XXCopy (commercial) or Robocopy (free - Microsoft). Although I haven’t used any of these, I have seen some people complaining about XXCopy still not doing the job. Robocopy on the other hand, seem to be a suitable solution. So you can try your luck with that (if you don’t want to shorten the filename :- ).
Stay tuned for more…
Wednesday, October 7, 2009
Back to Work...
Hi Guys,
I have been away from my blog for some while since my schedule kept me occupied. But now I am back and will carry on writing. As a priority, I intend to complete my LINQ Explained series. So stay tuned for more...
Thursday, September 3, 2009
Some Useful Developer Tools
Scott Hanselman has posted some useful developer and power user tools for windows. I thought of sharing this with you. The post can be found here
Tuesday, February 10, 2009
NHibernate Screencast Series
I have found an excellent series of NHibernate screencasts and thought of sharing it with you. The screencasts are located at SummerOfNHibernate. Hope you find them useful.
Tuesday, October 21, 2008
Visual Studio Tips and Tricks
Stephen Walther has got some useful Visual Studio 2008 Tips and Tricks on his blog. You can find the post here.
Monday, October 13, 2008
.NET Framework Survey
Scott Hanselman is hosting a survey about the .NET Framework. You can participate in this survey at the following address:
http://www.hanselman.com/blog/SurveyTimeWhatNETFrameworkFeaturesDoYouUse.aspx
http://www.hanselman.com/blog/SurveyTimeWhatNETFrameworkFeaturesDoYouUse.aspx
New .NET & Architecture blog
I am setting up this blog to share my thoughts, ideas and experiences working as a .NET developer. This blog is not the first of its kind rather a mere addition to what so many geeks are doing around. The .net framework is a power object-oriented technology for rapid application development. Also Microsoft is now geared up focusing on architecture for software development. This combination of sound architecture and the .net framework has brought a world of goodness to the developer community.
I am a web developer working exclusively with the .net framework (and plan to continue working :-). My areas of interest include Web Services, WCF, AJAX and Design Pattern. I hope this blog will help us share information and learn from each other’s knowledge. So stay tuned and see you soon :-.
I am a web developer working exclusively with the .net framework (and plan to continue working :-). My areas of interest include Web Services, WCF, AJAX and Design Pattern. I hope this blog will help us share information and learn from each other’s knowledge. So stay tuned and see you soon :-.
Subscribe to:
Posts (Atom)