Seguridad Total 24

Context

An independent consultant for home and business alarm systems, with no manufacturer brand behind him. That independence is exactly his advantage: he isn’t selling anyone’s catalogue, he goes to the property and specifies what’s actually needed. The problem is that this doesn’t show up on a website — every site in the sector looks alike and promises the same thing.

The brief was to turn a difference in method into a difference you can see.

Approach

• The survey is the offer, not the product. Every CTA on the site goes to one place: book the free assessment. No price lists, no bundles, no configurator. What’s being sold is a technician’s judgment in your living room.
• Risk before equipment. The first section after the hero doesn’t show cameras: it names six concrete situations — an empty property, long absences, a business closed overnight, a hold-up — because someone shopping for an alarm is thinking about a fear, not a sensor.
• Detection, verification, response. How the system works is explained in three steps before any device is listed. A professional alarm isn’t a box that makes noise, and the site says so in that order.
• Astro with Preact islands hydrated on client:visible. Only the interactive parts hydrate, and only once they scroll into view. Everything else is static HTML.
• A navy palette with alarm red held strictly for action: red appears only where something can be pressed.

What I built

• Static multi-page Astro architecture with Preact islands
• Design system in Tailwind 4 tokens via @theme
• Content structure: services, devices and two segments (home and business)
• Full copy, framed on real risk and free of outcome promises
• Technical SEO with JSON-LD schemas
• WCAG 2.2 AA accessibility and prefers-reduced-motion honoured
• Static build and production deployment

Outcome

Live since September 2026. The decision I’m most convinced by is leaving prices out: in a sector where visitors expect a comparison table, this site asks for a visit instead. Less traffic, better conversations.

A note on this work

Built at Xpandex, where I run the full cycle: design, development, performance, accessibility, technical SEO and deployment.