home *** CD-ROM | disk | FTP | other *** search
/ Unix System Administration Handbook 1997 October / usah_oct97.iso / rfc / 1900s / rfc1980.txt < prev    next >
Text File  |  1996-08-12  |  13KB  |  396 lines

  1.  
  2.  
  3.  
  4.  
  5.  
  6.  
  7. Network Working Group                                         J. Seidman
  8. Request for Comments: 1980                                Spyglass, Inc.
  9. Category: Informational                                      August 1996
  10.  
  11.  
  12.          A Proposed Extension to HTML : Client-Side Image Maps
  13.  
  14. Status of this Memo
  15.  
  16.    This memo provides information for the Internet community.  This memo
  17.    does not specify an Internet standard of any kind.  Distribution of
  18.    this memo is unlimited.
  19.  
  20. Abstract
  21.  
  22.    The markup language known as "HTML/2.0" provides for image maps.
  23.    Image maps are document elements which allow clicking different areas
  24.    of an image to reference different network resources, as specified by
  25.    Uniform Identifier (URIs).  The image map capability in HTML/2.0 is
  26.    limited in several ways, such as the restriction that it only works
  27.    with documents served via the "HTTP" protocol, and the lack of a
  28.    viable fallback for users of text-only browsers.  This document
  29.    specifies an extension to the HTML language, referred to as "Client-
  30.    Side Image Maps," which resolves these limitations.
  31.  
  32. Table of Contents
  33.  
  34.    1.  Introduction ...............................................  1
  35.        1.1  Purpose ...............................................  1
  36.        1.2  Overall Operation .....................................  2
  37.    2.  Client-Side Image Map Extension ............................  2
  38.        2.1  Syntax ................................................  2
  39.        2.2  Required Changes to HTML/2.0 DTD ......................  4
  40.        2.3  Backwards Compatibility ...............................  5
  41.        2.4  Examples ..............................................  5
  42.    3.  Security Considerations ....................................  6
  43.    4.  References .................................................  6
  44.    5.  Author's Address ...........................................  7
  45.  
  46. 1. Introduction
  47.  
  48. 1.1  Purpose
  49.  
  50.    Image maps are an important feature of the point-and-click interface
  51.    which makes the World Wide Web so popular. The most common use of
  52.    image maps is to allow users to access different documents by
  53.    clicking different areas in an image.
  54.  
  55.  
  56.  
  57.  
  58. Seidman                      Informational                      [Page 1]
  59.  
  60. RFC 1980                 Client-Side Image Maps              August 1996
  61.  
  62.  
  63.    There are several limitations of the current image map implementation
  64.    as it applies to this use. First, it only works over the HTTP
  65.    protocol, making it unusable for reading local files or files
  66.    accessed via alternate protocols. Second, a server transaction is
  67.    required merely to determine where the link is directed. This can
  68.    degrade performance noticeably when accessing distant sites. Third,
  69.    unlike for normal links, there is no way for a browser to provide
  70.    visual feedback to the user showing where a portion of an image map
  71.    leads before the user actually clicks it. Lastly, the method for
  72.    specifying the active regions of image maps is server-dependent,
  73.    compromising portability of documents.  This extension to support
  74.    client-side image maps addresses these issues.
  75.  
  76.    It is proposed that this extension be included in a future revision
  77.    of the HTML specification.
  78.  
  79. 1.2  Overall Operation
  80.  
  81.    Client-side image maps work by placing a complete representation of
  82.    the active areas of an image, including their shape, size, and
  83.    destination (URI), into an SGML-compliant textual form.  This markup
  84.    may also optionally include a textual description for each area for
  85.    display on non-textual browsers.  This representation, or "map," is
  86.    given a name to identify it.
  87.  
  88.    When an image is included in an HTML document, it may include an
  89.    attribute specifying a map to use.  The map may be contained in the
  90.    same file which references the image, but this it not required.  If
  91.    the map is in a different file, a URI to that file must be provided.
  92.  
  93.    The browser will parse the map and remember the contents.  When the
  94.    user clicks the map, the browser will match up the location with the
  95.    specified destination for that location and access that URI.  In the
  96.    case of a non-graphical browser, the browser could display the
  97.    textual descriptions for each area instead of the image.  Clicking a
  98.    given textual description would then go to the associated
  99.    destination.
  100.  
  101. 2. Client-Side Image Map Extension
  102.  
  103. 2.1 Syntax
  104.  
  105.    Adding a USEMAP attribute to an IMG element indicates that it is a
  106.    client-side image map.  The USEMAP attribute can be used with the
  107.    ISMAP attribute to indicate that the image can be processed as either
  108.    a client-side or server-side image map.  The argument to USEMAP
  109.    specifies which map to use with the image, by specifying the URI for
  110.    the file containing the map, followed by a '#', followed by the name
  111.  
  112.  
  113.  
  114. Seidman                      Informational                      [Page 2]
  115.  
  116. RFC 1980                 Client-Side Image Maps              August 1996
  117.  
  118.  
  119.    of the map.  If the argument to USEMAP starts with a '#', the map is
  120.    assumed to be in the same document as the IMG tag.  The presence of a
  121.    USEMAP attribute overrides the effect of an enclosing anchor (A)
  122.    element.
  123.  
  124.    The different regions of the image are described using a MAP element.
  125.    The map describes each region in the image and indicates where it
  126.    links to. The basic format for the MAP element is as follows:
  127.  
  128.    <MAP NAME="name">
  129.    <AREA [SHAPE="shape"] COORDS="x,y,..." [HREF="reference"]
  130.          [NOHREF] [ALT="alt"]>
  131.    </MAP>
  132.  
  133.    The NAME attribute specifies the name of the map so that it can be
  134.    referenced by an IMG element.  Each AREA element contained inside the
  135.    map element specifies a single clickable area of the image.  The
  136.    SHAPE attribute gives the shape of this area.  Possible shapes are
  137.    "RECT", "CIRCLE", and "POLYGON", which specify rectangular, circular,
  138.    and polygonal regions respectively.  If the SHAPE tag is omitted,
  139.    SHAPE="RECT" is assumed.
  140.  
  141.    The COORDS tag describes the position of an area, using image pixels
  142.    as the units with the origin at the upper-left corner of the image.
  143.    For a rectangle, the coordinates are given as
  144.    "left,top,right,bottom".  The rectangular region defined includes the
  145.    lower-right corner specified, i.e. to specify the entire area of a
  146.    100x100 image, the coordinates would be "0,0,99,99".
  147.  
  148.    For a circular region, the coordinates are given as
  149.    "center_x,center_y,radius", specifying the center and radius of the
  150.    ircle.  All points up to and including those at a distance of
  151.    "radius" points from the center are included.  For example, the
  152.    coordinates "4,4,2" would specify a circle which included the
  153.    coordinates (2,4) (6,4) (4,2) and (4,6).
  154.  
  155.    For a polygonal region, the coordinates specify successive vertices
  156.    of the region in the format "x1,y1,x2,y2,...,xn,yn".  If the first
  157.    and last coordinates are not the same then a segment is inferred to
  158.    close the polygon.  The region includes the boundary lines of the
  159.    polygon.  For example, "20,20,30,40,10,40" would specify a triangle
  160.    with vertices at (20,20) (30,40) and (10,40).  No explicit limit is
  161.    placed on the number of vertices, but a practical limit is imposed by
  162.    the fact that HTML limits an attribute value to 1024 characters.
  163.  
  164.    The NOHREF attribute indicates that clicks in this region should
  165.    perform no action.  An HREF attribute specifies where a click in that
  166.    area should lead.  A relative anchor specification will be expanded
  167.  
  168.  
  169.  
  170. Seidman                      Informational                      [Page 3]
  171.  
  172. RFC 1980                 Client-Side Image Maps              August 1996
  173.  
  174.  
  175.    using the URI of the map description as a base, rather than using the
  176.    URI of the document from which the map description is referenced. If
  177.    a BASE tag is present in the document containing the map description,
  178.    that URI will be used as the base.
  179.  
  180.    An arbitrary number of AREA tags may be specified.  If two areas
  181.    intersect, the one which appears first in the map definition takes
  182.    precedence in the overlapping region.  Multiple areas may share the
  183.    same destination to create composite shapes.  Any portion of an image
  184.    which is not described by an AREA tag defaults to having no action.
  185.  
  186.    The ALT attribute specifies optional text which describes a given
  187.    area.  A text-only browser can display the textual contents for each
  188.    area as a substitute for the image.
  189.  
  190. 2.2  Required Changes to HTML/2.0 DTD
  191.  
  192.    The required changes to the HTML/2.0 DTD to support this syntax would
  193.    be as follows:
  194.  
  195.   Change the IMG element definition to be:
  196.     <!ELEMENT IMG    - O EMPTY>
  197.     <!ATTLIST IMG
  198.             SRC CDATA #REQUIRED
  199.             ALT CDATA #IMPLIED
  200.             ALIGN (top|middle|bottom) #IMPLIED
  201.             ISMAP (ISMAP) #IMPLIED
  202.             USEMAP %URI; #IMPLIED
  203.             %SDAPREF; "<Fig><?SDATrans Img: #AttList>#AttVal(Alt)</Fig>"
  204.     >
  205.  
  206.   Add the following new definitions:
  207.     <!ELEMENT MAP    - - +(AREA)>
  208.     <!ATTLIST MAP
  209.             NAME %linkName; #REQUIRED
  210.     >
  211.  
  212.     <!ELEMENT AREA   - O EMPTY>
  213.     <!ATTLIST AREA
  214.             SHAPE (RECT|CIRCLE|POLYGON) RECT #IMPLIED
  215.             COORDS CDATA #REQUIRED
  216.             HREF %URI; #IMPLIED
  217.             NOHREF (NOHREF) #IMPLIED
  218.             ALT CDATA #IMPLIED
  219.     >
  220.  
  221.  
  222.  
  223.  
  224.  
  225.  
  226. Seidman                      Informational                      [Page 4]
  227.  
  228. RFC 1980                 Client-Side Image Maps              August 1996
  229.  
  230.  
  231. 2.3  Backwards Compatibility
  232.  
  233.    This extension is specifically designed to provide a variety of
  234.    fallback options for browsers which do not support it.  These options
  235.    are based on the assumption that browsers will ignore any attributes
  236.    or elements which are not present in the HTML/2.0 DTD.
  237.  
  238.    An document can be written so that a client-side image map can have
  239.    three different fallback behaviors.  First, the document can use the
  240.    server-side image map capability, by specifying the ISMAP attribute
  241.    as well as USEMAP.  In situations where this is possible, the image
  242.    map will work whether or not the browser supports the client-side
  243.    extension.
  244.  
  245.    Second, clicking the image can direct the user to a single URI,
  246.    regardless of where on the image he clicks.  This is accomplished by
  247.    placing the image inside an anchor (A) element.  The fallback
  248.    destination could provide the user with an error or a textual list of
  249.    destinations.
  250.  
  251.    Lastly, the image can appear to not be a link at all (i.e. missing
  252.    whatever visual cues a browser provides to indicate a hyperlink).
  253.    This will be the result if the image element neither contains an
  254.    ISMAP attribute nor is inside an anchor.
  255.  
  256. 2.4  Examples
  257.  
  258.    The following three examples show markup demonstrating the three
  259.    fallback mechanisms described in section 2.3:
  260.  
  261.       This image map will work with any graphical browser:
  262.       <A HREF="/cgi-bin/imagemap/pic1">
  263.       <IMG SRC="pic1.jpg" USEMAP="maps.html#map1" ISMAP></A>
  264.  
  265.       Clicking here will take you to a page with an error message if
  266.       you don't have client-side image map support:
  267.       <A HREF="no_csim.html">
  268.       <IMG SRC="pic2.jpg" USEMAP="maps.html#map2"></A>
  269.  
  270.       You can only click here if your browser supports client-side
  271.       image maps: <IMG SRC="pic3.jpg" USEMAP="maps.html#map3">
  272.  
  273.  
  274.  
  275.  
  276.  
  277.  
  278.  
  279.  
  280.  
  281.  
  282. Seidman                      Informational                      [Page 5]
  283.  
  284. RFC 1980                 Client-Side Image Maps              August 1996
  285.  
  286.  
  287.    The following example shows the use of a map in the same file as the
  288.    image:
  289.  
  290.       <IMG SRC="picture.jpg" USEMAP="#mymap">
  291.  
  292.    The following example defines a simple map which describes an image
  293.    with a circle in the middle overlapping two large rectangles:
  294.  
  295.       <MAP NAME="welcomemap">
  296.       <AREA SHAPE=CIRCLE COORDS="50,50,40" HREF="about_us.html"
  297.             ALT="About our company">
  298.       <AREA SHAPE=RECT COORDS="0,0,100,50" HREF="products.html"
  299.             ALT="Our products">
  300.       <AREA SHAPE=RECT COORDS="0,51,100,100 HREF="technology.html"
  301.             ALT="Technology for the next century">
  302.       </MAP>
  303.  
  304. 3. Security Considerations
  305.  
  306.    Clicking a portion of a client-side image map may cause a URI to be
  307.    dereferenced.  In this case, the security considerations related to
  308.    URLs [5] apply.
  309.  
  310. 4. References
  311.  
  312.    [1] Berners-Lee, T., and D. Connolly, "HyperText Markup Language
  313.        Specification - 2.0", RFC 1866, November 1995.
  314.  
  315.    [2] Seidman, J., "An HTML Extension to Support Client-Side Image
  316.        Maps", The Second Internation WWW Conference '94 Advance
  317.        Proceedings, pp 927-930.
  318.  
  319.    [3] "Standard Generalized Markup Language"  ISO Standard 8879:1986
  320.        Information Processing Text and Office Systems.
  321.  
  322.    [4] Berners-Lee, T., Fielding, R., and H. Frystyk Nielsen,
  323.        "Hypertext Transfer Protocol -- HTTP/1.0", Work in
  324.        Progress.
  325.  
  326.    [5] Berners-Lee, T., Masinter, L., and M. McCahill, "Uniform
  327.        Resource Locators (URL)", RFC 1738, December 1994.
  328.  
  329.  
  330.  
  331.  
  332.  
  333.  
  334.  
  335.  
  336.  
  337.  
  338. Seidman                      Informational                      [Page 6]
  339.  
  340. RFC 1980                 Client-Side Image Maps              August 1996
  341.  
  342.  
  343. 5. Author's Address
  344.  
  345. James L. Seidman
  346. Senior Software Engineer
  347. Spyglass, Inc.
  348. 1230 East Diehl Road
  349. Naperville, IL 60563
  350.  
  351. EMail: jim@spyglass.com
  352.  
  353.  
  354.  
  355.  
  356.  
  357.  
  358.  
  359.  
  360.  
  361.  
  362.  
  363.  
  364.  
  365.  
  366.  
  367.  
  368.  
  369.  
  370.  
  371.  
  372.  
  373.  
  374.  
  375.  
  376.  
  377.  
  378.  
  379.  
  380.  
  381.  
  382.  
  383.  
  384.  
  385.  
  386.  
  387.  
  388.  
  389.  
  390.  
  391.  
  392.  
  393.  
  394. Seidman                      Informational                      [Page 7]
  395.  
  396.