The checklist — Website Autism

Overall progress0/117 (0%)

Use smart quotes, not straight quotes

critical

Use proper apostrophes

critical

Use em-dashes for breaks in thought

critical

Use en-dashes for ranges

critical

Use hyphens only for compound words

critical

Use primes for measurements, not quotes

critical

Single space after periods

critical

Use midpoint (·) for inline lists

critical

Use true italic, not faux italic

critical

Use true bold, not faux bold

critical

Limit to 2 typefaces maximum

critical

Use variable fonts when available

critical

Subset fonts for performance

critical

Body text 16–24px on desktop

high

Line length 45–75 characters

high

Line height 1.45–1.5 unitless

high

Use a modular scale for sizes

high

Responsive type with clamp()

high

No letterspacing on body text

high

Add letterspacing to uppercase text

high

Paragraph spacing OR indents, never both

high

Subheads closer to following text

high

Enable font-kerning: normal

medium

Enable standard ligatures

medium

Disable ligatures in code blocks

medium

Use tabular figures in data tables

medium

Use real small caps, not fake ones

medium

One h1 per page

medium

20–25% minimum size jump between levels

medium

Lighten weight as size increases

medium

Never match heading colour to link colour

medium

Fix widows in headlines with text-wrap: balance

medium

Use non-breaking spaces for number + unit

medium

Don’t centre-align body text

medium

Match stress angles when pairing

medium

Don’t pair two similar sans-serifs

medium

Superfamilies eliminate pairing risk

medium

Never animate keyboard-initiated actions

critical

Every animation needs a purpose

critical

Rare interactions get more personality

critical

Never use ease-in for entrances

critical

Use ease-out for most UI transitions

critical

Use custom cubic-bezier curves

critical

Buttons: 100–160ms

high

Modals: 200–350ms

high

Drawers: 250–400ms

high

Enter slower than exit

high

Total stagger duration under 300ms

high

Use springs for drag and gesture

high

Springs maintain velocity on interrupt

high

Use duration + bounce over raw spring params

high

Only animate transform and opacity

high

will-change on hover, not permanent

high

Respect prefers-reduced-motion

high

Pause off-screen animations

high

Popovers emerge from their trigger

medium

Scale from 0.95, not 0

medium

Directional tabs move left/right

medium

Stagger 30–50ms per item

medium

Exit animations faster than enter

medium

Animations should not cause layout shift

medium

Use concentric border radius

critical

Use 4px or 8px spacing grid

critical

Optical centring for icons in circles

critical

Semantic HTML before ARIA

critical

Icon buttons need aria-label

critical

Skip links on every page

critical

Minimum 4.5:1 contrast ratio

critical

Heading hierarchy without skipping levels

critical

Hit targets 44px minimum on mobile

critical

Focus trap in modals

critical

Restore focus on dialog close

critical

Links navigate, buttons act

critical

Hover gates with @media(hover: hover)

critical

Every input needs a visible label

critical

Set autocomplete attributes

critical

Use inputmode for mobile keyboards

critical

Inline errors with focus management

critical

Minimum 16px font on mobile inputs

critical

Flex/grid, not JavaScript measurement

high

overscroll-behavior: contain on modals

high

Design empty states

high

Design loading states

high

Design error states

high

Set width and height on images

high

Preload critical fonts

high

Use font-display: swap

high

Preconnect to font origins

high

Image outlines on white backgrounds

medium

Layered subtle shadows

medium

Audit every border and separator

medium

Navigation chrome below content

medium

Use verb + object for button labels

critical

Error messages include what, why, and what to do

critical

Active voice in all UI copy

high

Loading ellipsis on multi-step actions

medium

env(safe-area-inset-*) for fixed/sticky elements

high

Never disable browser zoom

critical

100dvh instead of 100vh on mobile

high

Lead with Why, not What

critical

The customer is the hero, not the brand

critical

Every heading passes the “so what?” test

critical

CTA = verb + outcome + qualifier

high

Never use “Submit” or “Click here”

high

Sentences under 25 words

high

Cut “in order to” and “we believe”

high

Replace adjectives with specific numbers

high

Show, don’t tell

high

Every claim needs evidence

high

Scan for Tier 1 words: delve, leverage, robust, seamless

medium

No em-dash chains in copy

medium

No chatbot artifacts

medium

No formulaic Rule of Three lists

medium

Vary paragraph lengths

medium

Homepage serves highest-value segment

medium

Landing page message-matches the ad

medium

One primary CTA per page

medium