Zigzag Image Layouts Make Pages Harder to Scan
In zigzag layouts, where image and text swap sides on each row, decorative images caused repeated accidental fixations. In aligned layouts, users skipped those same images and kept reading. Nielsen Norman Group tested this with about 30 to 35 participants per layout variant across 4 sites (Nielsen Norman Group, 2017).
What the research observed
Informative images got attention in both layouts. The difference was in the decorative ones. When images stayed in one consistent column, people learned to ignore that column and read the text. When images switched sides, the eye kept landing on them by accident as it moved down the page, and time went to pictures that offered nothing (Nielsen Norman Group, 2017).
The study also found that users start scanning on the left unless right-side content sits noticeably higher. So in the first row of a zigzag, whatever is on the left tends to be seen first (Nielsen Norman Group, 2017).
What it means for a business website
The zigzag is one of the most common layouts on small business home pages and service pages. Website themes and page builders offer it by default: a row with a photo on the left and text on the right, then the reverse, repeated for five or six features.
If those photos are generic or decorative, the layout makes visitors work harder to read the text that matters. Each row adds another detour for the eye. If the images carry real information, such as a photo of the actual product or a finished job, the cost is lower.
What to do
- Put images in one consistent column instead of alternating sides.
- If you keep a zigzag, limit it to 2 or 3 rows.
- Place the most informative content on the left side of the first row.
- Top-align each image with its text, and remove images that add no information.
Sources
- Flaherty. Zigzag Image-Text Layouts Make Scanning Less Efficient. Nielsen Norman Group, 2017.