Website Evaluations
The CRAP principles - Contrast, Repetition, Alignment, and Proximity - are foundational guidelines for effective visual design. Below are evaluations of two websites: one that exemplifies good design, and one that falls short in several key areas.
Apple.com
Well Designed
- Contrast: Apple uses bold contrast effectively throughout. Dark text on light backgrounds and light text on dark hero images make content immediately readable. Product photography pops against clean white space, guiding the eye naturally.
- Repetition: A consistent design language is applied across every page: the same typeface, uniform button styles, and a recurring grid layout create a cohesive experience that feels polished and intentional.
- Alignment: Every element is precisely aligned. Text blocks, images, and buttons all follow a strict grid. Nothing feels randomly placed. The centered hero sections and left-aligned body copy create a clear, predictable reading path.
- Proximity: Related content is grouped closely together with generous whitespace separating distinct sections. Product name, description, and price are always near each other, reducing cognitive load and making it easy to absorb information at a glance.
Goodreads.com
Poorly Designed
- Contrast: Goodreads frequently uses low-contrast text. Light gray type on white backgrounds makes secondary content difficult to read. The color palette is muddy and inconsistent, with beige, brown, and green competing without a clear visual hierarchy.
- Repetition: Design patterns are inconsistent across pages. Button styles, font sizes, and card layouts change unpredictably from section to section, giving the site a disjointed, patchwork feel rather than a unified brand identity.
- Alignment: Many pages suffer from misaligned elements. Sidebars, ads, and content blocks do not follow a consistent grid. Items appear to float independently rather than anchoring to any shared visual structure, making pages feel cluttered and hard to scan.
- Proximity: Unrelated elements are often placed too close together. Ads appear wedged between review content, and navigation items crowd each other without clear grouping. Related information like book details and ratings is sometimes scattered across the page rather than grouped logically.