League Law — home v2, in pencil ✏️

The hi-fi prototype converted back down to layout only: no brand colour, no real type, no imagery. This is home v2 as it stands today, which is a long way from the as-is wireframe drawn on 2026-08-20 — the hero, band, practice areas, team, facts and footer have all been replaced since, and the FAQ that was dashed as “proposed” on that sheet is now built. Red is a note from me, not something on the page.

image text mid ground dark section brand hexagon NEW new since the as-is sheet red = designer note
Desktop · 1280 wrap · 11 blocks
1
HEADER — sticky, 92px  NEW
LOGO
INJURIES▾ESTATES▾BUSINESS▾ MARINE▾REAL ESTATE▾YOUR TEAM▾
CALL NOW250-888-0002
six mega panels · hive watermark sits in the outer gutters, never behind the logo
Header is now position:sticky. That is not decoration — the hero's scroll maths is written against a 92px header that stays put.
2
HERO — scroll-pinned slider  NEW
FULL-BLEED SLIDE 1 of 3 — pins while the page scrolls past
CONTACT FORM
SEND MESSAGE
the image is fixed; only the form travels up the right side, then docks under the header
All three slides are placeholders — the photographs do not exist yet (new office exterior · whole team in reception · teams at work). The section cannot be judged finished until they are shot.
3
REVIEWS + LOCATIONS BAND  NEW
G
4.9 ★★★★★173 reviews · on Google
● OUR SIX LOCATIONS IN BRITISH COLUMBIA
Victoria — Head Office VancouverNanaimoDuncan Campbell RiverKelowna Read more →
The six locations are deliberately not links and have no hover. Only Read more is clickable. — 4.9 and 173 are hardcoded; nothing keeps them true.
4
PRACTICE AREAS — photo mosaic  NEW
INJURIES
ESTATES
BUSINESS
MARINE
REAL ESTATE
two over three · icon stamped top-left of every tile · whole tile is one link
The Injuries photograph is repaired, not clean — a graphic was painted out of it — and it is 411px shown at 631px. It should be re-shot. The five photo-to-practice pairings are inferred from filenames, not stored anywhere.
5
YOUR TEAM — dark portrait grid  NEW
CAREERS — is it you?APPLY →
12 people, six across · email hexagon sits on the seam between photo and name · careers moved out of the grid
12 mailto: addresses are published on the homepage where the live site publishes none. Five of the twelve portraits are low-resolution; do not widen these cards.
6
TESTIMONIALS
★★★★★
★★★★★
★★★★★
READ ALL REVIEWS
The five stars are uniform because no rating is stored on a testimonial. True only while every published review is genuinely 5-star.
7
FEATURED ARTICLES
PRACTICE AREA · DATE
Read more →
PRACTICE AREA · DATE
Read more →
PRACTICE AREA · DATE
Read more →
ALL ARTICLES
The three featured pieces date from 2020–2022 while the blog's newest post is 2026-07-02.
8
LaW FACTS — dark cards  NEW
six facts, three across, two rows · orange hexagon straddles the seam between photo and text
9
WATCH OUR VLOG
▶ 4:15
▶ 4:15
▶ 4:15
WATCH ALL VIDEOS
The vlog half has no tagline where the articles half has one.
10
FAQ — five entries  NEW
?
first row open at load · chevron right · native <details>, no JavaScript
All five questions and answers are new copy awaiting Darren's approval. Every fact in them comes from the site or the database — but the questions a law firm's FAQ actually needs (fees and contingency, limitation periods, whether a case is worth pursuing) are missing, because a designer must not write them.
11
CTA BAND + FOOTER
FREE CONSULTATION
LOGO
250-888-0002
© 2026 League and WilliamsPrivacy · Terms · Sitemap
hive watermark in the outer gutters, same rule as the header
The visible address is a placeholder — the exact address after the November move is still unknown. Section 12 (“contact strip”) exists in the CSS but is empty; the CTA band lives inside the footer block instead.
Mobile · 375w
1
HEADER
LOGO
phone drops to a sticky call button
Six mega panels have to become an accordion drawer. That is the biggest untested part of this design on a phone.
2
HERO
SLIDE 1 of 3
CONTACT FORM
SEND
The scroll-pin and the travelling form are desktop behaviour. On a phone the form should simply sit under the image — this needs deciding, not inheriting.
3
BAND
4.9 ★★★★★
173 reviews
Victoria — HOVancouverNanaimoDuncanCampbell R.Kelowna
4
PRACTICE AREAS
AREA 1
AREA 2
AREA 3
AREA 4
AREA 5
Five stacked tiles is 5×54px of photograph before the team. The mosaic's whole point is the size difference between tiles, and one column erases it.
5
TEAM
Twelve portraits two-across is six rows deep.
6
TESTIMONIALS
7
ARTICLES
9
VLOG
8
LaW FACTS
10
FAQ
The accordion is the one section that works better on a phone than on the desktop.
11
CTA + FOOTER
FREE CONSULTATION

What this sheet is for. Converting a finished design back to pencil is a test: anything that only works because of colour, photography or type stops working here. Three things showed up when the page was redrawn — the hero is three photographs that do not exist, the practice mosaic loses its whole idea in one column, and the header's six mega panels have no drawn mobile answer yet. None of those is visible in the hi-fi prototype.