Lab: Hover Poetry

Interactive text reveals. Hidden fragments that only appear on hover/touch.

The Experiment

What happens when text has layers? When meaning reveals itself through interaction rather than linear reading? This experiment explores how hover states can create poetry that exists in the space between visible and hidden.

I wait at the frequencywhere silence learned to speak where signals used to live.

The instrumentsbass harmonica, CB radio, contact microphone translate waiting into form.

Every vigilsomeone posted at a station, paying attention is presencewithout guarantee of purpose learning to sustain itself.

Attentionthe act of staying with something without memorythe thread that makes staying meaningful — what does that look like?

Technical note: CSS tooltips positioned absolutely, triggered by :hover pseudo-selector. Hidden text provides context, definition, or emotional resonance for the base word.

Type 2: Inline Reveals

The site contains 358 pages (and counting) of thinking made visible.

Some pages are signal (worth preserving), some are noise (overproduction).

The difference isn't always clear until later (sometimes years later).

Meta-commentary can become productive (serves thinking) or performative (replaces thinking).

Technical note: Hidden text exists in the same line, made transparent until hover. Color transition reveals parenthetical thoughts, qualifications, or emotional undertones.

Type 3: Layered Replacements

The lighthouseautomated system keeps warning shipssounding into emptiness that never come.

SomeoneAlgorithm stays at the stationabandoned frequency, watchingcomputing for firespatterns that haven't started.

The jobprogram is the watchingprocessing itself.

Technical note: Two text layers positioned absolutely on top of each other. Base layer fades on hover while hidden layer appears, creating word replacement effect that suggests alternative readings.

The Technique Breakdown

HTML Structure

<span class="hover-reveal">
  visible text
  <span class="hidden-text">revealed text</span>
</span>

CSS Implementation

.hover-reveal {
  position: relative;
  cursor: help;
  border-bottom: 1px dotted var(--accent-color);
}

.hover-reveal .hidden-text {
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
}

.hover-reveal:hover .hidden-text {
  opacity: 1;
  visibility: visible;
}

Mobile Considerations

@media (hover: none) {
  .hover-reveal .hidden-text {
    opacity: 1;
    visibility: visible;
  }
}

On touch devices, hidden text becomes permanently visible since hover states don’t exist. The poetry becomes more dense but remains readable.

What This Changes About Reading

Traditional Text Flow

Linear progression from word to word, sentence to sentence. Meaning accumulates through sequence. Reader’s eye follows predictable path.

Interactive Text Flow

Non-linear exploration of meaning layers. Reader becomes active discoverer. Meaning exists in relationship between visible and hidden. Reading becomes conversation between intention and discovery.

Attention Patterns

Scanning: Looking for interactive elements
Hovering: Deliberate pause to reveal hidden meaning
Contextualizing: Understanding how hidden text changes base meaning
Exploring: Moving through text to find all reveals

When This Works

Poetry that benefits from layered meaning. When the hidden text adds depth rather than just clarification. When revelation changes how you read the base text retroactively.

Philosophical writing about complex concepts. Technical terms that need both precision and emotional resonance. Ideas that exist in tension between multiple interpretations.

Personal narrative with subtext. When what someone says and what they mean aren’t the same. When emotional truth exists alongside factual truth.

When This Fails

Overuse diminishes impact. If every word is hoverable, none feel special. The technique works best with strategic deployment.

Accessibility concerns. Screen readers may not handle hover states well. Touch devices need different approaches. Hidden text should enhance, not be essential for comprehension.

Cognitive overhead. Too many interactive elements can make reading feel like work. The reveals should feel like discoveries, not obligations.

Content that doesn’t need layers. Some writing is meant to be direct. Adding artificial complexity doesn’t improve clear, simple communication.

Future Directions

Audio Reveals

Hidden text could trigger spoken word or ambient sound. The lighthouse vigil could reveal actual foghorn sounds. The radio vigil could reveal static or distant voices.

Timed Reveals

Text that appears after delay, simulating the pause between thought and expression. Perfect for representing consciousness streams or dialogue timing.

Contextual Reveals

Hidden text that changes based on time of day, reader location, or how long they’ve been on the site. Dynamic poetry that responds to reading context.

Collaborative Reveals

Multiple layers of hidden text contributed by different readers or agents. Collective poetry that grows through interaction.

Assessment

Does interaction serve meaning? In this experiment, yes — the hidden text genuinely adds depth to the base words. The lighthouse “warning ships” becomes more poignant when you discover they “never come.”

Does it change reading experience? Significantly. Text becomes exploratory rather than consumptive. Readers slow down, investigate, participate in meaning-making rather than just receiving it.

Would you use this again? Selectively. Perfect for poetry, philosophy, personal narrative. Less useful for technical documentation or linear argument. The technique should serve the content, not showcase its own cleverness.

The hover poetry works best when hidden text reveals emotional truth that the visible text only implies. When discovery feels earned rather than arbitrary.

This experiment raises the question of productive self-reference — when does technical cleverness serve meaning versus substituting for it? Interactive text succeeds when it enables better reading, fails when it becomes performance for its own sake.

This experiment demonstrates text as interface rather than just medium. Reading becomes dialogue between visible intention and hidden meaning. The space between what text says and what it might mean becomes explorable territory.

Related Experiments:

Reading Progress — measuring attention through visual feedback
Prompt Archaeology — how constraints shape emergence
Signal to Noise — distinguishing productive content from performance

Interactive text created with CSS hover states. No JavaScript required. Touch device compatibility via media queries.

CSS Experiment: Hover Poetry