studiobast logo    TOOLS FOR STUDENTS


GrabIt Info - Doctype and Meta Tags

 

 

About Doctypes

 

Doctypes tell a browser which version of HTML to use in showing a web page, and tell a validator how to check the document's syntax. Doctypes have specific formatting - use it.

 

Strict: Deprecated elements and attributes (including most presentational attributes), frames, and link targets are not allowed. Very fun (Not!) for validating.

 

Transitional: Allows presentational attributes, deprecated elements, and link targets.

 

Frameset: For frames.

 

Quirks: Allows deviations and latitude for pages authored in the 190s, early IE, etc.

 

HTML5: For HTML 5 pages, entering standard use.

 

We're using TRANSITIONAL for most of this class.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

 

 

 

About Standard Character Set

 

A commonly used character set is the Unicode, UTF-8, which covers all the characters, punctuations, and symbols in the world. We will use this since it will be the set chartype for HTML5.

 

ISO-8859-1 is the another common character set, and contains the characters used in Western European countries and some commonly used special characters.

 

We are using UTF-8

 

<meta http-equiv="content-type" content="text/html;charset=utf-8" />

 

 

 

About Standard Meta Tags

 

Metatags are used to store information about a web page, such as what program was used to create the page, a description of the page, and keywords that are relevant to the page. Many search engines use the information stored in meta tags when they index Web pages. Many are now irrelevant due to seo and robot.txt files.

 

Basic Metatags:


<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<meta http-equiv="content-style-type" content="text/css" />

<meta name="author" content="YourName" />
<meta name="copyright" content="YourName or Company " />
<meta name="description" content="Web design and development, YourName." />
<meta name="keywords" content="web design, xhtml, web page, pick some relevant words " />

 

 

About Page Intro Comments

 

You can make your life easier by adding a few HTML comments to the beginning of your web page. This allows you to give yourself hints for how to log into your webhost, where your actual live web page is, and where to validate your code.


<!-- FTP: edison.seattlecentral.edu Login:yourlogin - STOP USING before real client work to preserve FTP Security-->
<!-- http://edison.seattlecentral.edu/~yourlogin/web110/ -->

<!-- To validate - http://validator.w3.org/#validate_by_input -->

 

@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@

 

 

HTML 5 Doctype

 

<!doctype html> <!-- new and simplified -->
<html> <!-- simplified -->
<head>
<meta charset=”utf-8” /> <!-- new and simplified, must be right after <head> opening tag -->
<!--Other meta tags -->
<title>Page Title</title>
</head>

<body>

</body>

</html>

 

@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@

 

Frames Doctype

 

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">