Context: I run two public portfolios: this Gatsby/Netlify site (case studies, honesty logs) and a lighter semantic template on GitHub Pages. Every application still includes a PDF résumé.
AI assist: ChatGPT summarized recruiter conversations and analytics excerpts; I edited the tone and numbers to match my actual dashboards.
Status: Advice from someone still job hunting. Use it as peer notes, not a definitive playbook.

Reality snapshot

  • Recruiters and hiring managers consistently ask for a PDF first. Interactive sites are “nice to have” once they’ve skimmed the basics.
  • My Netlify analytics show average session length ~2m15s. Most visitors read the hero + first project, maybe one blog post, then bounce.
  • Accessibility is non-negotiable: skip links, focus outlines, alt text, and a big “Download PDF résumé” button near the top.

Dual-track setup

AssetPurposeNotes
PDF résuméATS-friendly, 1 page (bullets, measurable outcomes).Updated monthly. Stored in /static/BradleyMatera-Resume.pdf with a visible timestamp.
Interactive SPADeep dive with honesty logs, case studies, live demos.Gatsby on Netlify, content stored in MDX so I can diff claims.
Semantic templateLightweight version (HTML/CSS/JS) on GitHub Pages.Useful for recruiters who block heavy JS. Links straight back here.

Every job application gets both: PDF in the ATS, SPA link in the cover letter or “Additional Materials” field.

Design + honesty principles

  1. Navigation clarity: Sticky nav, skip links, and CTA buttons (“Contact”, “Download PDF”) at the top.
  2. Accessibility: axe + Lighthouse scans on each deploy, manual keyboard + screen reader pass.
  3. Reality blocks: Every project/blog post starts with context + AI disclosure so visitors know what’s real.
  4. Analytics + feedback: Netlify analytics + LinkedIn DMs from recruiters drive my backlog (e.g., one DM prompted a bigger “Download PDF” button).
  5. Changelog: honesty.md logs every copy update with dates + rationale. The homepage shows “Last honesty update” so readers know the site isn’t stale.

When I iterate or retire content

  • If analytics show high exit rates on a section (>60% drop), I rewrite or remove it. Example: I trimmed the old “Mission” fluff because nobody scrolled past it.
  • If a project becomes misleading (Car-Match before it had a live backend), I add disclaimers or demote it until the copy matches reality.
  • When recruiters ask for clarity (“Is Triangle Shader Lab your framework?”), I update the site immediately so the next visitor isn’t confused.

Checklists I run before sharing the SPA

  • PDF résumé link visible in hero + footer.
  • All outbound proof links (GitHub PRs, Render demos, CodePens) open in new tabs and include context.
  • Accessibility audit: axe zero critical issues, manual keyboard walkthrough recorded.
  • Netlify deploy log clean (no warnings about sharp, images, etc.).
  • Honesty log updated with what changed (date, summary).

Lessons so far

  • Interactive ≠ replacement. Recruiters still skim the PDF first. The SPA is a guided tour for those who want more context.
  • Maintenance beats novelty. A static, honest site beats a flashy but broken experience.
  • Share proof. Every claim links to a repo, PR, or log. If the link breaks, the claim goes with it.
  • Listen to feedback. When hiring managers say “I couldn’t find X,” I fix it and note the change in honesty.md.

References