Skip to content
Emisshield

Wireframes · Blog and news page

Blog and news page: five approaches

Dated posts: the hub and the reading experience.

  1. Option 1

    Featured

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

    1. 1Header: featured post
    2. 2Dated post list
    3. 3Pull quote with attribution
    4. 4Newsletter band
    5. 5Related pages

    Open

  2. Option 2

    Cards

    Light: reads top to bottom like a magazine feature.

    1. 1Header: compact, light
    2. 2Chip strip
    3. 3Post card grid
    4. 4Author block
    5. 5Pagination bar

    Open

  3. Option 3

    Editorial

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

    1. 1Header: document style with meta row
    2. 2Narrow prose with pull line
    3. 3Photo band
    4. 4Prose with key-takeaway callout
    5. 5Related pages

    Open

  4. Option 4

    Magazine

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

    1. 1Header: text left, photo half right
    2. 2Featured item plus list
    3. 3Category tiles with counts
    4. 4Post card grid
    5. 5Newsletter band

    Open

  5. Option 5

    Archive

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

    1. 1Header: search field and chips
    2. 2Filter rail with list
    3. 3Dated post list
    4. 4Archive by year
    5. 5Pagination bar

    Open