Skip to content
Emisshield

Wireframes · Secondary landing page

Secondary landing page: five approaches

The front of a section (Technology, Resources, Quality). Five approaches, sparse to dense.

  1. Option 1

    Statement-led

    Sparse: the fewest words, the most air. One idea per band.

    1. 1Header: oversized light typographic
    2. 2Centered dark statement
    3. 3Sticky heading with large link list
    4. 4One hero number with support stats
    5. 5Photo half, text half

    Open

  2. Option 2

    Editorial

    Light: reads top to bottom like a magazine feature.

    1. 1Header: photo backdrop, left stack
    2. 2Statement with two-column blurb
    3. 3Numbered register rows
    4. 4Numbered stat rows
    5. 5FAQ, question and answer rows

    Open

  3. Option 3

    Visual

    Medium: imagery and numbers carry the page; copy stays short.

    1. 1Header: text left, photo half right
    2. 2Image cards
    3. 3Statement over photo band
    4. 4Image card row
    5. 5Pull quote with attribution

    Open

  4. Option 4

    Proof-led

    Medium to dense: more per screen, still one topic per band.

    1. 1Header: two columns with stat strip
    2. 2Dark data table beside text
    3. 3Before and after panels
    4. 4Logo strip
    5. 5Centered statement with three pillars

    Open

  5. Option 5

    Directory

    Dense: the most information per screen, built for scanning.

    1. 1Header: centered stack, two buttons
    2. 2Chip strip
    3. 3Square tile grid
    4. 4Expandable rows beside heading
    5. 5Dense two-column feature

    Open