.cards-sec — 9 layout options

The section is used twice on the homepage: featured articles and the vlog. L1–L8 are article layouts; L9 is the vlog-specific one. Stages carry the locked pieces — the X16 badge, the section heading scale, the B19 button — so only the layout varies.

What is wrong with the layout today, stated plainly. This is the section where the current site leaks the most, and none of it is about prettiness:
  1. The excerpts are centred. Centred multi-line body copy forces the eye to hunt for the start of every line. Headings can be centred; three-line paragraphs should not be.
  2. There is no metadata at all — no date, no practice area, no author. A visitor cannot tell whether an article is from 2014 or last month, or whether it is about the thing they came here for.
  3. Nothing states that a card is clickable and there is no link to the archive. 427 articles exist and the homepage offers no door to them.
  4. Three items, flat hierarchy, ~700px of page. No item leads; the newest and the oldest look identical.
  5. The images carry no information (a stock photo of crops heads an estate-dispute article) while taking the most space in each card.
Every option below fixes some subset of those. Which subset is the actual decision.

This also settles the open question from the badge round: the section header does not need to become a link. A "View all articles" control gives the archive a proper door without turning a heading into a control — so the badge can stay decoration, as picked.

Placeholder data: dates, read times and practice-area tags shown below are invented to demonstrate the layout — real values come from the posts. Article titles and images are the real ones from the live homepage.

L1Baseline — three centred cards What the page has now, for reference. All five problems above are visible in it at once.

Read Our Featured Articles

Estate Dispute Case: Changing an Unfair Will

A recent BC Supreme Court case involved unfair wills with an estate distributed unequally amongst sons and daughters…

Buying a Home with Co-Ownership

Two or more people often use a co-ownership agreement when they buy an asset together, like a house or land…

Benefits of Having a Will

Will-writing, estate planning, estate administration, probate, trust funds, inheritances – the list goes on…

L2Three-up, left-aligned, with metadata Same grid, everything else fixed: copy left-aligned, a practice-area tag above each title, date and read time below, an explicit Read-more, and a View-all under the row. The smallest change that removes all five problems — nothing about the page's rhythm moves.
L3Lead article + list One article leads at full size; three more sit beside it as compact rows. Gives the section a hierarchy and shows four items in the space three used to take. The standard news-page shape, and it reads as "this firm publishes regularly."
L4Text-first list — no images Drops the images entirely: practice area, title, one line, date. Five articles in less height than three cards, and it puts the honest information first. Fits the direction doc's "distinctiveness from information design, not decoration" better than anything else here — but it is a real departure from how the section looks today.
L5Two columns, six items, small thumbs Keeps images but demotes them to 96px cells beside the text. Six articles in roughly the height of three cards — the densest option that still looks like a magazine rather than a directory.
L6Grouped by practice area Three columns headed by practice area, two articles each. Ties the writing to the triage layer the client cares most about — a visitor with an estate problem sees estate writing, and the section doubles as a second route into the practice areas.
L7Horizontal rail Cards scroll sideways, with a card cut off at the edge so it is obvious more exist. Shows six or eight items in the height of one row — but anything past the third card is a click away, and hidden content is content most visitors never see.
L8Editorial column + item rows The heading, an intro sentence and the View-all move into a left column; the articles stack as wide rows on the right with small thumbs. Uses the 1280 grid honestly instead of centring everything, and gives the section a voice ("why we write these") rather than just a label.
L9Vlog — hexagon play button + duration The vlog half of the section. The play button becomes the brand hexagon instead of a generic circle, each thumbnail carries its running time, and the topic tag says which area of law it answers. Pairs with whichever article layout is chosen — the two do not have to be identical, only consistent.

Watch Our Vlog

Ever wonder why liability insurance is a good idea? Can a speeding cyclist get a ticket? Should you be sorry for saying sorry? Short answers to the questions clients ask most.