http://www.insidegeek.ca - In this tutorial we will be going over how to declare a DOCTYPE for your website. A DOCTYPE is used to tell the web browser and web validation services what type of coding is used on your page and what to validate it against. Distributed by Tubemogul.


More DIY videos at 5min.com

Video Transcription

(Music playing) Inside Geek Canada is a proud member of the Tech Podcast Network. If it is Tech, it is here. For other great shows, please visit techpodcasts.com Hello everyone and thank you for tuning in Inside Geek Canada. My name is Evan Thies, and today’s are application tech feature. Now, I am going to be talking about DOCTYPE Declaration. And DOCTYPEs are basically what you use when you first start building a website. Basically, a DOCTYPE is declaring what kind of coding you are going to be using, whether that the XHTML or HTML and whether it be strict or transitional or frames. A lot of webmasters in the early age do not really do DOCTYPEs because they do not really know about them or what they are used for, so I am just go over the basic principles of writing a DOCTYPE and I have Dreamweaver open here but any text editor or HTML editor will work for this. I am just going to show you some good practices you can use that are standards compliant that you can just use to declare you DOCTOTYPE and your encoding, and they will just help your website render and more browsers and it will make it easier on the browser so we can understand how you did your coding. So let us go through this tutorial. Okay, I am in Dreamweaver here. But as I said before, any HTML editor will work for this. So I am going to command or control on the PC and open a document that I have already prepared for this, and that document for me is called doctype.html. I am just going to open that, and I am going to explain basically what I have said up here. So from the top, by the opening HTML tag, the head tag and so the head tag is a title tag. The body tag, inside the body tag is a paragraph tag with a brief paragraph and then the closing elements of each of this, things like the head tag is closed and body tag and HTML tag. If you have ever dealt with HTML in the past, you know the – basically closed every tag you open and that is basically what has been done here. Now, a lot of tutorials I have seen have basically to show on this as a final tutorial and that is the basic page for HTML or web coding, which is technically incorrect because I have not declared any encoding or DOCTYPE declaration standards. So like here, you have the DOCTYPE copy so if I pasted here. You will see basically, this is what you are acquired to do when you are setting up a document is to clear the DOCTYPE. And if you see here, it says, DOCTYPE html Public, and then it says, Document type declaration is XHTML 1.0 strict and it is in English. And then the next space is the link that it provides to the document type declaration webpage or they can go to see all the elements and tags listed for what standards that it should be validated against. Now, I also want to take a look at the HTML tag because I am working in XHTML 1.0 strict, which is more a personal preference because I believe in XHTML more than I do in the older HTML. So because of this, I have to modify the HTML tags slightly. So I type xmlns=http:// -- that basically right there is giving at the name space and the name space is essentially associates all the elements and attributes with the XHTML standard. It was kind of confusing but that is basically necessary to be part of the XML form factor. It is also good here just to declare a couple of language settings. So here, I am going to set the xml language or did just xml:lang=, and then of course, my page is going to be English. And then here, you can also declare the language for the entire page. It is going to be coded in, and that is also English. So that just gives you a more complete view of the XHTML on the page and kind of what encoding and language you are going to find on the page. In the head tag, I would also recommend including a meta tag that basically declares the character set and encoding type, so it is easier for the browsers to know what kind of encoding you use on your document. So we can just go up here and do this in the head section. So if you type meta http-equiv=, and here, you can just type, content-type, end quote, and space and, content