boc/design-audit-quixzoom-landvex.md

🔍 Designaudit: quixzoom.com & landvex.com

Datum: 2026-06-29
Auditor: OpenClaw Subagent
Omfattning: Visuell design, UX, SEO, innehåll, teknisk struktur

---

📊 Sammanfattning

Aspekt	quixzoom.com	landvex.com
Visuell design	Stark, modern, Apple-influerad	Mörk, sofistikerad, enterprise-fokus
UX/Användbarhet	Bra flows, några tillgänglighetsluckor	Bra navigering, komplex information
SEO	Utmärkt strukturerad data	Bra men saknar vissa element
Innehåll	Omfattande, tydlig CTA	Stark copy, tydligt värdeerbjudande
Tekniskt	Stora filer, inline allt	Mörkt tema, viss inkonsekvens

---

🔴 KRITISKA PROBLEM

quixzoom.com

1. Inga <label>-element för formulär
   Waitlist-formulären (rader 779, 1348) har <input type="email"> utan associerade <label>-element. Endast placeholder används. Detta bryter mot WCAG 2.1 AA (krav 3.3.2) och påverkar skärmläsaranvändare.

2. Inga <img>-taggar alls på startsidan
   All visuell media är antingen SVG-inline, CSS-backgrounds, eller helt frånvarande. Detta innebär: ingen alt-text för bilder, ingen lazy loading-möjlighet, och potentiella SEO-förluster för bildsök.

3. Ingen loading="lazy" implementerad
   Trots att inga <img>-taggar finns, saknas strategi för lazy loading av tungt innehåll (SVG:er, overlay-panel).

4. Stor filstorlek: 224 KB HTML
   index.html är 224 KB (2016 rader) med all CSS och JS inline. Ingen cachebar extern CSS/JS. Detta påverkar TTFB och återbesökares prestanda.

5. Ingen <header>-tagg
   Navigationen (rad 696) använder <nav> men saknar omslutande <header>. Semantisk HTML är ofullständig.

6. 32 st <a href="#">-ankare
   Många interna navigeringslänkar använder hash-länkar utan korrekt hantering. Risk för scroll-problem och tillgänglighetsproblem.

7. Ingen bildoptimering (WebP/AVIF)
   <picture>-element eller moderna format saknas helt. OG-bilder är JPEG (~88 KB).

8. Ingen robots.txt för landvex.com?
   Landvex robots.txt returnerar HTML (160 bytes) — kan vara felkonfigurerad. Quixzoom robots.txt är korrekt.

9. Landvex sitemap.xml returnerar 403
   curl -sI https://www.landvex.com/sitemap.xml ger HTTP 403. Detta blockerar sökmotorer från att hitta sidor.

10. Ingen breadcrumb-strukturerad data på quixzoom
    Landvex har BreadcrumbList (rad 661), men quixzoom saknar detta helt.

landvex.com

1. Ingen <main>-tagg
   Startsidan använder <section>-element men saknar <main> som primärt innehållsområde. Påverkar skärmläsares navigering.

2. Ingen skip-to-content-länk
   Quixzoom har en (rad 694), men landvex saknar helt en "Skip to main content"-länk. Allvarligt tillgänglighetsproblem.

3. Många sidor saknar unika titlar
   Alla verticals-sidor har identisk struktur: <title>LandveX — [Vertical] </title> — trailing space och inkonsekvent varumärkesstavning (LandveX vs Landvex).

4. Inkonsekvent varumärkesstavning
   Landvex, LandveX, LandveX AB används omväxlande. I JSON-LD: "name": "Landvex", men i footern: "LandveX AB". I titlar: LandveX.

5. Inga <label>-element explicit kopplade
   Kontaktformuläret (rader 1506-1520) har <label>-element men de är inline-stylade och potentiellt svåra att associera för vissa skärmläsare.

6. Ingen <header>-tagg
   Samma problem som quixzoom — navigationen saknar semantisk <header>-omsling.

7. Saknad sitemap.xml (403)
   Kritiskt SEO-problem. Sökmotorer kan inte upptäcka alla under sidor.

---

🟡 REKOMMENDATIONER

Visuell Design

