audreyinc.com theme — 2026-05-26 changelog

Theme repo: xlab-co/audreyinc-theme · Live store: audreyinc.com · Reader: Audrey

TL;DR

• The theme is now under proper version control — every change is a tracked, reversible commit on GitHub. The store can roll back to any known-good point in seconds.
• Three commits landed today on the audreyinc-theme repository. A baseline snapshot of the live theme, a wiring-verification commit, and a focused accessibility + performance pass.
• The store is faster and more accessible — 175 KB of dead asset weight removed from every page load, five color-contrast failures on the home fixed, slideshow pagination dots now properly tappable on mobile.
• Workflow is now: edit → commit → auto-deploy to a private staging theme → review → publish. No more risk of breaking the live store; nothing reaches customers until you explicitly publish.
• Current Lighthouse mobile scores: SEO 100, Best Practices 96, Accessibility 93. Target after publishing these fixes: Accessibility expected to climb to 100; Best Practices unchanged at 96 (the remaining failure is a third-party Shopify cert issue, not anything your theme controls).
• Nothing is published yet — the changes live on a draft theme. Visual review + a single “Publish” click promotes them to live whenever you’re ready.

Timeline · the day at a glance

1 · Why this changelog exists

Until today, every change to the audreyinc.com theme was made directly in Shopify’s theme editor and lived only in Shopify’s own (3-version) history. Today the theme moved to a proper git workflow:

1. The current live theme (“Studio” v15.4.1) was pulled into a private GitHub repository as a snapshot baseline — the floor we can always restore from.
2. A separate “draft” version of the theme was connected to the GitHub repo via Shopify’s official integration. Edits flow automatically in both directions: code committed to GitHub auto-deploys to the draft; visual edits in Shopify’s editor auto-commit back to GitHub.
3. The live theme is untouched until a deliberate “Publish” action promotes the draft. There is no path for accidental changes to reach customers.

The result is a workflow where every change has an audit trail and every prior state is one command away from restoration. This document is the first such audit trail — generated automatically from today’s commits.

2 · What changed · commit-by-commit

Initial scaffold · 22341e7

2026-05-20 · 15:28 ET · Dan Sellars

Empty repository set up six days ago to receive the theme. No theme files yet — just the README documenting the planned workflow.

User-visible effect: none. Pure infrastructure.

Baseline snapshot of the live Studio theme · 0df32f2

2026-05-26 · 07:21 ET · Dan Sellars

Pulled the entire live theme into the repository — 353 files across the standard Shopify structure (sections, snippets, templates, assets, layouts, configs, 50+ language translations). This is the “if anything ever breaks, restore from here” floor.

User-visible effect: none — read-only operation against the live store. Zero risk to customers.

Smoke-test the GitHub→Shopify wiring · 837eb3c

2026-05-26 · 07:51 ET · Dan Sellars

Added a single invisible HTML comment to the theme’s main layout, committed, and verified that Shopify auto-deployed the change to the new draft theme within ~30 seconds. The comment is visible in the page source on the draft preview but invisible to anyone visiting the page.

User-visible effect: none. The point was to confirm the deployment pipeline works end-to-end before making any meaningful change.

Accessibility + performance pass · five fixes · d852dbd

2026-05-26 · 08:31 ET · Dan Sellars

A focused pass against today’s mobile Lighthouse audit findings. Five concerns identified; three concrete changes made (one was already correctly implemented by Shopify, one isn’t theme-fixable):

1 · Color contrast on five home-page elements

Problem: The “Featured products” heading, both product card titles (“AGATHA SILK TWILL”, “Animaux”), and both visible product prices ($225 and $325) had text colors that didn’t quite meet the WCAG AA contrast ratio of 4.5:1 against their backgrounds. Low-contrast text is harder to read for many shoppers, especially on mobile in sunlight or with mild low-vision.

Fix: Added a small CSS overlay (assets/audrey-tweaks.css) that forces these five element types to use the color scheme’s strongest foreground tone — the one paired with the background for maximum readability. The brand palette is unchanged; just the specific elements get the AA-compliant variant.

User-visible effect: Product titles and prices on the home page will read slightly darker and crisper. Most shoppers won’t notice consciously; low-vision and bright-sunlight readers will.

2 · Slideshow pagination dots were too small to tap on mobile

Problem: The “1 / 2 / 3” pagination indicators below the slideshow had touch targets smaller than the 48×48 px recommended for mobile use. Customers with larger fingers or motor-control challenges struggle to hit them accurately.

Fix: Same CSS overlay bumps each dot’s tappable area to 48×48 px. The visible dot itself is unchanged in size — the extra area is invisible padding inside the button, expanding the hit zone without changing the look.

User-visible effect: No visual change. Touching slideshow dots on a phone will land more reliably.

3 · Removed a 175 KB animated GIF that was loading on every page for no reason

Problem: The theme’s main stylesheet declared a CSS variable pointing at an animated sparkle GIF (assets/sparkle.gif, 175 KB). The variable was defined but never used anywhere in the theme — pure leftover from an earlier customization. Every shopper on every page was downloading 175 KB for nothing.

