Skip to content

Perchford design system

Internal, noindex
EDU-12

Read next strip

The end of an article, on a dark field. Two pieces weighted equally, each with the next step named rather than implied, so the reader chooses instead of being steered.

Untriaged
Open isolated

Use it when

The end of an article, on a dark field. Two pieces weighted equally, each with the next step named rather than implied, so the reader chooses instead of being steered.

Category
Education and FAQ
Layout archetype
Split screen
Page position
middle (derived)
Purpose
explain (derived)
Field
dark (derived)
Interaction
static (derived)
Motifs
Register, Quiet field

Content it requires

  • Exactly two articles
  • A position line such as next in this series or related
  • A standfirst of 20 to 30 words each

Do not use it when

  • Two only. The point is a choice a reader can hold in mind, which three destroys.
  • Shares the split archetype with HRO-06 and CTA-03. Never two of them on one page.
  • Use this or a closing call to action, not both. Two asks at the end of an article cancel each other out.
  • The position lines must be honest. Labelling an unrelated piece as next in the series is the fastest way to lose a returning reader.

Variants

None. Colour swaps and mirrored alignment do not count as variants.

Implementation

src/components/patterns/EduReadNextStrip.astro

---
import EduReadNextStrip from '../components/patterns/EduReadNextStrip.astro';
---

<EduReadNextStrip />

Import directly. Do not route production through patternComponents.

Production usage

Not yet used on a production page. Nothing here has been proven in front of a customer.

Accessibility

  • Verified at 360, 768, 1024, and 1440 with no horizontal overflow.
  • No interactive controls beyond links and buttons inherited from the design system.
  • Colour never carries meaning alone: every state marker is paired with text.
  • Motion respects prefers-reduced-motion.