Map a Human-Approved Reading Sequence Against Observed DOM Order — Free
A page’s content can be visually rearranged while its underlying sequence stays elsewhere. Enter a human-approved order and observed DOM ranks to locate displaced blocks without confusing order comparison with a full accessibility audit.
The proof surface
Heading audits inspect levels and outline structure. This matrix compares the sequence of actual content blocks, validates two complete rank permutations and shows direction and displacement; it neither reads the DOM automatically nor declares a logical sequence for the user.
Inputcontent block | expected sequence rank | observed DOM rank; largest displacement allowed before a review mark
Rare deviceHeading audits inspect levels and outline structure. This matrix compares the sequence of actual content blocks, validates two complete rank permutations and shows direction and displacement; it neither reads the DOM automatically nor declares a logical sequence for the user.
Output artifactBlocks beyond the chosen displacement setting with row-by-row context
Cost$0 local calculation · no card, paid key, subscription or signup · proposed filing price is not for sale
Sample, not your facts: Illustrative inputs: Introduction | 1 | 1; Footnote | 4 | 2; Chart caption | 2 | 3; Context paragraph | 3 | 4. Largest displacement allowed before a review mark = 0. Blocks beyond the chosen displacement setting: 3 blocks needing sequence review. All records are invented.
Before using the sequence-permutation matrix
First determine which blocks carry meaning and what order makes the document understandable. A multi-column layout may require a different logical sequence from a simple left-to-right scan, so the expected rank needs human review. Then observe the actual DOM sequence with browser tools or an approved assistive-technology workflow and number the same blocks. This instrument keeps those two observations side by side. It does not fetch a webpage, parse uploaded HTML or infer reading order from pixels. Labels should describe blocks, not include private page content. A complete permutation forces the same set of blocks to appear exactly once in each order; if one is missing, fix the inventory before comparing positions. The result gives a reviewer a concrete place to inspect, not an automatic remediation command.
Why the flat version breaks
Assuming left-to-right visuals decide logic
Columns, captions and supporting notes can require a deliberate semantic sequence. The expected order is a reviewed input, not a rule inferred by the app.
Comparing incomplete inventories
A missing block can shift every later rank. Both columns must be complete permutations of the same entered block set before displacement has meaning.
Treating displacement as severity
One position can break comprehension while several positions can be harmless. The numeric distance is a review aid, not an accessibility impact rating.
How to work the sequence-permutation matrix
Agree on a meaningful expected sequence
Choose the logical order with the document owner and people who use the content. Do not automatically equate visual position with correct reading order. Use stable descriptive block labels without private text.
Observe the same blocks in the DOM
Record a whole rank for every inventoried block. Expected and observed columns must each use one through the row count exactly once. The parser refuses duplicate, missing or out-of-range ranks.
Compare direction as well as distance
Displacement is observed rank minus expected rank; its absolute value determines the review mark against your setting. Row notes show whether a block moved earlier or later. The headline counts marked blocks, not a weighted accessibility score.
Review the actual user path
Inspect the flagged blocks in the browser, test reading and interaction with users, and ask a qualified accessibility specialist about consequential changes. Matching ranks alone cannot certify headings, focus order or meaningful sequence.
What the sequence-permutation matrix separates
Question
Before
Inspect this instead
Assuming left-to-right visuals decide logic
Columns, captions and supporting notes can require a deliberate semantic sequence. The expected order is a reviewed input, not a rule inferred by the app.
Observe the same blocks in the DOM
Comparing incomplete inventories
A missing block can shift every later rank. Both columns must be complete permutations of the same entered block set before displacement has meaning.
Compare direction as well as distance
Treating displacement as severity
One position can break comprehension while several positions can be harmless. The numeric distance is a review aid, not an accessibility impact rating.
Review the actual user path
This sequence-permutation matrix replaces a manual count or calculation, not source verification or the responsible person’s review.
Run it on the samples, right here
FIRST-LOAD
HYPOTHESIS / PROTOTYPE — checkout unavailable. Calculation is local. A draft is saved automatically in this browser profile when storage is available; Reset to sample clears it. Optional Pro history stores only five summaries and has its own deletion control. State links encode your inputs and can remain in browser history, clipboard or recipients’ records; share only non-sensitive rows. Optional external AI formatting leaves this device. The required site analytics beacon reports page activity; shared URLs contain encoded inputs. Do not treat an encoded URL as private. The calculator has no input-collection endpoint.
Sequence-comparison arithmetic only, not an accessibility certificate, automated DOM audit or determination of the correct reading order. It compares human-supplied ranks and does not test assistive technology, focus order or comprehension. Review the actual page with users and a qualified accessibility specialist before making consequential layout or semantic changes.
Data note: The sequence-permutation matrix processes content block | expected sequence rank | observed DOM rank locally. Starter/sample selection and Run compute in this tab; no input is sent by the calculator. A local draft may be saved; explicit state-link sharing or optional external AI formatting can disclose inputs. Use non-sensitive labels.
Go deeper: the companion app files the same reading as a scored comparison matrix
The article demo above runs without limits. The companion app keeps a local history, exports the rows as CSV, prints the sequence-permutation matrix reading, and holds your drafts on this device — one complete free app run; the proposed $4 one-time filing layer is not for sale.
The sequence-permutation matrix answer stays complete for free. The proposed $4 one-time filing layer adds row CSV, print and five local reading summaries, not hidden answers. Checkout is unavailable; the article demo remains unlimited.
Sequence-comparison arithmetic only, not an accessibility certificate, automated DOM audit or determination of the correct reading order. It compares human-supplied ranks and does not test assistive technology, focus order or comprehension. Review the actual page with users and a qualified accessibility specialist before making consequential layout or semantic changes.
What this is built on
Method: Displacement is observed rank minus expected rank; its absolute value determines the review mark against your setting. Row notes show whether a block moved earlier or later. The headline counts marked blocks, not a weighted accessibility score.
All sample records, dates, quantities and labels are invented. No outside policy, contract, rate, clock offset, measurement or accessibility standard is represented as verified.
Google’s official pricing documentation, fetched 2026-09-30, says AI Studio is free in available regions. Optional formatting may require a Google account; manual local entry requires none. Limits can change and free-tier content may be used to improve products. Do not send private records.
Before: a visual layout could hide a different underlying sequence. After: two complete rank permutations expose earlier and later blocks without declaring the correct logic.
Setting: Largest displacement allowed before a review mark = 0. Expected summary: 3 blocks needing sequence review.
The human-approved sequence puts Introduction first, Chart caption second, Context paragraph third and Footnote fourth. The observed DOM order puts Footnote second and shifts the other two later. Three blocks differ, with Footnote displaced two positions and the other two one position each. The matrix is sorted by expected rank so the intended sequence is visible. It does not assert that matching visual order is always correct; the expected sequence must already have a sound logical basis.
Setting: Largest displacement allowed before a review mark = 0. Expected summary: 0 blocks needing sequence review.
When observed ranks match the approved sequence, no block exceeds a zero-displacement setting. That reconciliation can still leave missing headings, unusable controls, unannounced content or bad reading logic. The tool checks only the complete entered permutation. Keep the actual reading-order test in the browser or assistive technology alongside this working matrix; a neat rank table cannot replace it.
Sample C — boundary convention
Opening block | 1 | 2
Closing block | 2 | 1
Setting: Largest displacement allowed before a review mark = 0. Expected summary: 2 blocks needing sequence review.
A two-block reversal marks both blocks, each one position away from the approved order. The sum of displacements would be two, but the headline deliberately counts affected blocks rather than treating positions as a severity scale. Duplicate ranks or a missing rank are rejected because both expected and observed columns must be a permutation of one through the number of entered blocks. Those structural checks keep an omitted or duplicated block from masquerading as an order comparison.
Optional AI formatting, never the calculation
Manual entry completes this sequence-permutation matrix for free without signup. If available to you, the free AI Studio interface linked in the sources may format fictional or non-sensitive notes; external access may require an account. No API key or AI call is built into this tool. Free-tier content may be used to improve products. Review each cell and transcribe it to the labeled row schema; do not paste the JSON object into the row box.
Format only these fictional or non-sensitive notes for a sequence-permutation matrix. Return strict JSON shaped as {"rows": [{"label": "string", "cells": ["string", "string"]}], "setting": "string"}. The columns are content block | expected sequence rank | observed DOM rank; the setting is Largest displacement allowed before a review mark. Keep all supplied strings and quantities exactly; do not calculate, infer missing entries, invent dates or add advice. If any required value is missing, return an empty rows array and ask me for it separately. I will verify every cell against my source and manually transcribe rows using vertical bars before running the local calculator.
An AI response is not executed, fetched or trusted as a result. Missing values remain questions; the strict local parser checks the rows you actually enter.