Lesson 6C - META Tags/DTD

META tags add information in the HEAD section of the file. The browser reads META information and processes it without displaying anything on the screen. This information is used to identify styles and scripts, label authors, copyright, describe page contents, control where the page is displayed and the like. Search engines use META information to locate pages. For all these reasons, it is a good idea to use META tags on your pages.

There are three attributes for META tags--http-equiv, name and content. Here is a link to a page that describes all the different META tags. Try it

Here are the META tags we used for the pages in this course:

<meta name="keywords" content="HTML, CSS"> If a search engine is asked to find web pages, it looks for certain "keywords". If you list the keywords you think apply to your page, it makes the search engine's job easier to find you.
<meta name="description" content="HTML/CSS tutorial"> Once the search engine finds you (and thousands of other pages), it tries to write a description of each page for the viewer's benefit. It will copy the first few lines of text of each page unless a page has this META tag, which provides its own description.
<META NAME="author" CONTENT="Bill Sanders"> This META tag helps an engine do an 'author' search. Note that uppercase/lowercase of the tag name does not effect a META tag.
<META NAME="copyright" CONTENT="©2017, by Bill Sanders"> So far, this will not establish a legitimate copyright, but most of the rest of the world doesn't know that, and this might scare them enough to give you credit for your work. In addition, some day it might establish a copyright, who knows?
<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> This is a moderate protection against hackers. This META tag forces the ISO-8859-1 character set, which doesn't allow hackers to insert their own special characters into your links/form submissions/etc that can do harm to your server or the client's computer.
<META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript"> This tells the browser what the default scripting language is. In this case, if we used <script></script> tags, and did not give a language or type attribute, the browser would assume JavaScript.
<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css"> This tells the browser that Cascading Style Sheets are the default style used.
<META HTTP-EQUIV="Window-target" CONTENT="_top"> This tells the browser to open this web page on the top of whatever window it is in. This prevents this page from opening in Frames.
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache"> This tells the browser to not cache this web page. In other words, you should not have to hit "refresh" on a page with this tag since it is refreshed every time it is called.

Add all of them to your sample.htm file. Change the content to suit your page.

You can use Meta tags to redirect viewers to another page. (try it)

Document Type Definition (DTD) tags are an advanced aspect of HTML programming. They tell the browser what version of HTML was used for the design of this page, and show the browser where to find the Definitions of every tag/attribute/default setting/etc.

If you make a page, and three years from now we are on our fourth revision of HTML since, and your page hasn't been revised in all that time, the browsers will know your page might have older/deprecated commands. In addition, browsers currently recognize framesets, XHTML, XML and a few others, and will likely recognize more languages in the future. DTD tags tell the browser what language to expect. The default is HTML.

Browsers will assume a generic DTD if you do not specify one, so you can get by without stating anything, but your page may not display properly in the future. DTD tags are placed before the <html> tag at the beginning of the file, and look something like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

This tag tells the computer that this document type is HTML Public (as compared to military or government), W3C (World Wide Web Consortium) based, Document Type Definition, HTML version 4.01, Transitional (which means some deprecated tags may still be used, as compared to 'Strict', which means no deprecated tags are used), english language. The DTD coding can be found at "http://www.w3.org/TR/html4/loose.dtd". Don't try to memorize all this, it is not important to know anything more than HTML 4.01. To see this DTD, go to the W3C DTD page. There you will see the definition of every tag.

If you click on File in HTML-Kit, then select "New Document", a DTD tag will be generated for you. Try it.

Insert the above DTD into your sample.htm file.


In this lesson, you learned about these tags:

<meta>
<!DOCTYPE>
By now, your sample.htm file should look like this. Remember you will not see META tags on the screen.
For more information on the topics of this Lesson, see this site or this site for !doctype, or this site for meta.
Here's a handy META tag generating tool.

Lesson 6B View Source   < <  PREVIOUS   Table of Contents NEXT  > >   Lesson 7 Colors

Developed with HTML-Kit
Sandersongs Web Tutorials
Contact the Webmasterwith comments.
©2017, by Bill Sanders, all rights reserved.
This domain had 3,935 different visits in the last 30 days.
435,410 hits on this domain since 24 Nov 2006.
http://sandersongs.com/HTMLcourse/Lesson06C.php
This page was last modified on our server on 26 Sep 2013
and last refreshed on our server at 12:18 pm, MST
This file took 0.02398 seconds to process.