Monthly Archives: July 2014

HTML, HTML5 : What does DOCTYPE mean?

A document type declaration, or DOCTYPE, is an instruction that associates a particular SGML or XML document (for example, a webpage) with a document type definition (DTD) (for example, the formal definition of a particular version of HTML). In the serialized form of the document, it manifests as a short string of markup that conforms to a particular syntax.

The HTML layout engines in modern web browsers perform DOCTYPE “sniffing” or “switching”, wherein the DOCTYPE in a document served as text/html determines a layout mode, such as “quirks mode” or “standards mode”. The text/html serialization of HTML5, which is not SGML-based, uses the DOCTYPE only for mode selection. Since web browsers are implemented with special-purpose HTML parsers, rather than general-purpose DTD-based parsers, they don’t use DTDs and will never access them even if a URL is provided. The DOCTYPE is retained in HTML5 as a “mostly useless, but required” header only to trigger “standards mode” in common browsers.

Why do I want to use it?

The term DOCTYPE tells the browser which type of HTML is used on a webpage. In turn, the browsers use DOCTYPE to determine how to render a page. Failing to use DOCTYPE or using a wrong DOCTYPE may load your page in Quirks Mode. See example:

 Declaring that the document contains HTML5 Markup

The doctype for HTML5 is very simple. To indicate that your HTML content uses HTML5, simply use:

Doing so will cause even browsers that don’t presently support HTML5 to enter into standards mode, which means that they’ll interpret the long-established parts of HTML in an HTML5-compliant way while ignoring the new features of HTML5 they don’t support.

This is much simpler than the former doctypes, and shorter, making it easier to remember and reducing the amount of bytes that must be downloaded.

Cheers..:)

Google Image Search API With PHP

Hey there,

For One of my Online Service, I wanted to provide some image results apart from my real output. So I had to search for any of the Image search API with PHP. But I didn’t get any proper solution for my requirement. Finally I’ve modified one of the Image API URL (Eg. https://www.google.com/uds/GimageSearch?rsz=8&q=sachin+tendulkar&v=1.0&start=0&imgsz=small) which I got after in depth searching. The PHP Source is really small & simple. In PHP code, I’ve used

function to read JSON response returned from the Image search API &

function (with second parameter set to true) converts the JSON string into array. You can process this final array according to your requirement.

Click Here for Live Demo & Source Code

GitHub Repository

Hope it’ll be useful for you. Share it. Cheers..:)

How to test whether an element is hidden using jQuery?

Hey there,

The below code helps you to test if an element is visible or hidden using jQuery.

For all elements,

You can use the hidden selector:

And the visible selector:

Enjoy Coding..Cheers..:)

PHP How to remove numbers from string?

Hey there,

While parsing any document (HTML, XML or aything!), You might have involved in a stage where you would need to remove numeric values (numbers) from the string. PHP has some useful function which will make this easy as butter..:)

The above PHP code makes use of the functions range(), str_replace(), trim().

range() : Create an array containing a range of elements

str_replace() : Replace all occurrences of the search string with the replacement string

trim() : Strip whitespace (or other characters) from the beginning and end of a string

That’s all. Share it..Enjoy Coding..Cheers..:)