37 lines
934 B
Markdown
37 lines
934 B
Markdown
# f-pattern
|
|
|
|
Eye scans the top and left side, forming an F shape.
|
|
|
|
## Structure
|
|
|
|
- Most important content in the top horizontal band
|
|
- Second most important in a secondary horizontal band
|
|
- Left-aligned content for the vertical scan
|
|
- Right side less prominent, used for supporting details
|
|
|
|
## Best For
|
|
|
|
- Text-heavy infographics
|
|
- Report or article-style layouts
|
|
- Content where hierarchy matters most
|
|
- Designs optimized for quick scanning
|
|
|
|
## Visual Elements
|
|
|
|
- Strong top banner with headline and key visual
|
|
- Left-aligned content column
|
|
- Secondary horizontal accent below the top band
|
|
- Right column for supplementary info
|
|
|
|
## Text Placement
|
|
|
|
- Primary headline in top band
|
|
- Key points left-aligned in the vertical column
|
|
- Supporting details in the right column
|
|
|
|
## Recommended Pairings
|
|
|
|
- `aged-academia`: Editorial report layouts
|
|
- `ui-wireframe`: Content-heavy wireframes
|
|
- `corporate-memphis`: Structured business reports
|