Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 23 Next »

Work in Progress

This page is work in progress.


People are incredibly diverse - each person will have different needs, preferences, and ability to adapt to situations. Since most web content is primarily static once published or delivered to a web browser, how can websites change and adapt to account for such human diversity and changing contexts with minimal disruption?

UI Options provides a way to enhance or improve website usability, flexibility, and accessibility by providing a way to customize and control aspects of a website without the need for additional software or tools. For those who design, build, or maintain websites, UI Options can also help reveal areas where the web content and structure can be changed to improve flexibility and robustness.

What is UI Options?

UI Options is a "widget" that can be added to websites that provide ways for visitors to adjust the website's presentation, perceptibility, and usability. Currently UI Options can:

  • adjust text size and style
  • increase line spacing
  • change colour contrast
  • add a table of contents
  • emphasize links, buttons, and other inputs

UI Options works within the website and does not require any additional software to be installed - visitors needs only a modern web browser (latest Google Chrome, Mozilla Firefox, Apple Safari, and Microsoft Edge). UI Options works with Internet Explorer 11 (with support ending with Infusion version 3 to be released in mid to late 2020).

Try the demo: You can try UI Options with this demo.

Introductory Video: This video (Youtube) summarizes the features of UI Options and goes over installation using the Zip package method.

Technical: UI Options works by modifying the displayed web page's CSS and HTML using Javascript. For example, UI Options colour contrast adjustment works by adding a contrast CSS class to the body HTML element. The Table of Contents feature is controlled by adding and removing a unique Nav element from the webpage.

Aside: Have an idea to improve UI Options? We're always looking to add new features. Send us an email / github etc.

Getting and Installing UI Options

UI Options can be obtained through a Zip package, built from Github source code, or via npm. Visit this guide for the instructions getting UI Options using one of these methods.

UI Options is also available as a plugin for Wordpress and Drupal.

There are a number of ways to get and install UI Options:

  1. Zip package
  2. Built from source code on github: recommended for users who require configurability and customization to fit their code project.
  3. npm
  4. Wordpress Plugin:
    1. Released with latest stable infusion release
    2. Directions / build process for using latest dev version.
  5. Drupal Plugin (maintained by ???)
    1. https://www.drupal.org/project/fluidui (maintained by https://openconcept.ca/)


Outline for Adding UIO:

  • Install
    • Detail instructions for the 5 methods above
  • Test
  • Fix issues
  • Updating / upgrading
  • Support, bug reporting
  • Wordpress Plugin


Questions to answer:

  • ongoing maintenance of UIO, upgrading, changes and new features, etc.
    • Managing UIO in a project
    • Error rendering macro 'jira' : Unable to locate Jira server for this macro. It may be due to Application Link configuration.
  • how to use UIO for wordpress
  • No labels