Fix: Deleted the dead variable definition + the GIF file itself.

User-visible effect: Pages load slightly faster, especially on mobile data. 175 KB saved per fresh visit. Multiply by visitor count for the cumulative bandwidth saving.

4 · Hero image preload — no change needed (already correct)

Investigation: Lighthouse flagged a 554 ms “load delay” on the home page’s hero (slideshow) image. Initial thought was to add a preload hint to load it earlier. On closer look at the theme code, Shopify already sets fetchpriority="high" on the slideshow’s first image — exactly the right behavior. The 554 ms delay is the price of the browser parsing other resources first; further optimization would be marginal (final LCP is already 743 ms, well below the “good” threshold of 2.5 s).

User-visible effect: none, because no change needed. Documenting the investigation so we don’t redo it.

5 · Loox third-party defer — not theme-controllable

Investigation: Loox (the product-reviews app) loads ~74 KB of JavaScript on every page. Lighthouse suggested deferring it. On investigation, the script is injected by the Loox app itself via Shopify’s app block system, not by the theme. So this can’t be fixed from the theme repository.

Fix path: would need to be done in Loox’s app settings (or by deferring through Shopify’s checkout config) — flagged for future merchant-side configuration.

User-visible effect: none today; noted for later.

3 · Wins, ranked

Strategic wins (compound across future work)

1. Theme is now version-controlled. Every future change is a discrete reversible commit. The biggest single shift today — anything from here on can be unwound.
2. Bidirectional Shopify ↔ GitHub sync is live. Visual edits in the Shopify theme editor commit back to the repo automatically; commits to the repo deploy to the draft theme automatically. Code workflow and design workflow stay in sync without manual reconciliation.
3. A “draft theme” pattern is operational. No more nervous edits on the live theme — there’s always a private preview URL where changes land first.
4. Today’s commits become this changelog. Every commit message is a paragraph of plain-language explanation; the audit trail IS the report.

Tactical wins (one-time but durable)

1. 175 KB removed from every page load — dead-asset cleanup, visible in bandwidth savings on every visit.
2. Five accessibility contrast failures fixed on the home page — real readability improvement for shoppers on phones in sunlight or with mild low-vision.
3. Slideshow pagination is mobile-tappable — fewer mis-taps, easier multi-slide browsing.
4. Hero image load-priority verified correct — saved future-Dan from re-investigating something already in good shape.

Ranking rationale: Strategic wins compound — every change from here forward benefits from the new workflow. Tactical wins are individually valuable but discrete. The biggest single shift today was structural — moving from “edit live, hope nothing breaks” to “edit draft, review, then publish.”

4 · Patterns built today

The reusable practices we established that future theme work inherits:

1. “Baseline snapshot first” rule. Before any edit, pull the current live theme as a recovery floor. Eliminates the “I broke it, what was it before?” failure mode.
2. “Wire-test before real change” rule. A single trivial commit confirms the deployment pipeline works end-to-end before you touch anything load-bearing.
3. “Theme overlays in a dedicated file” rule. Customizations live in their own CSS file (assets/audrey-tweaks.css) imported after the base styles. Future audits diff cleanly; reverts touch one file.
4. “Lighthouse audits as the to-do list” rule. The audit tool generates the checklist; we work through it in order; the result is measurable improvement against an objective metric.
5. “Investigation counts as a fix” rule. When Lighthouse flags something the theme already handles correctly (the hero preload case), documenting the non-fix prevents the same re-investigation later.
6. “Commit-message-as-changelog” rule. Every commit message is written for someone reading it later — explaining what + why + user-visible effect. The git log IS the documentation.

5 · Next steps (Audrey-side decisions)

1. Review the draft theme visually — https://www.audreyinc.com/?preview_theme_id=130184020026. Click around the home page, browse a product, check the cart, view the about page. Confirm nothing looks off.
2. Publish when ready. One click in Shopify admin: Online Store → Themes → audreyinc-theme/main → “Publish”. The previous live theme automatically becomes a draft (one-click rollback if anything surprises).
3. Bring the Chrome window to foreground and let us re-run Lighthouse to verify the Accessibility score moves from 93 → 100. That measurement is the proof that the work landed.
4. Future changes follow the same workflow: edits land on the draft, reviewed via preview URL, published with one click when ready. The live store stays stable; experiments stay safe.

6 · Closing

Today’s work is two things wrapped in one: the substrate shift (theme under version control with a proper review workflow) and the first concrete improvement using that substrate (the accessibility + performance pass). Every future change to audreyinc.com inherits both — a stable baseline to return to, and the discipline of working on a draft before promoting to live. The store should be measurably faster on mobile data and slightly more readable on the home page once published; nothing reaches customers until you’re ready.

Artefacts referenced: github.com/xlab-co/audreyinc-theme · live theme #128230850618 (Studio) · draft theme #130184020026 (audreyinc-theme/main) · ~/Code/audreyinc-theme/assets/audrey-tweaks.css · ~/Code/audreyinc-theme/layout/theme.liquid · Lighthouse mobile audit 2026-05-26 (Slow 4G + 4× CPU throttle)