diff --git a/.claude/memory/MEMORY.md b/.claude/memory/MEMORY.md index e5cda106..c1d8302f 100644 --- a/.claude/memory/MEMORY.md +++ b/.claude/memory/MEMORY.md @@ -27,6 +27,7 @@ - [Radio Show Website](reference_radio_website.md) — Astro static site at radio.azcomputerguru.com on IX server. - [IX PHP-FPM/OPcache remediation](project_ix_php_fpm_opcache_remediation.md) — IX server default is suPHP/CGI per-request with OPcache cold: 71/72 sites recompile PHP every request (1-5.6s TTFB). Fix = per-vhost PHP-FPM. ezfast pilot done (3.1s->0.44s); fleet rollout proposed. - [Profile before hardware](feedback_profile_before_hardware.md) — For ANY performance complaint, measure/decompose the actual bottleneck BEFORE proposing hardware; config/cheapest cause first. (IX: $600 SSDs recommended before finding the real cause was OPcache-off — a config issue.) +- [ACG website redesign (ww9)](project_acg_website_redesign.md) — azcomputerguru.com redesign lives at staging ww9.azcomputerguru.com (static impeccable-built "Bold" brutalist, /home/azcomputerguru/public_html/ww9 on IX). STANDING: keep Gemini(AGY)+Grok in the loop the whole project. AGY critique + AutoSSL fix (Let's Encrypt) recorded. - [Dataforth datasheet pipeline recovery](project_dataforth_datasheet_pipeline_recovery.md) — 2026-07-21 recovery of DOS datasheet pipeline: NAS (D2TESTNAS, TS 100.85.152.90) DNS pointed at dead .1 (UDM is .254) → rsync reverse-DNS 10s timeouts stalled pulls; fixed. Daily task broke on PS mojibake parse error. import.js/test_date/_bulk_push_all internals. jlehman added to reports. - [IX Server Access](reference_ix_server_access.md) — `ix.azcomputerguru.com` / 172.16.3.10. Reachable when Tailscale is on (no VPN). SSH currently uses sshpass with root password; key auth from GURU-5070 not configured yet (was CachyOS, now Win11 — verify). - [Cloudflare access](reference_cloudflare_access.md) — Cloudflare API creds in SOPS `services/cloudflare.sops.yaml` (full DNS + account tokens; azcomputerguru zone_id 1beb9917...). azcomputerguru.com DNS is on Cloudflare (not IX) — edit via Cloudflare API, not whmapi1. @@ -52,6 +53,7 @@ - [Trebesch DESKTOP-QNP3ON5 shell replacement](reference_trebesch_qnp3on5.md) — AT Trebesch box runs an Explorer shell replacement; explorer.exe owner check returns blank — use Win32_ComputerSystem.UserName. GuruRMM SWIFT-LION-2892. - [reference_backblaze_storage_rate](reference_backblaze_storage_rate.md) -- ACG's Backblaze B2 storage cost rate ($0.00695/GB) for the GuruRMM mspbackups storage-cost calculation - [Unraid VM no-IP causes](unraid-windows-vm-virtio-no-ip.md) — PRIMARY (general "new VMs stopped getting IPs lately"): Docker sets bridge-nf-call-iptables=1, so br0 VM DHCP OFFERs hit DOCKER-FORWARD (no br0 ACCEPT) and get dropped; new VMs can't complete DORA (existing renew via ESTABLISHED). Fix `=0` runtime (needs persistent post-Docker hook; not yet persisted on Jupiter). SECONDARY (Windows VM): virtio-net has no in-box driver -> use e1000 or virtio-win. Diagnose: tcpdump DHCP on pfSense; /sys vnetN rx_packets. +- [EcoSense WiFi (UOS)](reference_ecosense_wifi.md) — 4x U7-Mesh site (site_id 6193fb3f…, short ja3n6cs5), NO 6GHz; South Office=wired root, Eli's/Mobile Park=wireless children, Mobile Park weakest (needs on-site power-cycle). 2.4 on 1/6/11, 5GHz mesh on ch149. LESSON: remote 5GHz channel hop on a wireless mesh drops the children — do it on-site or wire the weak child first. - [Starr Pass mail routing](reference_starrpass_mail_routing.md) — starrpass.com is DIRECT to MS (EOP/Defender, tenant 222450dd…); only devconllc.com is on Mailprotector (MP acct 16170). Check @starrpass.com quarantine/rejects via remediation-tool, not Mailprotector. - [INKY outbound breaks DMARC](reference_inky_outbound_breaks_dmarc.md) — Reverse-resolve DMARC rua failing IPs before blaming a sender: ipw-outbound.inkyphishfence.com / us.cloud-sec-av.com = INKY re-injection breaking DKIM+SPF. INKY is in-M365 (connectors+transport rules) per enrolled tenant, but hosting-level (IX/cPanel website) outbound also routes through it independent of M365 enrollment. Fix is INKY-side (outbound DKIM/SPF/ARC), not cPanel DNS. - [Syncro prepay: full-GET only](feedback_syncro_prepay_full_get_only.md) — read prepay_hours ONLY from GET /customers/{id}; the customer search/list endpoint returns null/stale prepay. Never assert "no block" in a billing preview from search data. diff --git a/.claude/memory/project_acg_website_redesign.md b/.claude/memory/project_acg_website_redesign.md new file mode 100644 index 00000000..fbf93965 --- /dev/null +++ b/.claude/memory/project_acg_website_redesign.md @@ -0,0 +1,60 @@ +--- +name: project_acg_website_redesign +description: ACG website redesign lives on staging ww9.azcomputerguru.com (static, impeccable-built "Bold" brutalist); keep Gemini(AGY)+Grok in the loop the whole project. +metadata: + type: project +--- + +Rebuilding **azcomputerguru.com**. Live site = a dated WordPress "Managed IT Services" build on IX (custom +theme `arizonacomputerguru` + RevSlider + Forminator; 12px body, WCAG-failing orange text, carousel hero, +inauthentic 3D/circuit-board imagery, no trust signals). Full live-site critique: +`clients/internal-infrastructure/reports/2026-07-22-azcomputerguru-website-uiux-plan.md`. + +**The redesign already exists** as a static, from-scratch build at **`ww9.azcomputerguru.com`** (staging; +grey-clouded → hits IX directly at 72.194.62.5). Docroot: **`/home/azcomputerguru/public_html/ww9`** (addon +domain on the `azcomputerguru` cPanel account). It is **NOT WordPress** — plain HTML/CSS/JS built with the +**impeccable** skill: `PRODUCT.md` + `DESIGN.md` present, pages index/about/services/pricing/contact + +`calculator.html` (pricing calc) + `radical.html` variant, `css/styles.css` (~44KB), `js/app.js`, +`assets/images/` (grayscale documentary photos, + a "verdigris" color variant). + +Design language **"Bold"**: premium brutalist — **Anton** poster headlines (uppercase), **Hanken Grotesk** +body, **JetBrains Mono** for money/calc, **signal orange** the ONLY accent (`#E24A12`/`#FF5A1F`; AA text +variants `#C23A0A`/`#FF8A4D`), 1px ink borders, light+dark first-class. Positioning: **"Concierge IT for +Tucson, since 2001", publishes prices** (GPS-Basic/Pro/Advanced tiers), voice kind/direct/no-hype. KVOI radio +show ticker = local authority. Anti-references = generic SaaS/MSP slop (gradients, 3D isometrics, server-rack +clip art, glowing shields, hero-metric templates) — i.e. exactly the LIVE site's flaws. + +**STANDING INSTRUCTION (Mike, 2026-07-22):** keep **Gemini (AGY)** and **Grok** in the loop for the ENTIRE +project — run design work past them for second opinions. Method: screenshot with cert-ignore +(`playwright firefox ... ignore_https_errors`), then `ask-agy.sh image-analyze` / `review-files`. Grok has been +returning empty all session (dead) — retry each time, use if it responds. + +**AGY critique of the ww9 homepage (2026-07-22) — MOSTLY CAPTURE ARTIFACT, corrected:** AGY's first pass was +run on a full-page screenshot taken WITHOUT triggering the scroll-reveal animations, so below-fold `.reveal` +elements were still at `opacity:0` and read as "empty." The phantom items ("empty WHAT WE DO / blank DISPATCH +BOARD", "stray floating arrows", "orange-on-beige fails AA") were ALL false positives: those sections are fully +populated (6 svc rows + 3 dispatch cards in index.html), and section-tags/eyebrow use `--accent-ink` #C23A0A = +**4.62:1 AA-pass** on bone, NOT the #E24A12 fill. **Lesson: always scroll-trigger reveals before screenshotting +this site** — `.js .reveal{opacity:0}` at styles.css:660 is JS-gated (`.in` on IntersectionObserver, app.js:272) +with a no-IO fallback; capture via `ff.py` then `eval` a scroll-through, then POST `/shot {"full":true}`. + +**Real fixes applied + AGY-confirmed resolved (2026-07-22, deployed live to ww9):** (1) exit-offer banner +(`#exitOffer`) now `visibility:hidden` until `.show` — was bleeding a sliver behind the nav (`top:73px` + +`translateY(-100%)`, z45<50); (2) hero H1 `line-height` 0.9 -> 1.0 (styles.css:157) — descender collision; +(3) split "2001" stat -> solid number (index.html:87; `.u` unit style kept ONLY on real units 1-2**hr**/100**%**/ +30**day**); (4) `.svc__meta` price color `--accent-ink` -> `--ink` (styles.css:452) so signal-orange is reserved +for the "See what this costs" action links only. **Still open (AGY 2nd pass):** duplicate radio-show elements — +static `.radio-promo` (index.html:76) AND scrolling `.radio-ticker` (line 224) both show the same KVOI info +stacked; needs Mike's call on which to keep (his show). Numbers ARE consistent (call-in 520-790-2020, biz +520.304.8300 — AGY's number-mismatch read was OCR error). Minor: svc calc-link wraps to its own line on rows +03/04 (text-length) — trivial `display:block` fix if wanted. Grok dead all session (no vision mode + empty text). + +**AutoSSL fix (2026-07-22):** ww9 had a self-signed cert (browser warnings) because it was in the account's +AutoSSL **exclude list** (`/var/cpanel/ssl/autossl/excludes/azcomputerguru.json`, alongside proxied/external +subdomains). Removed ww9+www.ww9 from excludes, triggered `uapi --user=azcomputerguru SSL start_autossl_check` +(NOT `whmapi1 start_autossl_check` — "unknown app" on this version) → **Let's Encrypt cert issued**. AutoSSL +logs live in timestamped subdirs under `/var/cpanel/logs/autossl//` (not `*.log`). + +Next: pull ww9 into the repo (`projects/acg-website/`?) to work with impeccable + version + deploy previews; +finish empty sections; apply AGY's refinements; a11y/contrast pass; then plan go-live to replace the WP site. +See [[reference_cloudflare_access]] (zone edits) and the live-site UI/UX report above. diff --git a/clients/internal-infrastructure/reports/2026-07-22-azcomputerguru-website-uiux-plan.md b/clients/internal-infrastructure/reports/2026-07-22-azcomputerguru-website-uiux-plan.md new file mode 100644 index 00000000..e386b93a --- /dev/null +++ b/clients/internal-infrastructure/reports/2026-07-22-azcomputerguru-website-uiux-plan.md @@ -0,0 +1,189 @@ +# azcomputerguru.com — UI/UX Improvement Plan + +**Date:** 2026-07-22 · **Site:** https://azcomputerguru.com (ACG marketing site) · **Author:** Mike Swanson (GURU-5070) +**Method:** Live capture (Firefox driver) + AGY/Gemini vision critique of the homepage + source-level extraction +(rendered HTML, theme CSS, DOM a11y signals, network/perf). Stack: **custom WordPress theme +`arizonacomputerguru`** + Revolution Slider + Forminator; font **Lexend**; brand accent **orange `#FE7400`**. + +--- + +## 1. Executive summary + +The site has good bones — a clean typeface (Lexend), a strong SEO title, semantic landmarks, a clear local +identity (Tucson MSP), and a legible information architecture. But it currently **reads as a mid-2010s template +and leaks leads**: the hero is a rotating carousel with a generic "LEARN MORE" button, the most prominent header +button serves *existing* clients ("Remote Support") rather than new ones, there are **no trust signals above the +fold**, body text is set at an unreadable **12px**, and brand orange is used as text on white in ways that **fail +WCAG contrast**. It's also **front-end heavy** (921 KB, 60 requests, 19 CSS files, 7 fonts). + +None of this requires a rebuild. A staged effort — **quick wins → conversion/trust → visual refresh → +structural (a11y/perf/nav)** — will materially improve first impression, readability, trust, and lead capture. + +**The single highest-leverage change:** turn the hero + header into a **conversion machine** (one strong value +prop, one high-intent CTA, visible social proof) instead of a carousel that hides the message. + +--- + +## 2. Current-state snapshot (measured) + +| Dimension | Finding | +|---|---| +| Tech | Custom theme `arizonacomputerguru`, Revolution Slider, Forminator; Lexend via Google Fonts | +| Title/meta | Title good ("Arizona Computer Guru \| Managed IT Services Tucson AZ"); meta desc 170 chars (good) | +| Hero | Rotating **carousel** (‹ › arrows); H1 "Managed IT Services / for your business" (72px, orange); tiny body copy; generic "LEARN MORE" CTA; 3D "G/building" render | +| Typography | **Base body font 12px** (line-height 16.8px); H1 72px; sizes in CSS cluster at 12/13/14/16px | +| Color | Body text pure black `#000`; links/accent orange `#FE7400`; white text on orange service cards | +| Layout | Hero left/right unbalanced; floating vertical **social-icon bar** overlapping content; service cards on a **circuit-board** background with tight top padding | +| Page | ~4.8 screens tall (3,871px); 11 images, 1 contact form (Forminator), phone `1.520.304.8300` | +| Accessibility | **4/11 images missing alt**; **2 `

`** (should be 1); **3 form inputs without labels**; **8 links with no text/aria-label** (icons/arrows/social); **no skip link**; `lang=en-US` OK; landmarks present | +| Performance | **921 KB / 60 requests**; 14 scripts, **19 CSS files**, 11 imgs, **7 font files**; DOMContentLoaded ~1.3s | +| Responsive | Only **1 `@media` query** in the theme CSS (most responsiveness deferred to plugins/RevSlider — fragile) | +| Content | Value prop generic; **typo "Continous"** on the "24/7 System Monitoring" service card | + +--- + +## 3. Findings & fixes (by category, severity-tagged) + +### A. Hero & first impression — [HIGH] +- **Carousel/slider hero.** Rotating heroes hide the message and depress conversion; the ‹ › arrows are a dated + tell. **Fix:** replace with a **static hero** — one headline, one subhead, one CTA, one supporting image. +- **Fragmented hierarchy.** The eye jumps from the H1 to the oversized abstract 3D "G," skipping the subhead and + the (tiny) value copy. **Fix:** shrink/relocate the graphic; make the text column the focal point; vertically + center the text with the image. + +### B. Typography & readability — [HIGH] +- **12px base body font.** Too small; tiring to read; below modern norms and a soft accessibility issue. + **Fix:** base **16–18px**, hero body **18–20px**, with a deliberate type scale (see §5). +- **Pure black `#000` body.** Harsh on white. **Fix:** dark slate `#1f2430`/`#333`. +- **Style soup in the hero** (orange H1 + italic dark-blue subhead + black body). **Fix:** unify — solid dark + subhead (drop italics), one accent color used sparingly. + +### C. Color & contrast (WCAG) — [HIGH] +- **Orange `#FE7400` as text on white fails WCAG AA** (contrast ~2.9:1; AA needs 4.5:1 for body text). Affects + the orange H1 and orange links. **Fix:** use a dark navy/slate for headline + body text; **reserve orange for + buttons, icons, and small accents** — and even on buttons, verify white-on-orange meets AA (it's borderline; + a slightly darker orange `#E85D00`ish for interactive states helps). +- **White text on bright-orange service cards vibrates.** **Fix:** darken the card background or switch to dark + text on those cards. + +### D. Layout, spacing, whitespace — [MED] +- Unbalanced hero; cramped top padding on the service-card band; floating social bar overlaps content. + **Fix:** consistent vertical rhythm (see spacing scale §5); ≥80px section padding; **move social icons to the + footer** and remove the floating bar. + +### E. Imagery & visual identity — [MED/HIGH] +- **Inauthentic hero render** (glass building + glowing "G") and a **literal circuit-board** background are IT + clichés that don't say "local Tucson experts you can trust." **Fix:** real **team/office photography** and/or a + clean modern abstract; drop the circuit board for a solid or subtle geometric background. This is the biggest + *perceived-quality* lever after the hero rework. + +### F. CTAs & conversion path — [HIGH] +- **"LEARN MORE"** is low-intent. **Fix:** benefit-driven — **"Get a Free IT Assessment"** (or "Get a Quote"). +- **Header prioritizes "Remote Support"** (an existing-client tool) as the brightest button — prime real estate + wasted on non-leads. **Fix:** primary header button = **"Get a Quote"/"Contact Us"**; move "Remote Support" to + a slim top utility bar (with the phone number). +- **One conversion path only** (a single Forminator form deep in the page). **Fix:** repeat a clear CTA after the + hero, mid-page, and in the footer; consider a sticky header CTA + click-to-call on mobile. + +### G. Trust signals & social proof — [HIGH] +- **None above the fold.** For an MSP asking for access to a client's infrastructure, this is a major trust gap. + **Fix:** add, immediately below the hero, a **partner/vendor logo strip** (Microsoft, Dell, the security + vendors we actually use), a **"5-star on Google" badge with review count**, client logos, and any + certifications/associations. Add 2–3 short testimonials with names. + +### H. Navigation & IA — [MED] +- **"HOME" is redundant** (logo does that). **"SERVICES"/"Business Services"** hide what we actually do until a + click. **Fix:** drop "HOME"; make services a **descriptive dropdown/mega-menu** (Managed IT, Cybersecurity, + Compliance, Cloud/Hosting, Web/SEO); consider an **"Industries"** entry if we target verticals (medical, + legal, etc. — we already serve them). + +### I. Content & copy — [MED] +- **Typo "Continous" → "Continuous"** on the first service card (visible, credibility-damaging for an IT firm). +- Value proposition is generic. **Fix:** lead with a specific, local, benefit-first line (e.g., "Tucson's IT + team that keeps your business running — monitored 24/7, answered by real people."). + +### J. Accessibility — [MED, some HIGH for compliance-conscious clients] +- **4/11 images missing alt text** (a11y + image SEO). Add descriptive alt. +- **2 `

` elements** — collapse to a single H1; demote the second to H2 (SEO + semantics). +- **3 form inputs without labels** (Forminator) — add visible/`