#	Problem	Plats	Rekommendation
1	Quixzoom: Hero-telefonen är ren CSS/SVG	#hero	Överväg att använda en riktig bild eller optimerad SVG för bättre LCP
2	Landvex: Mörkt tema kan vara för kontrastsvagt	--text-dim: #888 på --bg-dark: #0a0a0a	Testa kontrastförhållandet; #888 på #0a0a0a ger ~5.2:1 (OK men gränsfall)
3	Quixzoom: --text-muted: #6B6B6B på --bg-off: #F7F7F5	Footer, metadata	Kontrast ~4.5:1, gränsfall för WCAG AA
4	Landvex: Inline-stilar överallt	Rader 740-1540	Flytta till CSS-klasser för bättre underhåll och caching
5	Quixzoom: font-family med 'Inter' men ingen @font-face	Rad 118	Inter laddas aldrig om inte installerat lokalt; använd Google Fonts eller self-host
6	Båda: Ingen systematisk typografisk skala	—	Definiera tydligare typografisk skala med fler steg (display, h1-h6, body, caption)
7	Quixzoom: --radius-full: 100px används inkonsekvent	Knappar, badges	Vissa element använder 100px, andra 24px; standardisera

UX / Användbarhet

#	Problem	Plats	Rekommendation
1	Quixzoom: Overlay-panel (drill-down) saknar fokusfälla	#overlay-panel	Lägg till focus-trap så tabbning stannar i panelen när den är öppen
2	Quixzoom: role="button" på <article>-element	.drill-card	Använd <button> istället eller lägg till keydown-hantering för Enter/Space
3	Landvex: Dropdown-menyer med :hover	.nav-dropdown	Lägg till :focus-within stöd för tangentbordsnavigering (delvis gjort, verifiera)
4	Quixzoom: Mobile menu stängs inte med Escape-tangenten	.mobile-menu	Lägg till keydown-lyssnare för Escape
5	Landvex: Kontaktformulär saknar success/error-tillstånd visuellt	#contact-form	Tydligare visuell feedback vid submit
6	Quixzoom: Ingen progress-indicator vid formulärsubmit	submitWaitlist	Lägg till spinner eller "Submitting..."-tillstånd
7	Båda: Ingen cookie-consent-banner	—	GDPR kräver samtycke för cookies (om ni använder några)
8	Quixzoom: Ingen 404-sida konfigurerad	—	Skapa en anpassad 404-sida
9	Landvex: Footer-länkar är extremt många och oorganiserade	.footer-links	Gruppera i kolumner som quixzoom gör

SEO

#	Problem	Plats	Rekommendation
1	Quixzoom: Dubbla <meta name="keywords">	Rad 24-25	Sammanfoga eller ta bort (Google ignorerar keywords)
2	Quixzoom: og:image pekar på /images/hero-zoomer-city.jpg men filen finns i /images/hero-zoomer-city.jpg	—	Verifiera att filen faktiskt finns på servern
3	Landvex: og:image är /og-image.jpg — verifiera existens	—	Kontrollera att OG-bilden finns
4	Quixzoom: Ingen WebPage schema-typ	—	Lägg till @type: "WebPage" för startsidan
5	Landvex: BreadcrumbList endast på index	—	Lägg till på alla sidor
6	Quixzoom: Ingen Article eller BlogPosting schema	—	Om ni har blogg/innehåll, lägg till
7	Båda: Ingen Person schema för grundare/team	—	Lägg till för E-E-A-T-signaler
8	Quixzoom: alternateName innehåller 15+ varianter	JSON-LD	Minska till 3-5 mest relevanta; för många kan ses som keyword stuffing
9	Landvex: disambiguatingDescription är mycket lång	—	Kortfatta; Google trunkerar långa beskrivningar
10	Quixzoom: speakable schema pekar på .hero-tagline som inte finns	Rad 52	Klassen .hero-tagline saknas i HTML; rätta selektorn

Prestanda

#	Problem	Plats	Rekommendation
1	Quixzoom: 224 KB inline HTML	index.html	Extrahera CSS till extern fil för caching; mål: <100 KB
2	Landvex: 104 KB inline HTML	index.html	Extrahera CSS; mindre kritisk men fortfarande bra
3	Quixzoom: 41 SVG:er inline	—	Överväg SVG-sprite eller externalisera återanvändbara
4	Landvex: 69 SVG:er inline	—	Samma som ovan
5	Båda: Ingen preconnect för externa resurser	—	Quixzoom har en (api.quixzoom.com); landvex saknar helt
6	Quixzoom: Ingen dns-prefetch eller preconnect för fonts	—	Om ni börjar använda Google Fonts, lägg till preconnect
7	Båda: Ingen Service Worker	—	Överväg PWA-kapacitet för offline/återbesök
8	Quixzoom: locale-data.js laddas synkront	Rad 690	Lägg till defer eller flytta till </body>

