HTML is a simple markup language used to create documents designed to be accessed across the World Wide Web using browser software such as Internet Explorer or Firefox. The current version of HTML is known as XHTML, a stricter, rationalised version of the original HTML specification. One key fact to note about HTML and XHTML pages is that they describe the content and structure of the page rather than the position and presentation of the elements on the page.
The first significant difference between an HTML and XHTML page is the document type definition. There are several ways in which this specification can be done in Adobe Dreamweaver. One of the most convenient is to go to the Modify menu and choose Page Properties. Here, in the category marked Title/Encoding, one of the options reads Document Type (DTD).
There are a good few options available in the drop-down menu next to this setting, some relating to HTML version 4 and some to XHTML version 1. These DTD settings control the rules for the mark-up language so that the browsers can render the content correctly. For any new content you are creating, the best specification to choose is XHTML 1.0 transitional since it uses the current XHTML specification while allowing backward compatibility with slightly older browsers.
When looking at an HTML page, the structural content may not be immediately apparent. However Dreamweaver provides a number of useful tools for keeping tabs on the structure of your web page content. One of these is called the Tag Selector. Wherever the cursor is positioned, the HTML code relating to that part of the page is displayed in the bottom left of the page on the Status Bar in an area known as the Tag Selector.
When the browser reads the page, the tags surrounding text and other elements tell the browser the structural importance of each element. The H1 tag tells the browser that a piece of text is a major heading. The H2 tag signifies a sub-heading, and so on. As these tags are displayed in the Tag Selector, you can get an idea of the structure of the page and you can also click on the tags to select the element they contain.
Although the tags tell the browser the structural importance of each element, the HTML page doesn't contain any information that helps the browser decide how each element should be displayed. This is the role of CSS (Cascading Style Sheets). An XHTML page is pretty similar to an HTML page. However, its syntax is stricter. Let's take a look at some examples...
One example of this difference is that XHTML is case sensitive while HTML is not. In XHTML, all tags are lowercase so the H1 tag has to be written h1. In HTML, h1 or H1 can be used.
In XHTML, the closing tag cannot be ommitted: in HTML it is permissible to have an opening tag without a closing tag. One example of this is a horizontal rule (hr) which creates a dividing line between two sections on a webpage. This element is traditionally represented by a single tag, since it can never be used as a container. In XHTML, there is a special syntax for such elements: a single tag which serves as both an opening and closing tag (hr/). In HTML, a single opening tag is used with no closing tag (hr).
In summary, XHTML is the current version of HTML and this is the standard that you should use for any new projects. However, existing projects that you may inherit may well contain HTML rather the XHTML. Therefore, you should be aware of both. Remember also that HTML and XHTML describe only the structure of web page content: neither of them should contain information regarding the presentation and display of this content. The display and presentation of web content should be done using CSS.
The first significant difference between an HTML and XHTML page is the document type definition. There are several ways in which this specification can be done in Adobe Dreamweaver. One of the most convenient is to go to the Modify menu and choose Page Properties. Here, in the category marked Title/Encoding, one of the options reads Document Type (DTD).
There are a good few options available in the drop-down menu next to this setting, some relating to HTML version 4 and some to XHTML version 1. These DTD settings control the rules for the mark-up language so that the browsers can render the content correctly. For any new content you are creating, the best specification to choose is XHTML 1.0 transitional since it uses the current XHTML specification while allowing backward compatibility with slightly older browsers.
When looking at an HTML page, the structural content may not be immediately apparent. However Dreamweaver provides a number of useful tools for keeping tabs on the structure of your web page content. One of these is called the Tag Selector. Wherever the cursor is positioned, the HTML code relating to that part of the page is displayed in the bottom left of the page on the Status Bar in an area known as the Tag Selector.
When the browser reads the page, the tags surrounding text and other elements tell the browser the structural importance of each element. The H1 tag tells the browser that a piece of text is a major heading. The H2 tag signifies a sub-heading, and so on. As these tags are displayed in the Tag Selector, you can get an idea of the structure of the page and you can also click on the tags to select the element they contain.
Although the tags tell the browser the structural importance of each element, the HTML page doesn't contain any information that helps the browser decide how each element should be displayed. This is the role of CSS (Cascading Style Sheets). An XHTML page is pretty similar to an HTML page. However, its syntax is stricter. Let's take a look at some examples...
One example of this difference is that XHTML is case sensitive while HTML is not. In XHTML, all tags are lowercase so the H1 tag has to be written h1. In HTML, h1 or H1 can be used.
In XHTML, the closing tag cannot be ommitted: in HTML it is permissible to have an opening tag without a closing tag. One example of this is a horizontal rule (hr) which creates a dividing line between two sections on a webpage. This element is traditionally represented by a single tag, since it can never be used as a container. In XHTML, there is a special syntax for such elements: a single tag which serves as both an opening and closing tag (hr/). In HTML, a single opening tag is used with no closing tag (hr).
In summary, XHTML is the current version of HTML and this is the standard that you should use for any new projects. However, existing projects that you may inherit may well contain HTML rather the XHTML. Therefore, you should be aware of both. Remember also that HTML and XHTML describe only the structure of web page content: neither of them should contain information regarding the presentation and display of this content. The display and presentation of web content should be done using CSS.
About the Author:
The author is a training consultant with Macresource Computer Solutions, an independent computer training company offering Adobe Dreamweaver training courses in London and throughout the UK.
No comments:
Post a Comment