Why we procrastinate on the things we care about most
Procrastination isn't a time-management problem — it's an emotion-management problem. A look at what the delay is actually protecting you from.
stephenleynard.com
<!DOCTYPE html>
Psychology, plainly explained
I'm Stephen Leynard. This is a working notebook of ideas from psychology — the kind that explain a bad night's sleep, a decision you can't stop replaying, or why a habit sticks around long after it stops helping.
No jargon for its own sake, and no claims that outrun the evidence. Just clear, honest writing about the research that actually helps people understand themselves a little better.
Procrastination isn't a time-management problem — it's an emotion-management problem. A look at what the delay is actually protecting you from.
Comparing yourself to others isn't a character flaw — it's a built-in way we measure ourselves. The trouble starts with what we compare against.
A plain-language walkthrough of encoding, storage, and retrieval — and why "I remember it clearly" is one of the least reliable sentences in psychology.
Questions, corrections, or a topic you'd like covered — I read everything that comes in.
A simple, static psychology blog. No build step, no framework — just HTML, CSS, and a CNAME file. Built to run on GitHub Pages under a custom domain.
index.html Homepage: intro section + blog listing
styles.css All styling (one shared stylesheet)
CNAME Tells GitHub Pages to serve this at stephenleynard.com
posts/why-we-procrastinate.html Sample blog post
posts/the-comparison-trap.html Sample blog post
The layout uses a “field notebook” motif: a dotted binding rule down the left edge of the page with small rotated tabs marking each section (Intro, Field notes, Contact), an ochre accent for anything worth noticing, and a serif/mono pairing (Newsreader + JetBrains Mono) that reads like handwritten case notes rather than a marketing page. All of this lives in styles.css — change the CSS custom properties at the top of the file (--paper, --ink, --ochre, etc.) to adjust the palette globally.
/* ========================================================================== Stephen Leynard — Notes on the Mind Design system: “field notebook” — a psychologist’s working notes, not a marketing page. Warm parchment paper, a binding rule down the page, ink-blue headings, ochre for things worth noticing. ========================================================================== */
@import url(‘https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,400;1,6..72,500&family=Public+Sans:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap’);
:root { –paper: #f0eee4; –paper-alt: #e7e3d4; –paper-deep: #ddd8c4; –ink: #23241f; –ink-soft: #55564c; –indigo: #33415c; –indigo-soft: #55647f; –ochre: #a8763e; –sage: #57654f; –rule: #c9c4b0; –rule-strong: #a9a38a;
–font-display: ‘Newsreader’, Georgia, serif; –font-body: ‘Public Sans’, -apple-system, BlinkMacSystemFont, ‘Segoe UI’, sans-serif; –font-mono: ‘JetBrains Mono’, ui-monospace, Menlo, monospace;
–measure: 42rem; –binding: 3.25rem; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(–paper); color: var(–ink); font-family: var(–font-body); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: var(–indigo); text-decoration-color: var(–rule-strong); text-underline-offset: 3px; } a:hover { color: var(–ochre); }
a:focus-visible, button:focus-visible { outline: 2px solid var(–ochre); outline-offset: 3px; }
img { max-width: 100%; display: block; }
/* —- notebook binding: a rule down the left edge of the whole page, with small rotated section tabs marking where each part begins —- */
.notebook { position: relative; max-width: 62rem; margin: 0 auto; padding-left: var(–binding); }
.notebook::before { content: “”; position: absolute; top: 0; bottom: 0; left: calc(var(–binding) - 1px); width: 1px; background: repeating-linear-gradient( to bottom, var(–rule-strong) 0, var(–rule-strong) 6px, transparent 6px, transparent 12px ); }
.tab { position: absolute; left: 0; width: var(–binding); display: flex; align-items: center; justify-content: flex-end; padding-right: 0.85rem; font-family: var(–font-mono); font-size: 0.65rem; letter-spacing: 0.14em; color: var(–ink-soft); text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); top: 2.4rem; }
/* —- top bar —- */
.site-header { padding: 1.75rem 1.5rem 0; }
.site-header .notebook { display: flex; align-items: baseline; justify-content: space-between; padding-top: 0.25rem; padding-bottom: 1.5rem; }
.wordmark { font-family: var(–font-display); font-size: 1.35rem; font-weight: 600; color: var(–ink); text-decoration: none; letter-spacing: -0.01em; } .wordmark span { color: var(–ochre); } .wordmark:hover { color: var(–ink); }
.site-nav { display: flex; gap: 1.75rem; font-family: var(–font-mono); font-size: 0.78rem; letter-spacing: 0.04em; } .site-nav a { color: var(–ink-soft); text-decoration: none; border-bottom: 1px solid transparent; padding-bottom: 2px; } .site-nav a:hover, .site-nav a[aria-current=”page”] { color: var(–indigo); border-bottom-color: var(–ochre); }
/* —- hero / intro —- */
main { padding: 0 1.5rem; }
.hero { position: relative; padding: 2.75rem 0 4rem; border-bottom: 1px solid var(–rule); }
.eyebrow { font-family: var(–font-mono); font-size: 0.78rem; letter-spacing: 0.08em; color: var(–ochre); text-transform: uppercase; display: flex; align-items: center; gap: 0.6rem; margin-bottom: 1.1rem; } .eyebrow::before { content: “”; width: 1.4rem; height: 1px; background: var(–ochre); }
.hero h1 { font-family: var(–font-display); font-weight: 500; font-size: clamp(2.1rem, 4.6vw, 3.15rem); line-height: 1.12; letter-spacing: -0.01em; color: var(–ink); margin: 0 0 1.4rem; max-width: 30ch; } .hero h1 em { font-style: italic; color: var(–indigo); }
.hero-lede { max-width: var(–measure); font-size: 1.14rem; color: var(–ink-soft); } .hero-lede p { margin: 0 0 1rem; } .hero-lede p:last-child { margin-bottom: 0; }
.credentials { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 0.55rem 0.9rem; } .credential { font-family: var(–font-mono); font-size: 0.72rem; letter-spacing: 0.03em; color: var(–sage); background: var(–paper-alt); border: 1px solid var(–rule); padding: 0.3rem 0.6rem; border-radius: 3px; }
/* —- section heading pattern (used by blog + about) —- */
.section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin: 3.25rem 0 1.75rem; flex-wrap: wrap; } .section-heading h2 { font-family: var(–font-display); font-size: 1.7rem; font-weight: 500; margin: 0; color: var(–ink); } .section-heading .section-note { font-family: var(–font-mono); font-size: 0.75rem; color: var(–ink-soft); letter-spacing: 0.02em; }
/* —- blog entries —- */
.entry-list { border-top: 1px solid var(–rule); }
.entry { display: grid; grid-template-columns: 8.5rem 1fr; gap: 1.5rem; padding: 1.9rem 0; border-bottom: 1px solid var(–rule); }
.entry-date { font-family: var(–font-mono); font-size: 0.78rem; color: var(–ink-soft); padding-top: 0.3rem; }
.entry-body h3 { margin: 0 0 0.5rem; font-family: var(–font-display); font-size: 1.35rem; font-weight: 500; } .entry-body h3 a { color: var(–ink); text-decoration: none; } .entry-body h3 a:hover { color: var(–ochre); }
.entry-excerpt { margin: 0 0 0.9rem; color: var(–ink-soft); max-width: 56ch; }
.entry-meta { display: flex; align-items: center; gap: 0.8rem; flex-wrap: wrap; }
.tag { font-family: var(–font-mono); font-size: 0.68rem; letter-spacing: 0.03em; text-transform: uppercase; color: var(–sage); background: var(–paper-alt); border: 1px solid var(–rule); padding: 0.22rem 0.5rem; border-radius: 3px; }
.read-link { font-family: var(–font-mono); font-size: 0.78rem; text-decoration: none; color: var(–indigo); } .read-link::after { content: “ →”; } .read-link:hover { color: var(–ochre); }
.entry.is-draft { opacity: 0.7; } .entry.is-draft .tag.status { color: var(–ink-soft); }
/* —- margin note (signature accent, used sparingly) —- */
.margin-note { margin: 2.5rem 0; padding: 1.1rem 1.3rem; background: var(–paper-alt); border-left: 2px solid var(–ochre); max-width: var(–measure); font-family: var(–font-display); font-style: italic; font-size: 1.05rem; color: var(–ink-soft); }
/* —- about / contact —- */
.about-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; max-width: var(–measure); color: var(–ink-soft); } .about-grid p { margin: 0 0 1rem; }
.contact-list { list-style: none; padding: 0; margin: 1.5rem 0 0; display: flex; flex-wrap: wrap; gap: 1rem 1.75rem; font-family: var(–font-mono); font-size: 0.85rem; } .contact-list a { text-decoration: none; }
/* —- footer —- */
.site-footer { margin-top: 4rem; border-top: 1px solid var(–rule); padding: 1.75rem 1.5rem 3rem; font-family: var(–font-mono); font-size: 0.72rem; color: var(–ink-soft); } .footer-inner { max-width: 62rem; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 0.75rem; }
/* —- single post page —- */
.post-header { padding: 2.75rem 0 2rem; border-bottom: 1px solid var(–rule); } .post-header .eyebrow { margin-bottom: 1.2rem; } .post-header h1 { font-family: var(–font-display); font-weight: 500; font-size: clamp(1.9rem, 4vw, 2.65rem); line-height: 1.18; margin: 0 0 1rem; max-width: 26ch; } .post-meta { font-family: var(–font-mono); font-size: 0.78rem; color: var(–ink-soft); display: flex; gap: 1rem; flex-wrap: wrap; }
.post-body { max-width: var(–measure); padding: 2.5rem 0 1rem; font-size: 1.08rem; } .post-body p { margin: 0 0 1.3rem; } .post-body h2 { font-family: var(–font-display); font-weight: 500; font-size: 1.5rem; margin: 2.2rem 0 1rem; color: var(–ink); } .post-body blockquote { margin: 1.8rem 0; padding-left: 1.2rem; border-left: 2px solid var(–ochre); font-style: italic; color: var(–ink-soft); }
.back-link { display: inline-block; margin-top: 1rem; font-family: var(–font-mono); font-size: 0.78rem; text-decoration: none; color: var(–indigo); } .back-link::before { content: “← “; }
/* —- responsive —- */
@media (max-width: 640px) { :root { –binding: 2.1rem; } .site-header .notebook { flex-direction: column; align-items: flex-start; gap: 0.9rem; } .site-nav { gap: 1.1rem; } .entry { grid-template-columns: 1fr; gap: 0.4rem; } .entry-date { padding-top: 0; } .site-footer { flex-direction: column; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
<!DOCTYPE html>
Social psychology · Self-esteem
In 1954, the psychologist Leon Festinger proposed something that still holds up: in the absence of an objective way to measure ourselves, we measure ourselves against other people. There's no built-in ruler for "how well is my career going" or "how good is my marriage," so we borrow one — usually from whoever happens to be nearby.
This isn't a flaw to be trained out of yourself. It's a basic feature of how self-evaluation works. The useful question isn't "how do I stop comparing," which rarely succeeds, but "what am I comparing against, and is it a fair measure."
Comparison theory distinguishes between upward comparisons (against people doing better than you) and downward comparisons (against people doing worse). In ordinary life, both happen, and they roughly balance — you're reminded of your progress as often as your gaps.
Social media disrupts that balance badly. What you see is a curated upward slice: people's best days, best angles, best outcomes, stripped of the ordinary friction that fills most of anyone's actual life. You're not comparing your whole life to their whole life. You're comparing your whole life to their highlight reel — and the ratio that used to balance itself no longer does.
You are comparing your behind-the-scenes to everyone else's highlight reel.
Two adjustments tend to help. First, compare yourself to yourself six months ago, not to a stranger at an unknown stage of an unknown life — this restores a fair baseline. Second, when you notice an upward comparison forming, ask what specifically you're reacting to. Often it's not the outcome itself but a signal about what you want more of, which is far more useful to act on than the vague, deflating feeling of "everyone else has it figured out."
Comparison isn't going away, and it doesn't need to. It just needs a fairer target.
<!DOCTYPE html>
Motivation · Behavior
Ask someone why they're procrastinating and they'll usually blame their calendar: too little time, too many distractions, a to-do list that never shrinks. But the research tells a different story. Procrastination isn't primarily a scheduling failure — it's a way of managing how a task makes us feel.
The task you're avoiding right now probably isn't boring. It's the opposite: it matters. And that's exactly why it's uncomfortable. A task that's tied to your competence, your identity, or your future carries a small emotional risk every time you sit down with it — the risk of finding out it's harder than you hoped, or that your first attempt isn't good.
Every time you close the tab and open something easier instead, your brain gets an immediate reward: the discomfort disappears. That relief is real, and it's fast — much faster than the slower, uncertain reward of eventually finishing the thing you were avoiding. Behaviorally, this is a simple mismatch. The brain is very good at optimizing for the next few minutes and comparatively bad at weighing a benefit that's a week away.
This is also why willpower alone rarely fixes procrastination. Telling yourself to "just start" doesn't change the underlying trade your brain is making. What tends to work instead is changing the trade itself.
The task isn't the problem. The feeling that shows up right before the task is.
A few approaches with real support behind them:
Shrink the entry point. Commit to two minutes, not the whole task. Most of the resistance lives in the transition, not the work itself — once you're in motion, continuing is far easier than starting.
Name the feeling, not the task. Instead of "I need to write the report," try "I'm putting this off because I'm worried it won't be good enough." Naming the actual obstacle makes it easier to address directly, rather than fighting a vague sense of resistance.
Make the future reward feel closer. Vague, distant payoffs lose every time to an immediate scroll. Picture the specific relief of having it done tonight, not the abstract idea of "being productive."
None of this makes the discomfort disappear entirely — and it shouldn't. The goal isn't to feel nothing before starting something that matters. It's to stop mistaking that feeling for a reason to wait.