Page 1

Public ‐ Body Modules‐Business Rules & Design Treatment (v1.6)   

Body Module Definitions    The purpose of this document is to define the business rules and design treatments for all of  the various body modules for both two and three column templates.                           This includes: function, placement, design and expected behavior.  The AOC is responsible for  defining the business rules around function, placement, expected behavior and interaction,  while Extractable will define the design treatment and design elements such as size,  background color and text color. 

  Two Column Body Module Call‐Outs    The right column can optionally contain the following modules:                

   

Overview  – Image Left  Overview  – Image Top  Overview  – No Image  Body – Contextual Links/No‐Description  Body – Contextual Links/Description  Body – Contextual Links/Description/Image  Body – Descriptive Links  Body – Descriptive Links/Image  Body – Accordion HR‐Treatment  Body – Accordion No‐Treatment  Body – Tabs  Body – Dynamic Container/Links  Body – Dynamic Container/Dropdown 


“Search” Court Locations Module     Function: The “Search Locations” module allows a user to perform a search functionality  specific to court locations     Treatment (TM)   Background color (#)   Title text color (#)   Body text color (#)   Border color(#)  Elements   Module title   Instructions   Text field entry box   “Find” Button  Placement   On all Overview pages except Self‐Help   On  various landing and content pages where appropriate  Ordering   Prominent module (1) 

   

“Contact Info” Module    Function: The “Contact Info” module provides users with contact information such as physical  address, phone numbers and e‐mail.      Treatment (TM)   Background color (#)   Title text color (#)   Module title background color (#FFFFFF)   Text color (#)   “More” link no‐Underline static state   “More” link blue‐underline hover state   Visited link color (#)   Border color(#)  Elements   Module title   Line Limit (#)   Character Limit (#)   “More” Hyper link (optional)   Carrots after more link (>>)  Placement   On home page, overview pages, landing pages and content pages where appropriate  Ordering   Prominent module (2) 


“Quick Links” Module    Function: The “Quick Links” module provides a list of frequently used shortcuts to documents,   web pages within the same tab, and applications that otherwise could not be reached in one or  two clicks using the navigation structure available on the page. Typically for deep content areas,  usually found on the home page, overview and landing pages.     Treatment (TM)   Background color (#)   Title text color (#)   Module title background color (#FFFFFF)   Link text color (#)   No‐Underline static state   Blue‐underline hover state   Visited link color (#)   Border color(#)  Elements   Module title   Hyper links (5‐7 max)   Link character Limit (#)   Carrots in front of links (>>)  Placement   On home page, overview pages, landing pages and content pages  Ordering   Prominent module (3) 

     “What’s New” Module    Function: The “What’s New” module provides a list of shortcuts to “Featured” content or  applications that have recently been introduced. Typically for deep content areas, usually found  on the home, overview and landing pages generally within context.     Treatment (TM)   Background color (#)   Title text color (#)   Module title background color (#FFFFFF)   Link text color (#)   No‐Underline static state   Blue‐underline hover state   Visited link color (#)   Border color(#)  Elements   Module title   Hyper links (5‐7 max) 


 Link character Limit (#)   Carrots in front of links (>>)   “More” Link?  Placement   On overview pages, landing pages and content pages  Ordering   Prominent module (4) 

   

“News” Module    Function: The “News” module provides a brief description, imagery and access to a “Featured”  story or news item. The block can also contain a series of shortcuts to other “Featured” story or  news items. Usually found on the home, overview, landing pages and content pages.     Treatment (TM)   Background color (#)   Module title text color (#)   Module title background color (#FFFFFF)   News title text color (#)   Description text color (#)   Link text color (#)   No‐Underline static state   Blue‐underline hover state   Visited link color (#)   Border color(#)  Elements   Module title   News title   Hyper links (3 max)   Link character Limit (#)   Carrots in front of links (>>)   “More News” Link?  Placement   On home page, overview pages, landing pages and content pages   Ordering  Prominent module (5) 

   

“Video A” Module    Function: The “Video A” module provides a brief description, imagery and access to a  “Featured” video. Usually found on the home, overview, landing and content pages.     Treatment (TM)   Background color (#) 


 Module title text color (#)   Module title background color (#FFFFFF)   Video title text color (#)   Description text color (#)   Link text color (#)   No‐Underline static state   Blue‐underline hover state   Visited link color (#)   Border color(#)  Elements   Module title   Video title   Hyper links (1 max)   Link character Limit (#)   Carrots (>>)   “Read More” Link?  Placement   On home page, overview pages, landing pages  and content pages   Ordering  Prominent module (6) 

   

“Video B” Module    Function: The “Video B” module provides a brief caption, imagery and access to a “Featured”  video. Usually found on the home, overview, landing and content pages.     Treatment (TM)   Background color (#FFFFFF)   Module title text color (#)   Module title background color (#FFFFFF)   Video title text color (#)   Description text color (#)   No‐Underline static state   Blue‐underline hover state   Visited link color (#)   Border color(#)  Elements   Module Title   Video Title   Hyper links (1 max)   Character Limit (#)  Placement   On home page, overview pages, landing pages  and content pages   Ordering  Prominent module (6) 


Left Column Modules    The left column can optionally contain the following  modules:     Related Links    How Do I’s    Special Notice             

“Related Links”/“How Do I” Combined Module    Function: The “Related Links/How Do I” module provides a list of frequently used shortcuts  combined into one single module that provides access to other web pages/content that may be  related to the topic and/or subject. Typically for deep content areas, usually found on the  overview, landing and content pages.  Related links can point to web pages that are in different  sections of the web site.     Treatment (TM)   Background color (#FFFFFF)   Module title text color (#)   Link text color (#)   No‐Underline static state   Blue‐underline hover state   Visited link color (#)   Horizontal rule color (#)   Border color(#)  Elements   Module Title(s)   Hyper links (5‐7 max)   Character Limit (#)   Horizontal Rule  Placement   On overview pages, landing pages and content  pages   Ordering  Prominent module (1) 

     


“Related Links”/“How Do I” Individual Modules    Function: The “Related links/How Do I” individual modules provides a list of frequently used  shortcuts broken out into individual modules that provide access to other web pages/content  that may be related to the topic and/or subject. Typically for deep content areas, usually found  on the overview, landing pages and content pages.  Related links can point to web pages that  are in different sections of the web site.     Treatment (TM)   Background color (#FFFFFF)   Module title text color (#)   Link text color (#)   No‐Underline static state   Blue‐underline hover state   Visited link color (#)   Border color(#)  Elements   Module Title(s)   Hyper links (5‐7 max)   Character Limit (#)  Placement   On overview pages, landing pages and content   pages   Ordering  Prominent module (1) 

   

“Special Notice” Module    Function: The “Special Notice” module emphasizes a particular event or message that needs  high visibility. Typically found on overview, landing and content pages.   This notice should be  used sparingly, and for timely information.     Treatment (TM)   Background color (#)   Module title text color (#)   Body text color (#)   Link text color (#)   Underline static state   Underline hover state   Visited link color (#)   Border color(#)  Elements   Module Title   Hyper link (1 max) 


 Character Limit (#)   Image  Placement   On overview pages, landing pages and content   pages   Ordering  Prominent module (2) 

   

       


Body Modules: Business Rules & Design Definition  

Template Definition Documentation - Business rules, design treatment, function, placement, expected behavior and interaction.

Advertisement
Read more
Read more
Similar to
Popular now
Just for you