Thursday, June 16, 2022

Hack 1. Simplify Your Doc with the Right

 


If there’s an emblem representing the simplicity HTML5 brings to the markup world, it’s the <DOCTYPE> tag. The HTML5 <doctype> tag is easy to use.

When you open an XHTML document the first thing you see, the first line of the document, is a mess:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

The <DOCTYPE> tag of HTML past, inherited from its SGML foundations, consisted of three main components: the tag name, the public identifier string, and the DTD (Document Type Definition) URL. It’s a strange mix of uppercase and lowercase letters, quote marks and slashes, and a URL that brings up an even less readable file. To make it even stranger, the <DOCTYPE> tag is unique, as it is the only HTML tag since HTML 4.01 that is in all caps.

HTML5 says farewell to all that, and keeps it simple:

<!doctype html>

The browser uses the <doctype> to know how to render the web page. Most browsers didn’t download the DTD from the URL, but they did change their behavior based on the <DOCTYPE>. If a browser encountered the preceding code, it would switch to standards mode (as opposed to quirks mode) and apply XHTML transitional formatting.

Given all that, how can HTML5 get away with a basic <doctype> such as html? The simple answer is that the new <doctype> is a “simple answer.” The new <doctype> was made to trigger a simplified approach to document rendering, not to meet old expectations. Browser makers reached a consensus on how browser-specific functionality should be handled, so there is no need for “quirks mode” page rendering. If all browsers render in a standard manner, the DTD is unnecessary; thus a simple declaration of html states that the browser should set aside any DTD and simply render the page.

HTML5 is a simplified version of HTML. The tags are less complex, the features are less complex, and most importantly, the rules are less complex.

However, in most applications you write, you will not yet be servicing a user base that consistently supports HTML5. So how can you switch between <doctype>s when the <doctype> is supposed to be the first line of the document? This doesn’t leave much room for JavaScript trickery or fancy hacks. Well, good news; there is a backward-compatible HTML5 <doctype> as well:

<!DOCTYPE html>

“But wait,” you say. “Isn’t that the same simple <doctype> presented earlier?” Yes, it is! The only key difference is that “doctype” is now in all caps. The HTML5 specification states that the <doctype> is case-insensitive; however, previous versions of HTML require an all-caps version of the <doctype>. You will find that much of HTML5 is backward-compatible with earlier versions. The vast majority of browsers on the market today will see the new <doctype> and recognize it as simply being “standards mode” for page rendering.

Using the backward-compatible version of the <doctype> will allow you to start using HTML5 today, while continuing to support browsers of the past!



SHARE THIS

Author:

urdufundastory.blogspot.com is the first of its kind of trendsetting venture existent in Pakistan. It is for the first time in the history of this nation that a large scale project of such nature, evolved from an extraordinarily revolutionizing concept to a practical fulfillment.

0 Comments: