Alaska is a simple text formatter for web

It automatically formats the text content of a web page to have the right quotes, no-break spaces, em-dashes, and more.

BEFORE

Professor J.R.R. Martin's groundbreaking study from 2018-2023 on NASA's revolutionary 3x5 meter chamber--valued at 15,000 USD (c) 2022--shows that maintaining 68oF temperatures while processing 10 + 5 = 15 terabytes resulted in a 92% improvement , and he concluded 'The data... it's truly remarkable' , with 1/2 of experiment no.7 exceeding expectations.

AFTER

Professor J.R.R. Martin's groundbreaking study from 2018-2023 on NASA's revolutionary 3x5 meter chamber--valued at 15,000 USD (c) 2022--shows that maintaining 68oF temperatures while processing 10 + 5 = 15 terabytes resulted in a 92% improvement , and he concluded 'The data... it's truly remarkable' , with 1/2 of experiment no.7 exceeding expectations.

Try it out


Let endurance have its perfect work, that you may be perfect and complete, lacking in nothing

Set it up

Include Alaska in the <head> of your page:

<head>
  ...
  <script src="/path/to/alaska.js" defer></script>
  ...
</head>

Now all nodes with text content and class="alaska" will be formatted, including their child nodes:

<p class="alaska">
  This text will be formatted.
  <span>This text will be formatted too.</span>
</p>

To avoid formatting text in certain child nodes, such nodes should include class="alaska-skip":

<p class="alaska">
  This text will be formatted.
  <span class="alaska-skip">And this won't.</span>
</p>

If you plan on manipulating document and want added or modified elements to be formatted, you should include class="alaska-observe":

<div class="alaska-observe">
  ...
  <!--Alaska will format added or modified nodes in here-->
  ...
</div>

Alaska supports english and russian languages. By default, the lang attribute of the <html> element is the primary language of the document:

<html lang="en">
  ...
  <p>‘Quotes’</p>
  <p>‘Кавычки’</p>
  ...
</html>

If your document is a mix of english and russian and you want to have correct formatting in both languages, specify the lang attribute as needed:

<html lang="en">
  ...
  <p>‘Quotes’</p>
  <p lang="ru">«Кавычки»</p>
  ...
</html>

By default, all rules are applied. You can control where and which rules are applied by adding the attributes as needed:

<p class="alaska">
  All rules will be applied to this text
  <span data-place-emdash="false">All rules are applied, except -- the em-dash rule.</span>
</p>

Learn the rules

Below are rules. Select necessary and unnecessary rules -- corresponding attributes are generated automatically:

all rules are applied