_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition1  Wiley and the book authors, 2002 Web Design in a Nutshell Chapter 9: Structural HTML Tags

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition2  Wiley and the book authors, 2002 Summary   Setting up an HTML document  The document type declaration  Elements of the document header  Background graphics  Adjusting browser margins  Using tags

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition3  Wiley and the book authors, 2002 Synopsis This chapter looks at the subset of HTML tags that are used primarily to give the document structure It will also discuss tags that are used for providing information about the document and those used for controlling its appearance or function on a global level

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition4  Wiley and the book authors, 2002 The tag defines the beginning and end of the document body (that which appears in the browser window) Attributes of the tag affect the entire document  alink=“#rrggbb” or color name (deprecated): the color while the mouse is held down over a link during a click  background=“url” (deprecated): URL to a graphic to be used as the tiling background of the document  bgcolor=“#rrggbb” (deprecated): sets the color of the background for the document  link=“#rrggbb” (deprecated): sets the default color for all links  text=“#rrggbb” (deprecated): sets the default color for all non-link text  vlink=“#rrggbb” (deprecated): sets the color of the visited links  bgproperties=“fixed” (IE & N7+): when set to fixed, the background image does not scroll with the document content

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition5  Wiley and the book authors, 2002 The tag defines the portion of the document that contains information about the document. The tag has no directly displayed content, but serves only as a container for the other header tags, such as,, and  No currently supported attributes

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition6  Wiley and the book authors, 2002 The tag is placed at the beginning and end of the document. This tag tells the browser that the entire document is composed in HTML  dir=“[ltr|rtl]”: indicated whether the direction of the text should be displayed from left-to-right (default) or right-to-left  lang=“language code”: indicated the primary language of the document  version=“-//W3C//DTD HTML 4.01//EN” (deprecated): specifies the version of HTML the document uses. Use the SGML construct instead

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition7  Wiley and the book authors, 2002 The tag provides additional information about the document It is commonly used for making documents searchable (by adding keywords) or to specify the character set for a document  content=“text” (required): specifies the value of the meta tag property and is always used in conjunction with name= or http-equiv=  http-equiv=“text”: the specified information is treated as though it were included in the HTTP header hat the server sends ahead of the document. It is used in conjunction with the content attribute (in place of the name attribute)  name=“text”: specifies a name for the meta information property  scheme=“text”: provides additional information for the interpretation of meta data

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition8  Wiley and the book authors, 2002 The tag specifies the title of the document The title generally appears in the top bar of the browser window According to the HTML 4.01 specification, all documents must contain a meaningful within the of the document

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition9  Wiley and the book authors, 2002 Setting up an HTML document The standard skeletal structure of an HTML document according to the W3C is as follows: <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “ Document Title Contents of document

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition10  Wiley and the book authors, 2002 The document type declaration In order to be valid, an HTML document needs to begin with a document type declaration that identifies the version of HTML, each defined by a distinct document type definition (DTD) located on the W3C’s server  Strict:  <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “  Transitional:  <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “  Frameset:  <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN” “

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition11  Wiley and the book authors, 2002 Elements in the document header  The most commonly used element within the header is the document  Titles should contain only ASCII characters (letters, numbers, and basic punctuation). Special characters (such as &) should be referred to by their character entities (e.g. &)  The title is not only used to display selected text in the title bar, but it is also the text used in bookmarks, and search engines rely heavily on the title as well  This tag establishes the document’s base location which serves as a reference for all pathnames and links in the document  This tag is most frequently used to link a document to an external style sheet  JavaScript and VBScript code may be added to the document within its header using this tag. All JS & VB functions should be loaded in the head of the doc  Embedded style sheets must be added in the head of the doc within the tag

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition12  Wiley and the book authors, 2002 Background graphics The background attribute of the tag can be used to add images that display behind the content of your web page Any web-based graphic file (e.g. GIF or JPEG) can be used A few simple rules regarding using background graphics are:  Use a graphic that won’t interfere with the legibility of the text  Keep file sizes small  Provide a bgcolor attribute which closely matches the dominant color of your image  Save other images in the same file format if you want them to be able to blend into the background graphic  Non-web-safe colors are displayed differently with background images than they are with other images making it difficult to match inline images to the background

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition13  Wiley and the book authors, 2002 Adjusting browser margins By default, browsers insert a margin of pixels between the edge of the browser window and the document’s contents Although HTML 4.01 does not provide a method for changing these margins (CSS is used, instead), IE & Netscape have their own proprietary attributes for the tag  IE uses the leftmargin, rightmargin, topmargin, and bottommargin to specify pixel widths for the respective margins in the browser window  Netscape uses marginwidth and marginheight To set margins for both browsers, it is necessary to duplicate attributes To turn off margins for both browsers:

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition14  Wiley and the book authors, 2002 Using tags The tag has a wide variety of applications, but is primarily used to include information about a document The data contained in the tag is useful for servers, web browsers, and search engines but is invisible to the reader Information provided by an http-equiv attribute is processed as though it had come from an http response header which the server passes to the browser just before it sends the HTML document  Meta tags for “client pull” are used to automatically request a new document from the server. The result is that the page displays, and after a period f time, automatically refreshes with new information or is replaced by a new page  will reload the current file after about 15 seconds  will replace the current file with the one specified by the URL

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition15  Wiley and the book authors, 2002 Using tags (cont.)  indicates that the current file will expire at the specified date and time (used to delete expired files from caches and search engine indexes)  is used to include the character set for the document causing the browser to load the appropriate character set before displaying the page  is used to identify the language in which the document is written causing The name attribute is used to insert hidden information about the document that does not correspond to http headers You can make up your own meta names or use one of the names put forth by search engine and browser companies for standardized use

_______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition16  Wiley and the book authors, 2002 Using tags (cont.)  provides a brief, plain-language description of the contents of your web page. Some search engines will use the description to display in the search results listing your site  supplements the title and description of the document with a list of comma-separated keywords used to index your document  identifies the author of the web page  identifies copyright information for the document  will presumably prevent your page from being indexed by search engines  indicates the content rating of the web page. Ratings can be general, mature, restricted, and 14 years