Accessibility Tool

Advanced Banner

The advanced banner offers several customization options for slider controls and caption text. This area is left open to any HTML input desired. For best practices, only text, links, and sometimes images should be included. Avoid using container elements such as "div" in the caption.

Best Practices

  • Paginated controls and/or previous and next arrows are REQUIRED.
  • All autoplaying media MUST have a way to pause. A visible pause button (Advanced Banner 2017 - Full Controls) is best for user experience.
  • Slide captions must conform to ADA AA contrast guidelines (Web AIM Contrast Checker). For transparent or gradient backgrounds, text must pass contrast specifications against the lightest/darkest color that may appear in the background.
  • Slide text styling should display properly at all device widths (320-1920px) and should be able to accomodate more or less verbiage.
  • Links must display an obvious change (other than color) on hover/focus.
  • Slider images should have large enough dimensions to scale up to HD resolution. Avoid overlaying text on panoramic images as this can be problematic on smaller desktop resolutions.
  • Image file sizes should be as close to 100KB as possible without large amounts of quality loss (High control image compresion).

Render Templates

The HTML structure of a portlet is determined by the render template in use. Portlets have multiple render templates to choose from, and our development team has the ability to create new render templates based on client need.

advanced-simple

Advanced Banner - Simple

This slideshow features static slides controlled by previous/next buttons and a caption area.

Read more
advanced-full-controls-2017

Advanced Banner 2017 - Full Controls

This slideshow features an autoplay function, a pause/play button that appears on focus, paginated slide controls, previous/next buttons, and a caption area.

Read more
advanced - 2017

Advanced Banner 2017

This slideshow features an autoplay function with pause on hover, paginated slide controls, previous/next buttons, and a caption area.

Read more

Side-by-side Comparisons

2020 © All Rights Reserved | Website Design By: Intrado | Login