HTML DHTML Projects

HTML and DHTML

Dynamic HTML is a collective term for a combination of new Hypertext Markup Language (HTML) tags and options, that will let you create Web pages more animated and more responsive to user interaction than previous versions of HTML. Much of dynamic HTML is specified in HTML 4.0. Simple examples of dynamic HTML pages would include (1) having the color of a text heading change when a user passes a mouse over it or (2) allowing a user to "drag and drop" an image to another place on a Web page. Dynamic HTML can allow Web documents to look and act like desktop applications or multimedia productions.

The features that constitute dynamic HTML are included in Netscape Communications' latest Web browser, Navigator 4.0 (part of Netscape's Communicator suite), and by Microsoft's browser, Internet Explorer 4.0. While HTML 4.0 is supported by both Netscape and Microsoft browsers, some additional capabilities are supported by only one of the browsers. The biggest obstacle to the use of dynamic HTML is that, since many users are still using older browsers, a Web site must create two versions of each site and serve the pages appropriate to each user's browser version.

Both Netscape and Microsoft support an object-oriented view of a Web page and its elements Cascading style sheets and the layering of content Programming that can address all or most page elements.

Each page element (division or section, heading, paragraph, image, list, and so forth) is viewed as an "object." (Microsoft calls this the "Dynamic HTML Object Model." Netscape calls it the "HTML Object Model." W3C calls it the "Document Object Model.") For example, each heading on a page can be named, given attributes of text style and color, and addressed by name in a small progam or "script" included on the page. This heading or any other element on the page can be changed as the result of a specified event such a mouse passing over or being clicked or a time elapsing. Or an image can be moved from one place to another by "dragging and dropping" the image object with the mouse. (These event possibilities can be viewed as the reaction capabilities of the element or object.) Any change takes place immediately (since all variations of all elements or objects have been sent as part of the same page from the Web server that sent the page). Thus, variations can be thought of as different properties of the object.
Not only can element variations change text wording or color, but everything contained within a heading object can be replaced with new content that includes different or additional HTML as well as different text. Microsoft calls this the "Text Range technology."

Style Sheets and Layering
A describes the default style characteristics (including the page layout and font type style and size for text elements such as headings and body text) of a document or a portion of a document. For Web pages, a style sheet also describes the default background color or image, hypertext link colors, and possibly the content of page. Style sheets help ensure consistency across all or a group of pages in a document or a Web site.
Dynamic HTML includes the capability to specify style sheets in a "cascading style sheet" fashion (that is, linking to or specifying different style sheets or style statements with predefined levels of precedence within the same or a set of related pages). As the result of user interaction, a new style sheet can be made applicable and result in a change of appearance of the Web page. You can have multiple layers of style sheet within a page, a style sheet within a style sheet within a style sheet. A new style sheet may only vary one element from the style sheet above it.

Layering is the use of alternate style sheets or other approaches to vary the content of a page by providing content layers that can overlay (and replace or superimpose on) existing content sections. Layers can be programmed to appear as part of a timed presentation or as the result of user interaction. In Internet Explorer 4.0, Microsoft implements layers through style sheets. Netscape supports the style sheet approach but also offers a new HTML ... tag set (that Microsoft does not support). Both approaches are being considered by the W3C Working Committee and both companies say they will support whatever W3C decides will be the recommended approach.

Programming

Although JavaScript, Java applet, and ActiveX controls were present in previous levels of Web pages, dynamic HTML implies an increased amount of programming in Web pages since more elements of a page can be addressed by a program.

Netscape includes dynamic fonts as part of dynamic HTML. This feature of Netscape's Navigator browser in its Communicator suite lets Web page designers include font files containing specific font styles, sizes, and colors as part of a Web page and to have the fonts downloaded with the page. That is, the font choice no longer is dependent on what the browser provides.