VirtualMV/HTML/Basic/Head tag

From WikiEducator
Jump to: navigation, search


Internet & Web Development ( Introduction  |  Advanced )
OverviewPersonal Learning Environment  |  What is HTML?  |  Web authoring  |  Resources  |  Help DeskTutorial.png
Creating a basic web siteHTML editor  |  Basic tags  |  Head tag  |  Linking pages  |  Formating and lines  |  Lists  |  Tables  |  Special characters  |  Page icon
Multimediagraphics and images  |  Connected media  |  Audio  |  Video  |  Image map
Cascading style sheetsInline, embedded, linked  |  Language  |  Example
Web page layoutTables  |  CSS  |  iFrame  |  Frames  |  Other  |  Responsive
FrameworkTours of Hawke's Bay
FormsExample  |  mailto  |  Add Google
MiscGoogle



Overview

The head tag contains information about the page (called the meta-data), and is not displayed in the web browser. The title tag is used to name the page and is usually displayed on the page tab, while other parts may be used by search engines.

VmvIcon Objective.png

Head tag

By the end of this page you will be able to:

  • List and describe the basic elements of the head tag
    • title, meta, style, script
  • List and describe attributes of the meta tag

Task: Add meta tags to a web page

Add the following meta-tags to one.html 

<!DOCTYPE html>
<html> 
  <head> 
    <meta name="keywords" content="html, htm, first page">
    <meta name="description" content="First web page">
    <meta name="DC.Creator" content="put your name in here" />
    <meta name="DC.Rights" content="any copyright information">
    <title>**’s first page</title>
  </head> 
  <body>
    <h1>**’s web</h1> 
    <p>Hello <b>world</b></p>
    <h2>Favourite quotes</h2> 
    <p>Live long and prosper</p>
  </body> 
</html>

When displayed in the browser the Meta-tags do not show! Why?

Head tag elements

These are tags put into the <head> area of your webpage and are ABOUT the page so don't actually display on the page. These include.

    • <title> which is used in the tab when displaying multiple pages in a browser,
    • <meta > (name=keywords or description) used by search engines.
    • <style> where you include any CSS styles just for this page,
    • <script ..> where you put your JavaScript code,
    • <link ..> where you link to another file used by the page (e.g. CSS, JavaScript)

Meta tags.

  • base -- A record of the original URL of the document: this allows you to move the document to a new directory (or even a new site) and have relative URLs access the appropriate place with respect to the original URL.
  • isindex -- Usually placed in the HEAD by the server or a server script/program to indicate that a document is searchable.
  • link -- Defines the relationship(s) between this document and another or others. A document can have several LINK elements.
  • meta -- A container for document metainformation. (some useful ones include)
    • name="keywords" content="..." - used by search engines
    • name="description" content="..." - used by search engines
    • name="author" content="..."> - adds authors name
    • robot, that stops "some" robots from indexing your page
    • refresh, that allows you to redirect the web surfer to another page, and is especially useful if your site is moved.
      • e.g. <meta http-equiv="refresh" content="2;url=http://www.virtualmv.com/wiki"> - where the 2 indicates a 2 second wait.
    • name = DC... (Dublin Core) Dublin core is a standard way libraries reference pages. Programs like zotero can use this to automatically capture the correct page reference, some tags include:
      • name="DC.Creator" - author
      • name="DC.Rights" - copyright information
  • nextid -- A parameter used by automated HTML editors to create unique identifiers for the documents. NOTE: This attribute was dropped in HTML 4.0, so you should avoid it in new documents.
  • title -- The title of the document. You should use this one as it is used extensively by search engines.
  • style -- Stylesheet instructions, written in a stylesheet language. Stylesheet instructions specify how the document should be formatted for display.
  • script -- Script program code -- for enclosing, within a document, scripting program code that should be run with -- and that can interact with -- the document. Example languages are JavaScript and VBScript.

VmvIcon References.png References

virtualMV  |  Superquick wiki guide  |  Please give me some feedback

VirtualMV/HTML/Basic/Head tag. (2024). In WikiEducator/VirtualMV wiki. Retrieved April 25, 2024, from http:https://wikieducator.org/VirtualMV/HTML/Basic/Head_tag    (zotero)

Retrieved from "https://wikieducator.org/index.php?title=VirtualMV/HTML/Basic/Head_tag&oldid=1093897"