A Related Link/Shortcut is a hypertext link (using
the "a href" tag in html) that takes the user to information relating to
a task or contents within a page. The link is a convenient shortcut to frequently
accessed tasks or viewed items. "Related" Links/Shortcuts are not task critical; i.e.,
they are not mandatory for completing the task at hand. This guideline discusses
the following topics:
General Principles
A Related
Link/Shortcut is a hypertext link (using the "a href" tag in html) that takes the
user to information relating to a task or contents within a page.
The information may be a related task or item which the Link provides convenient
access. NOTE: "Related" Links are not task critical; i.e., they
are not mandatory for completing the task at hand.
Common types of Related Links are:
Related Information - link
which drills down or cross-tab navigates
the user to view-only content,
such as news articles, reports, related objects' information, etc.
Related Applications - link
which navigates to related external applications.
Shortcuts - link which navigates
to frequently used tasks or objects within the application.
Content containers give visual prominence
to Related Links within the page. Please refer to the
Content Containers guideline for details regarding its usage
Links are arranged as a bulleted list
in a single column within the container.
If there are several groups of related links, these groups may be separated
by section headers or subheaders in one container, or placed in separate
containers.
Different types of links may be placed
in separate containers stacked vertically. For example, a "Related
Information" container with drill-down links can be stacked on top
of a "Shortcuts" container with navigation links.
There are two layout options of related
links in content containers:
Within
End Column - This option is often used for page-level Related
Links in pages that have many content/task launch points (such as a
homepage). The quantity of Related
Links in a content container range from moderate (between 8 to 15 links)
to heavy (greater than 15 links).
Within
Page Section
- This option is used to show relationship of the links to a given
section. On a page with densely
populated content,
this option can be useful
for making links
and other content visually
prominent while showing
them to be related to a specific section. The
quantity fo Related Links in a content container range from light (6
to 8 links) to moderate (between 8 to 15 links).
Example of Related Links Within Content Container in an End Column
Example of Related Links Within Content Container in a Subsection
In cases where links are
related to a given section but not applicable to the entire page, these
links can be placed in a subsection within the page's content.
There are two layout options of Related
Links as subsection content:
Under
Adjacent Header - This option is used to show links related
to section level content (as opposed
to page level). A list of Related Links under an adjacent header is
placed next to the referring section. The quantity of links can be
moderate (between 8 to 15
links) to heavy (greater
than 15 links). One benefit of using this option is that it
usually takes up less space than the page section content container
option, and also presents less visual clutter - especially when there
are other information containers (such as a table) in the referring
section. The links are arranged as a single bulleted list column below
an adjacent header title.
Under Subheader
- This option is useful for large quantities of Related Links within
a section. Groups of links may be in multiple columns under different
category headers. These links may be drill-down or navigation
links to task /content related
to the section.
Example of Related Links Under An Adjacent Header Within Subsection
Example of Related Links In Columns Under a Subheader
Related Links are usually
found within label/data layouts in object template pages, and are
used for drilling down to details of a related object.
The quantity of Related
Links used in a label/data section should be light (6-8 links).
Links are arranged in a
single column, left-aligned with other data values and web widgets. They may also use an
associated Object Type Quantifier icon.
As with other data or widgets
in a label/data layout, a label should be assigned to a single
Related Link or a group of links. Please refer to the Content
Layout Templates guideline for additional details about
label/data.
Related Links can exist
in a table within a column or as a full table.
The quantity of Related
Links used in a table cell should be light. There
is typically one link per row. If multiple links are shown for an object
(5 or less), the links can be shown using row span or can use hide/show row details in the cell to
contain the links so that the table does not become very large.
Links may navigate the user
within an application or across applications
Example of Related Links As
a Column Within a Table
Example of Related Links As
a Full Table
Example of Related Links Within
a Hide/Show In a Table
Either icons or bullets
should be used to visually distinguish the individual Related Links.
Icons used with Related
Links/Shortcuts are also known as ID Icons, and are used to quantify the type of
object represented by a Related Link. Using ID icons is recommended when
multiple types of Related Links are shown (e.g., a group Related Information,
Related Task, Shortcut to an Object, or Related Application links). Generic Related Links icons
may be used if no specific object icon is applicable.
Bullets are recommended
for showing a homogeneous group of Related Links.
Icons should be placed to
the left of the link and aligned with the link.
Generic Icons for Related
Links/Shortcuts:
Generic Task
Generic Application
Generic Document
Example of Related Links
With Icons Under An Adjacent Header Within Subsection
Bookmark
Generic Task 
Generic Application
Generic Document
