Shane Bogue Projects

Stafford4AZ

A campaign site the campaign can edit without touching code

Campaign logo: a layered orange Arizona outline with a saguaro and the words Eric Stafford for State Senate.
The campaign logo. Fig. 1 2025–2026
  • Client work
  • Live
Year
2025–2026
Role
Designer and developer
Org
Eric Stafford for Arizona State Senate
Stack
Astro 5, TypeScript, Netlify (hosting and forms), GA4, Google Tag Manager and 2 more

The website for Eric Stafford's campaign for Arizona State Senate in Legislative District 29: platform, events, endorsements, a Spanish page, an LD29 voter guide with six community pages, news, and sign-up forms with UTM tracking. All of the wording lives in one JSON file, so campaign staff can change text on GitHub.

Problem

The campaign needed a fast site that people could find in search, that staff could update during the race without a developer, with donations that can be switched on or off and analytics on sign-ups.

Approach

It started as plain HTML pages, moved to Astro with components and prerendered pages, then went mobile-first. I put all site text in one JSON file with on/off switches for donations and the Clean Elections popup, and moved hosting from GitHub Pages to Netlify. For search: an LD29 guide, community pages, a "who is my state senator" page, a Markdown news collection and structured data. For speed: responsive images, inline SVG icons instead of an icon font, duplicate CSS removed and long-lived caching. GA4 and Tag Manager record page views across view transitions and lead events on forms.

Process

6 dated steps, from the project’s history

  1. 01

    First version

    Plain HTML home, about and platform pages. See Fig. 1, above.

  2. 02

    Moved to Astro

    Components for the header, footer, platform items, a video modal and the Clean Elections popup, with prerendered pages and WebP images, replacing about 2,700 lines of static HTML and CSS.

  3. 03

    Mobile first

    Rewrote the stylesheet mobile-first and compressed images, starting with the oversized hero background.

  4. 04

    The full campaign site

    Endorsements, a Spanish page, get involved, transparency, voter resources, a thank-you page, a 404 page, a skip link and social cards.

  5. 05

    Editable by the campaign

    All wording moved into one JSON file with a README explaining how to edit it on GitHub, and hosting moved to Netlify.

  6. 06

    Refresh

    The LD29 guide and community pages, news, structured data, analytics events, and donate buttons switched off by a flag. The background, footer logo and favicon were slimmed down, and inline SVGs replaced the icon font. A new portrait went in the same day.

Results

Live at stafford4az.com (checked October 23, 2026). The campaign's own account has committed text edits, which is the edit-in-JSON workflow doing its job.

Lesson

Putting every word in one file with plain instructions let campaign staff make their own edits. Two of the commits are theirs.