Innehåll / Copy

#	Problem	Plats	Rekommendation
1	Quixzoom: "1 Credit = €1" nämns på flera ställen men är inte juridiskt bindande	Footer, hero	Lägg till asterisk eller förklaring om att växelkursen kan variera
2	Landvex: "Bloomberg for the physical world" — potentiellt varumärkesintrång	Rad 742	Överväg att formulera om för att undvika juridiska problem
3	Quixzoom: "Launching August 2026" — datum passerar snart	Hela sidan	Uppdatera copy när produkten är live
4	Landvex: "Live intelligence from August 2026" — framtidsdatum	Rad 1109	Samma som ovan; uppdatera vid launch
5	Quixzoom: "1240" reviews i aggregateRating	JSON-LD	Om detta är uppdiktat, ta bort eller markera som "beta-testdata" för att undvika missvisande
6	Landvex: "20+ countries at launch" — verifierbart?	Hero-stats	Se till att påståenden kan backas upp

Tekniskt / Säkerhet

#	Problem	Plats	Rekommendation
1	Quixzoom: CSP tillåter 'unsafe-inline' för scripts	HTTP-header	Inline scripts bryter mot CSP; flytta till externa filer eller använd nonce
2	Quixzoom: script-src 'self' 'unsafe-inline'	CSP-header	Försvårar XSS-skydd; åtgärda
3	Landvex: Inga säkerhetsheaders synliga	HTTP-response	Lägg till X-Frame-Options, X-XSS-Protection, HSTS, CSP
4	Quixzoom: fetch() till API utan error-hantering för nätverk	submitWaitlist	Lägg till catch för nätverksfel
5	Landvex: Kontaktformulär skickar till api.quixzoom.com	Rad 1604	Korrekt, men lägg till rate-limiting och spam-skydd
6	Båda: Ingen CSRF-token i formulär	—	Lägg till CSRF-skydd om formulären hanteras server-side
7	Quixzoom: kyc-verify.html är nästan tom	—	Antingen bygg ut eller ta bort från indexering

---

🟢 BRA SAKER

quixzoom.com

✅ Utmärkt strukturerad data — 5+ JSON-LD-block: Organization, WebSite, SoftwareApplication, FAQPage, Product, ImageObject, Speakable
✅ Skip-to-content-länk — Bra tillgänglighet (rad 694)
✅ Semantisk HTML — Använder <main>, <section>, <article>, <footer>, <nav>
✅ ARIA-attribut — aria-label, aria-haspopup, role="listbox", role="option", role="dialog", aria-modal="true"
✅ Responsiv design — Bra media queries (768px, 960px, 600px, 480px)
✅ Modern CSS — CSS custom properties, clamp() för typografi, grid och flexbox
✅ Favicon-komplett — SVG, PNG 16/32/192/512, ICO, Apple touch icon, manifest
✅ hreflang — x-default, en, sv, nl, th, ng, ke
✅ Canonical URL — Korrekt implementerad
✅ OG-tags kompletta — title, description, url, image, image:width, image:height, image:alt
✅ Twitter Cards — summary_large_image
✅ Säkerhetsheaders — X-Frame-Options, XSS-Protection, Referrer-Policy, CSP, HSTS
✅ Robots.txt korrekt — Allow all, disallow /markets/ke/ och /markets/ng/
✅ Sitemap.xml tillgänglig — Korrekt format
✅ Drill-down overlay — Bra UX-mönster för detaljerad information utan sidladdning
✅ Glossary tooltip engine — Bra för användarutbildning
✅ Scroll fade-in observer — Modern Intersection Observer-användning
✅ Brand disambiguation — Tydlig signal till Google om att inte förväxla med Zoom
✅ Trust badges — GDPR, EU data residency, Stripe payouts

landvex.com

✅ Mörkt tema välutfört — Konsekvent färgpalett, bra hierarki
✅ Dropdown-navigation — Välstrukturerad med ikoner och etiketter
✅ Bra copy — "We start with your decision. Not with our data." — starkt värdeerbjudande
✅ Strukturerad data — Organization, BreadcrumbList, FAQPage, SoftwareApplication
✅ Disambiguation-sektion — Tydlig för Google Knowledge Graph (rad 1646)
✅ hreflang — 7 språk/regioner
✅ Favicon-komplett — SVG, ICO, Apple touch icon, manifest
✅ Canonical URL — Korrekt
✅ OG-tags — Kompletta
✅ Twitter Cards — summary_large_image
✅ Kontaktformulär med feedback — Success/error-meddelanden
✅ Smooth scroll — Bra UX för ankare
✅ Responsiv — Media queries för 900px, 640px, 480px
✅ SVG-ikoner — Skalbara, inline för snabb rendering
✅ Trust-signal — Org.nr, adress, juridisk struktur tydlig
✅ Robots.txt — Korrekt, även bot-specifik (Googlebot, Bingbot, etc.)

