1. Describe !DOCTYPE
DOCTYPE tells the browser what version of HTML the current page is written in. Without !DOCTYPE declaration, the browser will display the webpage in Quirks Mode. Below are the different DOCTYPE declaration and differences:
HTML 4.0.1
(1) HTML 4.0.1 Strict
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Include all elements but : no presentational or deprecated elements, no frameset
(2) HTML 4.0.1 Transitional
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Include all elements but : no frameset
(3) HTML 4.0.1 Frameset
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
Equals to html 4.0.1 Transitional + frameset
XHTML 1.0 (mark up must be well-formed XML)
(4) XHTML 1.0 Strict
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Include all elements but : no presentational or deprecated elements, no frameset
(5) XHTML 1.0 Transitional
<
!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Include all elements but : no frameset
(6) XHTML 1.0 Frameset
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Equals to XHTML 1.0 Transitional + frameset
(7) XHTML 1.1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Equals to XHTML 1.0 Strict + modules
(8) HTML 5
<!DOCTYPE HTML>
P.S: HTML 4.0.1 and XHTML are under SGML, while HTML 5 is independent. The structure looks like this:
SGML HTML 5
|
-----------------------
| |
XML HTML
|
XHTML
2. How do you determine the browser version before page load?
By parsing the request header. The structure of HTTP request is as follow:
Check http://en.wikipedia.org/wiki/List_of_HTTP_header_fields for details of all fields.
3. How to reduce page loading time?
(1) Reduce the times of request (file concatenation, reduce frameset, reduce lookup, etc.)
(2) Reduce the sizes of transmission (file compression, encoding, etc. )
(3) Put CSS at top and Scripts at bottom or in external files to let the page load first.
(4) Caching
(5) AJAX (Asynchronous transmission)