X

It's never been more convenient to be in compliance

Complying

Making your websites accessible to people with visual impairments is a necessary but time-consuming task.

Read Write Tools takes on the task of compliance with dedicated shorthand symbols to help with accessibility and visibility.

WAI shorthand

The Web Accessibility Initiative - Accessible Rich Internet Applications (WAI-ARIA) is a far reaching specification for solving problems related to readers with disabilities. Authors who want to comply with the standard frequently need to assign roles to phrases. They can do this using the plus-sign + shorthand-directive at the beginning of any phrase, followed by one of the designated WAI role names. The plus-sign symbol is emitted by the BLUEPROCESSOR as the role attribute.

div +document {
h1 A to Z of Monstrous Creatures
section +article {
h2 Abominable Snowman
}
section +article {
h2 Zombies in Modern Culture
}
}
Original BLUEPHRASE
<div role=document>
<h1>A to Z of Monstrous Creatures</h1>
<section role=article>
<h2>Abominable Snowman</h2>
</section>
<section role=article>
<h2>Zombies in Modern Culture</h2>
</section>
</div>
HTML equivalent

RDFa shorthand

Human beings aren't the only ones with disabilities! Computer search engines can oftentimes be blind to the contextual meaning of your words. RDFa structured data schemas can explicitly tell search engines how to disambiguate your words.

Structured data schemas are domain-specific vocabularies for describing entities, relationships between entities, and actions.

Authors who want to mark portions of their document with these vocabularies can do this using the question-mark ? shorthand-directive at the beginning of any phrase, followed by one of the domain-specific vocabulary words. The question-mark symbol is emitted by the BLUEPROCESSOR as the property attribute.

div {
h1 ?name Avatar
div ?director {
Director: << ?name James Cameron>>
}
<< ?genre Science fiction>>
<<a ?trailer `../movies/avatar.html` Trailer>>
}
Original BLUEPHRASE
<div>
<h1 property=name>Avatar</h1>
<div property=director>
<p>Director: <span property=name>James Cameron</span></p>
</div>
<p><span property=genre>Science fiction</span></p>
<p><a property=trailer href='../movies/avatar.html'>Trailer</a></p>
</div>
HTML equivalent

It's never been more convenient to be in compliance

🔗 🔎