Dynamic HTML Overview
Updated September 30, 1997
Web authors today face significant challenges when making their Web pages interactive. The static nature of HTML pages limits their creative choices, and interactive components can be difficult to build and reuse. In addition, using proprietary extensions means authoring browser-specific Web pages.
Microsoft® Dynamic HTML technology helps to remove these barriers for content providers and offers users more engaging and interactive Web pages. Dynamic HTML provides authors with enhanced creative control so they can manipulate any page element at any time. Dynamic HTML is also the easiest way to make Web pages interactive, using open, standards-based technologies. Microsoft is working with the World Wide Web Consortium (W3C) to help ensure interoperability and support for users on multiple systems with different browsers.
Total Creative Control for an Immediate User Experience
Making simple updates, such as changing the color of text after a Web page loads, traditionally has meant reloading the page. These limitations have slowed the user experience and have impeded interactivity on the Web.
Microsoft's Dynamic HTML takes interactivity to the next level. Pages authored with Dynamic HTML come alive, with every element in the page being truly dynamic. Whether the page has loaded already, content providers can change any element of the page—text or graphics—without a round-trip to the server. This increased control and flexibility result in more compelling sites. For users, the Web experience becomes more responsive.
Key features of Dynamic HTML include these:
- Document Object Model (DOM). Dynamic HTML provides a comprehensive object model for HTML. This model exposes all page elements as objects. These objects can easily be manipulated, by changing their attributes or applying methods to them at any time. Dynamic HTML also provides full support for keyboard and mouse events on all page elements. Support for the Document Object Model enables the following:
- Dynamic content. Text or graphics can be added, deleted, or modified on the fly. For example, a Web page can display an updated headline, without refreshing the page. The text surrounding the headline will reflow automatically.
- Dynamic styles. Internet Explorer 4.0 fully supports Cascading Style Sheets (CSS). As such, any CSS attribute, including color and font, can be updated without a server round-trip. For instance, text can change color or size when a mouse pointer passes over it. Multimedia filters and transition effects can be applied to HTML elements simply by adding the filter CSS attribute.
- Absolute positioning. CSS positioning coordinates for existing page content can be updated at any time to create animated effects, without reloading the page.
- Data Binding. Data-driven application front ends can be built that present, manipulate (e.g., sort, filter), and update data on the client without numerous round-trips to the server.
- Scriptlets. A scriptlet is a Web page, authored with Dynamic HTML, which content providers can use as a component in their Web applications. With scriptlets, content providers can author content once, then easily reuse the content in other Web pages or applications.
The Easiest Way to Make Pages Interactive
Adding dynamic behavior to Web pages formerly required writing complex applets or controls, and incorporating them in Web pages using scripts. Although these components perform useful tasks, many authors found them hard to develop compared with scripts or HTML.
Web builders can easily reuse Dynamic HTML-based content through support for scriptlets in Microsoft Internet Explorer 4.0, using just HTML and script.
Dynamic HTML can be authored today using tools from third parties, including Bluestone Inc., ExperTelligence Inc., Pictorius Inc., and SoftQuad Inc., as well as Microsoft FrontPage 98.
Using proprietary extensions in Web pages invariably means that some users cannot fully experience these pages. To avoid this situation, authors either forgo these extensions altogether or develop separate pages for competitive browsers.
Microsoft Dynamic HTML is based on the Document Object Model proposed to the W3C by Microsoft and SoftQuad, and closely follows the W3C preliminary requirements for the Document Object Model.
Microsoft is committed to following the standards process with Dynamic HTML and any resulting recommendation. Dynamic HTML complies with the following:
- HTML 4.0 Working Draft
- CSS1 Recommendation
- CSS Positioning Working Draft
- Preliminary version of the Document Object Model requirements document
Dynamic Content with a Broad Reach
A standards-based approach enables content providers to create interactive pages that reach a broad audience. At a base level, content providers can take advantage of standards-based features, such as CSS and CSS Positioning, that are implemented in today's popular browsers. This ensures that a majority of users, regardless of the browser they are using, have the same Web experience.
Web authors can also create a single set of pages authored with Dynamic HTML for all users. Users with any browser supporting the Document Object Model, such as Microsoft Internet Explorer 4.0, can fully interact with these pages. Other browser users, such as those running Netscape Navigator, could view much of this content statically, because Dynamic HTML uses standard HTML tags to render content. For instance, an interactive table of contents could expand and contract using Microsoft Internet Explorer 4.0. In a non-dynamic browser, the table would display in a fully expanded state.
In some cases, content providers may decide to author separate sets of pages and take advantage of specific browser capabilities to ensure a truly engaging, rich experience. Dynamic HTML will be featured in all versions of Microsoft Internet Explorer 4.0, including versions for the Windows® operating system and for the Macintosh and UNIX platforms. Microsoft's implementation of Dynamic HTML will also be available free of charge as a component for third-party use.