---

📋 PRIORITERAD ÅTGÄRDSLista

Omedelbart (Vecka 1)

#	Åtgärd	Plats	Effekt
1	Lägg till <label>-element för alla formulärinput	Båda sidor	WCAG AA-efterlevnad, skärmläsare
2	Fixa landvex sitemap.xml (403)	/var/www/landvex/sitemap.xml	SEO-kritiskt
3	Lägg till skip-to-content på landvex	index.html	Tillgänglighet
4	Lägg till <main>-tagg på landvex	index.html	Semantisk HTML
5	Standardisera varumärkesstavning	Landvex: Landvex (inte LandveX)	Varumärkeskonsistens
6	Lägg till <header>-taggar	Båda sidor	Semantisk HTML
7	Fixa robots.txt för landvex	Returnerar HTML istället för text	SEO

Kortsiktigt (Vecka 2-3)

#	Åtgärd	Plats	Effekt
8	Extrahera CSS till externa filer	Båda sidor	Caching, prestanda
9	Lägg till loading="lazy"	Bilder, tunga sektioner	LCP, prestanda
10	Lägg till preconnect/dns-prefetch	Externa resurser	TTFB
11	Lägg till focus-trap i overlay-panel	Quixzoom drill-down	Tillgänglighet
12	Lägg till Escape-tangent-stöd	Mobile menu, overlays	Tillgänglighet
13	Lägg till breadcrumb JSON-LD	Quixzoom alla sidor	SEO
14	Korrigera speakable selektor	Quixzoom JSON-LD	SEO
15	Lägg till WebPage schema	Quixzoom	SEO

Medellång sikt (Månad 1-2)

#	Åtgärd	Plats	Effekt
16	Implementera WebP/AVIF-bilder	Båda sidor	LCP, bandbredd
17	Lägg till Service Worker	Båda sidor	PWA, offline
18	Förbättra CSP	Ta bort 'unsafe-inline'	Säkerhet
19	Lägg till säkerhetsheaders på landvex	HSTS, CSP, etc.	Säkerhet
20	Lägg till cookie-consent	Båda sidor	GDPR
21	Skapa 404-sida	Quixzoom	UX
22	Optimera SVG:er	Sprite eller externalisera	HTML-storlek
23	Lägg till rate-limiting på formulär	Båda sidor	Spam-skydd
24	Uppdatera "August 2026"-copy	När produkten är live	Aktualitet
25	Lägg till progress-indicator	Quixzoom waitlist	UX

---

📈 Prestandauppskattning

Mätvärde	quixzoom.com (nu)	quixzoom.com (efter opt)	landvex.com (nu)	landvex.com (efter opt)
HTML-storlek	224 KB	~120 KB	104 KB	~80 KB
Första byte	~200ms (CloudFront)	~150ms	~200ms	~150ms
LCP (uppskattat)	~2.5s	~1.8s	~2.0s	~1.5s
CLS (uppskattat)	~0.05	~0.02	~0.03	~0.01
Tillgänglighet	~85%	~98%	~80%	~98%
SEO	~90%	~98%	~85%	~98%

---

🏆 Dom: quixzoom.com vs landvex.com

Kategori	Vinnare	Motivering
Visuell design	quixzoom.com	Mer polish, bättre spacing, modernare känsla
UX/Användbarhet	quixzoom.com	Bättre drill-down, tydligare flows
SEO	quixzoom.com	Mer omfattande strukturerad data
Innehåll	landvex.com	Starkare copy, tydligare värdeerbjudande
Tillgänglighet	quixzoom.com	Skip-link, bättre ARIA
Prestanda	landvex.com	Mindre HTML, färre inline-resurser
Säkerhet	quixzoom.com	CSP, HSTS, m.fl. headers
Varumärkeskonsistens	quixzoom.com	Enhetlig stavning och ton

Totalt: quixzoom.com leder med 5-2-1 (landvex vinner prestanda, oavgjort i en kategori).

---

Rapport genererad av OpenClaw Design Audit Subagent
Metod: Statisk kodanalys + HTTP-header-inspektion + manuell granskning