home *** CD-ROM | disk | FTP | other *** search
/ Best Tools for JAVA / Best Tools for JAVA.iso / STANDARD / HTML2 / CLIENT~1.TXT < prev    next >
Encoding:
Text File  |  1995-11-09  |  12.7 KB  |  304 lines
  1.  
  2. INTERNET-DRAFT                                          James L. Seidman
  3. <draft-ietf-html-clientsideimagemap-01.txt>             Spyglass, Inc.
  4. Expires SIX MONTHS FROM--->                             August 8, 1995
  5.  
  6.       A Proposed Extension to HTML : Client-Side Image Maps
  7.  
  8. Status of this Memo
  9.  
  10.    This document is an Internet-Draft. Internet-Drafts are working
  11.    documents of the Internet Engineering Task Force (IETF), its areas,
  12.    and its working groups. Note that other groups may also distribute
  13.    working documents as Internet-Drafts.
  14.  
  15.    Internet-Drafts are draft documents valid for a maximum of six
  16.    months and may be updated, replaced, or obsoleted by other
  17.    documents at any time. It is inappropriate to use Internet-
  18.    Drafts as reference material or to cite them other than as
  19.    "work in progress."
  20.  
  21.    To learn the current status of any Internet-Draft, please check
  22.    the "1id-abstracts.txt" listing contained in the Internet-
  23.    Drafts Shadow Directories on ds.internic.net (US East Coast),
  24.    nic.nordu.net (Europe), ftp.isi.edu (US West Coast), or
  25.    munnari.oz.au (Pacific Rim).
  26.  
  27.    Distribution of this document is unlimited.  Please send
  28.    comments to the HTML working group (HTML-WG) of the
  29.    Internet Engineering Task Force (IETF) at <html-wg@oclc.org>.
  30.    Discussions of the group are archived at
  31.    URL: http://www.acl.lanl.gov/HTML_WG/archives.html.
  32.  
  33. Abstract
  34.  
  35.    The markup language known as "HTML/2.0" provides for image maps.
  36.    Image maps are document elements which allow clicking on different
  37.    areas of an image to reference different network resources, as
  38.    specified by Uniform Resource Locators (URIs).  The image map
  39.    capability in HTML/2.0 is limited in several ways, such as the
  40.    restriction that it only works with documents served via the "HTTP"
  41.    protocol, and the lack of a viable fallback for users of text-only
  42.    browsers.  This document specifies an extension to the HTML
  43.    language, referred to as "Client-Side Image Maps," which resolves
  44.    these limitations.
  45.    
  46. Table of Contents
  47.  
  48.    1.  Introduction
  49.        1.1  Purpose
  50.        1.2  Overall Operation
  51.    2.  Client-Side Image Map Extension
  52.        2.1  Syntax
  53.        2.2  Required Changes to HTML/2.0 DTD
  54.        2.3  Backwards Compatibility
  55.        2.4  Examples
  56.    3.  References
  57.    4.  Author's Address
  58.  
  59.  
  60. 1. Introduction
  61.  
  62. 1.1  Purpose
  63.  
  64.    Image maps are an important feature of the point-and-click
  65.    interface which makes the World Wide Web so popular. The most
  66.    common use of image maps is to allow users to access different
  67.    documents by clicking on different areas in an image.
  68.  
  69.    There are several limitations of the current image map
  70.    implementation as it applies to this use. First, it only works
  71.    over the HTTP protocol, making it unusable for reading local files
  72.    or files accessed via alternate protocols. Second, a server
  73.    transaction is required merely to determine where the link is
  74.    directed. This can degrade performance noticeably when accessing
  75.    distant sites. Third, unlike for normal links, there is no way for
  76.    a browser to provide visual feedback to the user showing where a
  77.    portion of an image map leads before the user actually clicks on
  78.    it. Lastly, the method for specifying the active regions of image
  79.    maps is server-dependent, compromising portability of documents.
  80.    This extension to support client-side image maps addresses these
  81.    issues.
  82.  
  83.    It is proposed that this extension be included in a future revision
  84.    of the HTML specification.
  85.  
  86. 1.2  Overall Operation
  87.  
  88.    Client-side image maps work by placing a complete representation of
  89.    the active areas of an image, including their shape, size, and
  90.    destination (URI), into an SGML-compliant textual form.  This
  91.    markup may also optionally include a textual description for
  92.    each area for display on non-textual browsers.  This
  93.    representation, or "map," is given a name to identify it.
  94.  
  95.    When an image is included in an HTML document, it may include an
  96.    attribute specifying a map to use.  The map may contained in the
  97.    same file which references the image, but this it not required.
  98.    If the map is in a different file, a URI to that file must be
  99.    provided.
  100.  
  101.    The browser will parse the map and remember the contents.  When the
  102.    user clicks on the map, the browser will match up the location with
  103.    the specified destination for that location and access that URI.
  104.    In the case of a non-graphical browser, the browser could display
  105.    the textual descriptions for each area instead of the image.
  106.    Clicking on a given textual description would then go to the
  107.    associated destination. 
  108.  
  109.  
  110. 2. Client-Side Image Map Extension
  111.  
  112. 2.1 Syntax
  113.    
  114.    Adding a USEMAP attribute to an IMG element indicates that it is a
  115.    client-side image map.  The USEMAP attribute can be used with the
  116.    ISMAP attribute to indicate that the the image can be processed as
  117.    either a client-side or server-side image map.  The argument to
  118.    USEMAP specifies which map to use with the image, by specifying the
  119.    URI for the file containing the map, followed by a '#', followed by
  120.    the name of the map.  If the argument to USEMAP starts with a '#',
  121.    the map is assumed to be in the same document as the IMG tag.  The
  122.    presence of a USEMAP attribute overrides the effect of an enclosing
  123.    anchor (A) element.
  124.    
  125.    The different regions of the image are described using a MAP
  126.    element.  The map describes each region in the image and indicates
  127.    where it links to. The basic format for the MAP element is as
  128.    follows:
  129.  
  130.    <MAP NAME="name">
  131.    <AREA [SHAPE="shape"] COORDS="x,y,..." [HREF="reference"]
  132.          [NOHREF] [ALT="alt"]>
  133.    </MAP>
  134.  
  135.    The NAME attribute specifies the name of the map so that it can be
  136.    referenced by an IMG element.  Each AREA element contained inside
  137.    the map element specifies a single clickable area of the image.
  138.    The SHAPE attribute gives the shape of this area.  Possible shapes
  139.    are "RECT", "CIRCLE", and "POLYGON", which specify rectangular,
  140.    circular, and polygonal regions respectively.  If the SHAPE tag is
  141.    omitted, SHAPE="RECT" is assumed.
  142.    
  143.    The COORDS tag describes the position of an area, using image
  144.    pixels as the units with the origin at the upper-left corner of the
  145.    image.  For a rectangle, the coordinates are given as
  146.    "left,top,right,bottom".  The rectangular region defined includes
  147.    the lower-right corner specified, i.e. to specify the entire area
  148.    of a 100x100 image, the coordinates would be "0,0,99,99".
  149.    
  150.    For a circular region, the coordinates are given as
  151.    "center_x,center_y,radius", specifying the center and radius of the
  152.    circle.  All points up to and including those at a distance of
  153.    "radius" points from the center are included.  For example, the
  154.    coordinates "4,4,2" would specify a circle which included the
  155.    coordinates (2,4) (6,4) (4,2) and (4,6).
  156.  
  157.    For a polygonal region, the coordinates specify successive
  158.    vertices of the region in the format "x1,y1,x2,y2,...,xn,yn".
  159.    If the first and last coordinates are not the same then a segment
  160.    is inferred to close the polygon.  The region includes the
  161.    boundary lines of the polygon.  For example, "20,20,30,40,10,40"
  162.    would specify a triangle with vertices at (20,20) (30,40) and
  163.    (10,40).  No explicit limit is placed on the number of vertices,
  164.    but a practical limit is imposed by the fact that HTML limits
  165.    an attribute value to 1024 characters.
  166.  
  167.    The NOHREF attribute indicates that clicks in this region should
  168.    perform no action.  An HREF attribute specifies where a click in
  169.    that area should lead.  A relative anchor specification will be
  170.    expanded using the URI of the map description as a base, rather
  171.    than using the URI of the document from which the map description
  172.    is referenced. If a BASE tag is present in the document containing
  173.    the map description, that URI will be used as the base.
  174.  
  175.    An arbitrary number of AREA tags may be specified.  If two areas
  176.    intersect, the one which appears first in the map definition takes 
  177.    precedence in the overlapping region.  Multiple areas may share the
  178.    same destination to create composite shapes.  Any portion of an
  179.    image which is not described by an AREA tag defaults to having no
  180.    action.
  181.  
  182.    The ALT attribute specifies optional text which describes a given
  183.    area.  A text-only browser can display the textual contents for
  184.    each area as a substitute for the image.
  185.  
  186. 2.2  Required Changes to HTML/2.0 DTD
  187.  
  188.    The required changes to the HTML/2.0 DTD to support this syntax
  189.    would be as follows:
  190.  
  191.       Change the IMG element definition to be:
  192.         <!ELEMENT IMG    - O EMPTY>
  193.         <!ATTLIST IMG
  194.                 SRC %URI; #REQUIRED
  195.                 ALT CDATA #IMPLIED
  196.                 ALIGN (top|middle|bottom) #IMPLIED
  197.                 ISMAP (ISMAP) #IMPLIED
  198.                 USEMAP %URI; #IMPLIED
  199.                 %SDAPREF; "<Fig><?SDATrans Img: #AttList>#AttVal(Alt)</Fig>"
  200.         >
  201.        
  202.       Add the following new definitions:
  203.         <!ELEMENT MAP    - - +(AREA)>
  204.         <!ATTLIST MAP
  205.                 NAME %linkName; #REQUIRED
  206.         >
  207.  
  208.         <!ELEMENT AREA   - O EMPTY>
  209.         <!ATTLIST AREA
  210.                 SHAPE (RECT|CIRCLE|POLYGON) RECT #IMPLIED
  211.                 COORDS CDATA #REQUIRED
  212.                 HREF %URI; #IMPLIED
  213.                 NOHREF (NOHREF) #IMPLIED
  214.                 ALT CDATA #IMPLIED
  215.         >
  216.  
  217.  
  218. 2.3  Backwards Compatibility
  219.  
  220.    This extension is specifically designed to provide a variety of
  221.    fallback options for browsers which do not support it.  These
  222.    options are based on the assumption that browsers will ignore any
  223.    attributes or elements which are not present in the HTML/2.0 DTD.
  224.  
  225.    An document can be written so that a client-side image map can have
  226.    three different fallback behaviors.  First, the document can use
  227.    the server-side image map capability, by specifying the ISMAP
  228.    attribute as well as USEMAP.  In situations where this is possible,
  229.    the image map will work whether or not the browser supports the
  230.    client-side extension.
  231.  
  232.    Second, clicking on the image can direct the user to a single URI,
  233.    regardless of where on the image he clicks.  This is accomplished
  234.    by placing the image inside an anchor (A) element.  The fallback
  235.    destination could provide the user with an error or a textual list
  236.    of destinations.
  237.   
  238.    Lastly, the image can appear to not be a link at all (i.e. missing
  239.    whatever visual cues a browser provides to indicate a hyperlink).
  240.    This will be the result if the image element neither contains an
  241.    ISMAP attribute nor is inside an anchor.
  242.  
  243. 2.4  Examples
  244.  
  245.    The following three examples show markup demonstrating the three
  246.    fallback mechanisms described in section 2.3:
  247.  
  248.       This image map will work with any graphical browser:
  249.       <A HREF="/cgi-bin/imagemap/pic1">
  250.       <IMG SRC="pic1.jpg" USEMAP="maps.html#map1" ISMAP></A>
  251.  
  252.       Clicking here will take you to a page with an error message if
  253.       you don't have client-side image map support:
  254.       <A HREF="no_csim.html">
  255.       <IMG SRC="pic2.jpg" USEMAP="maps.html#map2"></A>   
  256.  
  257.       You can only click here if your browser supports client-side
  258.       image maps: <IMG SRC="pic3.jpg" USEMAP="maps.html#map3">
  259.  
  260.    The following example shows the use of a map in the same file as
  261.    the image:
  262.  
  263.       <IMG SRC="picture.jpg" USEMAP="#mymap">
  264.  
  265.    The following example defines a simple map which describes an
  266.    image with a circle in the middle overlapping two large
  267.    rectangles:
  268.  
  269.       <MAP NAME="welcomemap">
  270.       <AREA SHAPE=CIRCLE COORDS="50,50,40" HREF="about_us.html"
  271.             ALT="About our company">
  272.       <AREA SHAPE=RECT COORDS="0,0,100,50" HREF="products.html"
  273.             ALT="Our products">
  274.       <AREA SHAPE=RECT COORDS="0,51,100,100 HREF="technology.html"
  275.             ALT="Technology for the next century">
  276.       </MAP>
  277.  
  278. 3. References
  279.  
  280.    [1] T. Berners-Lee, D. Connolly.  "HyperText Markup Language
  281.        Specification - 2.0" Internet-Draft (work in progress),
  282.        June 16, 1995.
  283.  
  284.    [2] J. Seidman, "An HTML Extension to Support Client-Side Image
  285.        Maps"  The Second Internation WWW Conference '94 Advance
  286.        Proceedings, pp 927-930.
  287.  
  288.    [3] "Standard Generalized Markup Language"  ISO Standard 8879:1986
  289.        Information Processing Text and Office Systems.
  290.  
  291.    [4] T. Berners-Lee, R. T. Fielding, H. Frystyk Nielsen,
  292.        "Hypertext Transfer Protocol -- HTTP/1.0" Internet-Draft
  293.        (work in progress), March 8, 1995.
  294.        
  295. 4. Author's Address
  296.  
  297.    James L. Seidman
  298.    jim@spyglass.com
  299.    Senior Software Engineer
  300.    Spyglass, Inc.
  301.    1230 East Diehl Road
  302.    Naperville, IL 60563
  303.  
  304.