Wireframe 02 of 16
Service Page
One page per service. Seven pages share this layout: Roof Replacement, Roof Repair, Roof Inspection, Storm Damage & Insurance Claims, Gutter Installation, Commercial & Multi-Family, Emergency Roofing.
Section specification
What belongs in each band of the drawing below. The drawing shows the shape; the note is the specification. Where the two disagree, the note wins.
- 01
Headernav
Identical across the site.
- 02
Heroheroform
Service-specific headline with the city or region, trust points, primary CTA. Each service gets its own headline, not a template fill.
- 03
Trust bandbadges
Same four credentials as the home page.
- 04
Intro copy + contenth2 t4 h2b t3
800–1,200 words of service-specific body: what is included, materials, signs you need it, process, cost factors. This is where the page earns its ranking.
- 05
Gallery: before/after job photosimgrow3 imgrow3b
A gallery on every page, showing completed work for THIS service. Before-and-after pairs are the priority: the same roof photographed before and after the work is the most persuasive image a roofing site can show, and it is what visitors use to judge quality. Pairs use the drag-to-compare slider; single photos fill out the grid.
- 06
Processsteps
The named three-step process, contextualised to this service.
- 07
Reviewsreviews
Reviews that mention this service where possible.
- 08
Financingbanner
Payment options, once lender terms are confirmed.
- 09
FAQaccordion
Service-specific questions. FAQPage schema.
- 10
Quote formformbox
Same form, contextual heading naming the service.
- 11
Closing CTA + footerctaform footer
Phone, form link, footer, chat widget.
The page as one continuous drawing, top to bottom. Each number in the margin matches the specification above.