SBS Website Information Architecture & UX

Decisions and design direction from the SBSWI website redesign kickoff. This article captures the agreed information architecture, page structure, UX patterns, and content modules for the rebuilt WordPress site targeting a mid-February launch.

See also: ^[1] | ^[2]

Navigation Structure

Services Dropdown

The current flat "Services" nav item will be converted to a dropdown menu listing top-level service categories. Agreed items:

• Commercial Roofing
• Roof Inspection (free — surface this prominently)
• Roof Repair
• Maintenance
• Roof Restoration / Coatings
• Metal Roofing

Rationale: The existing nav buries services behind a single click to a flat page. A dropdown surfaces options immediately and supports SEO by creating clear topical hierarchy.

Footer Cleanup

• Move Terms & Conditions from primary nav to footer
• Add Privacy Policy and any additional legal pages to footer as needed
• Retain/expand legal content — do not remove

Homepage Modules

The homepage is the design anchor. All subpages will inherit the visual system established here.

Hero

• Video hero — drone footage, optimized loop (not autoplay full video)
• Primary value proposition headline foregrounding the restoration-first philosophy
• Primary CTA: Form (see Contact section below)
• Secondary CTA: Phone call

Value Proposition Block

Lead with the restoration-first message: SBSWI's first inclination is to extend roof life — repair, coat, restore — rather than default to tear-off. This is the core differentiator vs. large commercial competitors.

Supporting proof points to weave in:
- Manufacturer-backed labor warranties (IKO and others inspect and warrant SBSWI's labor + materials — not just contractor self-warranty)
- NRCA membership
- Decade in business

Services Overview

Thumbnail/card grid linking to individual service pages. Mirrors the dropdown structure.

Social Proof

• Manufacturer/affiliation badge strip: NRCA logo (provided), IKO, IAAP, Progressive, others — gather full set with linkbacks for mutual SEO benefit
• Reviews: Surface prominently on desktop and mobile (current floating icon treatment needs replacement — see Mobile section)

Sustainability Counter

An animated counter showing cumulative square feet of roofing material saved from landfill across all projects. This metric should also appear per-case-study. Reinforces the restoration-first brand story with a tangible, shareable number.

St. Jude / Values Block

Brief callout to charitable giving (St. Jude) and company values. Currently absent or buried — should appear on homepage and About page.

Case Studies

Problem

Existing case studies are inconsistent: some have imagery and iconography, others are text-only. This undermines credibility and makes the portfolio feel unfinished.

Normalized Template

Every case study should include a standardized set of fields:

Filtering

Add filter controls to the case study index by category:

• Agriculture
• Metal
• Restoration
• Single-ply
• Sustainability
• (expand as needed)

Seeding

Launch with top 20 case studies selected by SBSWI (Brandon). Expand post-launch. SBSWI to deliver titles, summaries, metrics, dates, location, system type, and photos by the Dec 8 review meeting.

Contact & Lead Capture

Consolidation

Merge the separate "Contact" and "Request Estimate" pages into a single destination. Reduces friction and eliminates confusion about which form to use.

Form Design

• Route to: info@sbswi.com (team-wide visibility)
• Internal CC list to be confirmed by Brandon
• Fields: name, company, property address, service interest, message
• Keep fields minimal — lower friction = higher conversion

Appointment Request Module

Rather than live calendar booking (which requires rigorous calendar hygiene the team doesn't currently maintain), implement a lightweight appointment request widget:

• Customer selects 3 preferred dates
• Customer selects AM or PM window for each
• Submission routes to info@sbswi.com — team confirms manually

This was explicitly preferred over real-time scheduling tools. Decision to be confirmed by Brandon before build.

Open decision: AM/PM window widget vs. live calendar integration. Brandon to decide before build begins.

Mobile UX

• Reviews must remain prominent on mobile — current floating icon treatment is inadequate
• Asymmetric to audit current mobile layout and propose replacement pattern
• Form and appointment widget must be fully functional on mobile
• Fast load is a hard requirement (conversion-readiness depends on it)

URL Structure & Redirects

Preserve Existing URLs

SBSWI uses QR codes in the field (on job sites, materials, etc.) that point to specific URLs. These must not break at launch.

• Inventory all QR code endpoints before migration
• Map all existing URLs to new equivalents
• Implement 301 redirects for any changed slugs
• Preserve URL structure wherever possible to protect both QR codes and existing SEO equity

DNS & Email Deliverability

Current DNS is at SiteGround (registrar stays there). Post-migration, Asymmetric manages DNS.

Known issue: CenterPoint Connect email links/deliverability are broken due to missing DNS records. Resolve at cutover:

• SPF
• DKIM
• DMARC
• Required CNAMEs

Asymmetric to prepare full DNS/email deliverability plan before cutover. SiteGround credentials to come from Megan.

Content & Assets Checklist

Stock photography will be used as placeholders during design/build. A targeted photoshoot (staged OK) is planned post-launch or during build as schedule allows.

Related

• ^[1]
• ^[2]
• ^[3]
• ^[4]
• ^[5]