The Humane Web: How a Single Line of Code Aims to Shield Dyslexic and Photosensitive Readers

As a dyslexic I wanted to help reading but after i talked to my friernds epileptics so I ask myself can the modern web remains a visually hostile terrain. Between autoplaying promo videos, flashing banners, and tight typography, navigating an everyday article can be an exhausting task for individuals with dyslexia, and an outright hazard for those with photosensitive epilepsy. While corporate accessibility compliance often ends with basic contrast tweaks and hidden screen-reader tags, an open-source project I worked on AccessiRead.js can demonstrat how much friction can be dissolved with a single <script> tag.

Weighing in with zero dependencies, the library delivers an immediate client-side toolkit designed around dual priorities: neutralizing visual motion triggers and reformatting text for cognitive legibility.

Core Safeguards at a Glance

The toolkit splits its defenses across two distinct operational engines:

Module	Core Interventions	Primary Benefit
Dyslexia Engine	Specialized typefaces (OpenDyslexic, Lexend), widened kerning, generous leading, cream glare-reduction backgrounds.	Eliminates typographical crowding, anchors letterforms, and stabilizes reading focus.
Interactive Reading Aids	Dynamic reading ruler, active word-hover luminescence, and paragraph-level click-to-speech.	Provides mechanical eye tracking and multi-sensory reinforcement.
Epileptic Safe Mode	Global CSS animation halt, animated GIF freezing, automated video suspension, and iframe pause.	Neutralizes rapid luminance shifts and strobing effects that trigger seizures.
Universal Toolbar	Draggable floating control deck and client-side bookmarklet injection.	Gives readers direct autonomy over their visual environment across any website.

Instant Implementation

Deploying the library requires no build systems or complex pipelines. Placing the script before the closing </body> tag mounts the framework:

HTML

<!-- Include before </body> -->
<script src="accessiread.js"></script>
<script>
  AccessiRead.init({
    dyslexia: true,   // Activates typographic stabilization
    epilepsy: true,   // Freezes animations, videos, and strobing
    toolbar: true     // Injects user-facing control deck
  });
</script>

Key Programmatic Controls

For developers building deeper accessibility flows, the API exposes granular programmatic hooks:

Typographic and Reading Flow

JavaScript

// Enable custom dyslexia profile
AccessiRead.dyslexia.enable({
  font: 'OpenDyslexic',
  letterSpacing: '0.12em',
  wordSpacing: '0.18em',
  lineHeight: '1.9',
  background: '#fdf6e3',
  text: '#2c2c2c',
  highlightWords: true,
  clickToSpeak: true,
  ruler: true
});

// Mechanical tracking & TTS controls
AccessiRead.dyslexia.ruler.toggle();
AccessiRead.dyslexia.tts.speak("Reading selected passage aloud.");
AccessiRead.dyslexia.tts.stop();

Epilepsy Neutralization

JavaScript

// Instant seizure defense
AccessiRead.epilepsy.enable();

// Granular execution overrides
AccessiRead.epilepsy.stopAllAnimations();
AccessiRead.epilepsy.pauseAllMedia();

The Universal Bookmarklet

Readers browsing external sites that lack built-in accessibility features can force AccessiRead into any page session by creating a custom browser bookmark with this URI:

JavaScript

javascript:(function(){var s=document.createElement('script');s.src='https://your-host/accessiread.js';s.onload=function(){AccessiRead.init({dyslexia:true,epilepsy:true});};document.head.appendChild(s);})();

A Design Philosophy Centered on Dignity

What makes AccessiRead notable is not algorithmic complexity, but deliberate empathy. By giving users the immediate power to quiet visual noise, swap fonts to weighted alphabets, and freeze hazardous animations, the project demonstrates that accessibility does not have to be an expensive enterprise overhaul. It can be a direct, lightweight intervention that meets the reader exactly where they are.