Audit of Editorial UI

Over time, the content areas of our CMS have seen the implementation of various User Interface (UI) solutions. Often grassroots in origin, these Editorially Created UI elements, composed of inline styles, in-page styles, and JavaScript, present considerable maintenance and update challenges.

To manage this tech debt, our bulk conversion process aims to remediate or remove these elements. The goal is to align our UI with the Arches Enterprise Design System, which entails eliminating non-conforming in-page JavaScript and Styles.

To facilitate this, we're conducting an audit of the Editorially Created UI components. This audit plays a crucial role in forming a plan that ensures website functionality while addressing unnecessary complexity.

Processing Notes.

This process involves a meticulous examination and subsequent remediation of all editorially integrated links - a prerequisite before launching any audit. Our audit also thoroughly reviews content areas embedded with script and style blocks. Particular attention is given to the returned content scrape, which is systematically converted into a Unicode format that's safe for coding.

As part of this procedure, we identify and replace certain patterns, such as "<" and ">", with their equivalent symbols, and transform specific HTML entity codes into spaces and carriage returns, thereby improving block readability. This method allows the team to evaluate readable blocks effectively and discover any "new" patterns, which aids in documenting necessary remediation steps. This systematic approach prepares us for the eventual removal of style and script blocks, creating the necessary tickets or steps as required.

Numbered Steps:

  1. Begin by running the remediation of all editorially included links that are set to "Save" before initiating the audit.
  2. Perform an Audit Report of content areas that contain script and style blocks on the page.
  3. Ensure the returned content scrap is converted into a code-safe Unicode because of the Content Scrape Limitations.
  4. Identify and replace specific patterns, such as "<" and ">", with their corresponding symbols.
  5. Substitute certain HTML entity codes into space and transform others into carriage returns.
  6. Evaluate the now readable blocks after the aforementioned transformations.
  7. Discover any new patterns that emerge from the evaluation, and document the appropriate remediation steps.
  8. Finally, create any necessary tickets or steps to prepare for the obliteration of style and script blocks.

Audit Report

Item ID In Page CSS Link Found In Page JavaScript Link Fount Script Block Found Style Block Found
0234234923423 Y Y N N

Content Scrape Limitations

To make the code more readable, it's crucial to replace certain Unicode characters with their typical representations. Specifically, we'll be dealing with the following conversions:

  • The Unicode for the carriage return, _000D_, should be replaced with a visual marker for carriage returns such as the symbol "↵".
  • The Unicode for the horizontal tab, _0009_, could be replaced with a few spaces for better visualization.
  • The Unicode for the space, _0020_, can be substituted with a visible space character.
  • The line feed character, represented by the Unicode _000A_, can be swapped with a new line symbol like "␤" to depict line breaks better.
  • The tab character, also represented by _0009_, should be replaced with a few spaces for clarity.
  • Finally, the Unicode for less than and greater than symbols, &lt; and &gt;, can be converted to their actual "<" and ">" symbols.

By transforming these Unicode characters into their corresponding visual representations, we significantly enhance the comprehensibility of the document, thus facilitating easier identification of different elements and their spacing.