Lesson 2 – What is Doctype and Basic usage of tag
- At August 4, 2012
- By G. M. Shaharia Azam
- In Blog, HTML, Tutorial & Tips, Web Development
1
Every HTML page needs it’s own document type declaration. DOCTYPE tells that which syntax suits for this HTML page. So it is very much important to choose right doctype for your page.
|
1 2 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
The above Doctype is being used more commonly. This tell that your HTML document is?HTML 4.01 Strict.?For HTML5 the doctype will be just?<!DOCTYPE>
|
1 |
<!DOCTYPE> |
So it’s a very much important things to wok with HTML page. This Doctype must be inserted before starting <html> tag. See the example below
|
1 2 3 4 5 6 7 8 9 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title></title> </head> <body> </body> </html> |
Be aware that never use Doctype without know about it. So try to use the first Doctype code in your HTML page which is given in first in this page.
Sometimes somebody may tell that <head> tag is not important. But remember that <head> is very much important and undoubtedly serious stuff in HTML page. It tells the way of representation and it does all the basic work before showing the content of your HTML page. <head> tag represent?HTML document, including meta information, page title, links to other documents, and index information and many more.. Even it has a great value for better on-page Search Engine Optimization.
<head></head> must be placed before starting <body> tag.
See a basic usage of <head> tag and it’s explanation:
|
1 2 3 4 5 |
<head> <title>My Home Page</title> <link rel=home href="/tags/index.html"> <meta name=AUTHOR content="Ben Hall"> </head> |
In the above code <title> represent the Title of your page. When you browse any website then you can see that website’s title in top corner of your browser.
In the above image you are see ‘Preview ICT – Next Generatio….’ in your chrome browser if you type http://www.previewict.com. This is the title. It is so much important to choose short & effective title because most of the search engine know the value of your page on title.
<meta> tag inside <head> tag represent few important things. In the above code bloc you are see <meta name=”Author” content=”benn Ali”> it tells that the author of this page is Benn. I hope you got the idea. Also to include stylesheet, javascript for your html page it is necessary to know about <head> tag.
To add stylesheet for your HTML page- (Add external .css file)
|
1 2 3 |
<head> <link rel="stylesheet" type="text/css" href="style.css" /> </head> |
To add inline css in <head> tag
|
1 2 3 4 5 6 |
<head> <style type="text/css"> hr {color:black;} p {margin-left:5px;} </style> </head> |
Also inside the <head> tag your all JavaScript and CSS will be placed for your HTML page. So undoubtedly it is so much essential. I will describe how to add Javascript & CSS inside <head> tag in Javascript & CSS lessons.
- Next lesson: Test
- Previous lesson: Getting started with HTML
Sample Doctype of HTML and XHTML
Few sample doctype of HTML and XHTML
HTML 2.0
|
1 2 3 4 |
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0 Level 2//EN"> <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN"> <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML Level 2//EN"> |
HTML 3.0
|
1 |
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3.0//EN"> |
HTML 3.2
|
1 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"> |
HTML 4.01 Strict
|
1 2 3 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
HTML 4.01 Frameset
|
1 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> |
XHTML 1.0 Strict
|
1 2 3 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
XHTML 1.0 Frameset
|
1 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> |
XHTML 1.1
|
1 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"> |
XHTML 2.0
|
1 |
<DOCTYPE html PUBLIC "-//W3C//DTD XHTML 2.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml2.dtd"> |
Lesson – 1 : Getting started with HTML
- At August 2, 2012
- By G. M. Shaharia Azam
- In HTML, Tutorial, Web Development
- 1
Now a days web development is a buzzing word. And numerous people are searching for learning HTML. See the trends of tutorial and html?.
That’s why I want to write some tutorial about HTML.
To start writing HTML code you should basically know few HTML tag (i.e: <html><head><title><body>)
To design any HTML page you should follow the basic structure of a html page. Like follow:
|
1 2 3 4 5 6 7 8 |
<html> <head> <title>Website of Shaharia Azam</title> </head> <body> This is the main body of your HTML page. </body> </html> |
This is the most basic HTML structure of a HTML page.
Next Lesson » What is Doctype & basic usage of <head> tags
Add RSS feed into HTML page
- At December 12, 2010
- By G. M. Shaharia Azam
- In Blog, HTML, Tutorial, Web Development
- 2
Inserting RSS feed into any HTML page is sometimes necessary and it can make your site more informative.
To add RSS feed inro your HTML page please go to http://rssxpress.ukoln.ac.uk
And place your RSS feed URL here then they will generate a code. Just place this code into your HTML page where you want to show the feed. And have fun!!!! It’s easy.
Thanks