Layout

List entries (example: gallery)

List entry: Sometimes called "category pages" (when they contain items belonging to a specific product category), "directory pages" (when they list locations or people), or "gallery pages" (when they contain graphics or images).
Pogo sticking: Navigating from a routing page—a search-engine results page (SERP), section landing page, product-category page, or similar—to a page deeper in the site’s hierarchy, then immediately back to the routing page

To avoid the need for the user to pogo stick:

Prioritize list-entry attributes to create an information hierarchy
The amount of product detail in the list entry needs to be just right: too much will overload users and prevent them from seeing enough choices in one view, too little will make them pogo stick.
Reflect attribute priorities in the mini-IA and visual design of each list entry
Treat each list entry as if it were a small webpage and make sure that your layout and visual treatment of each attribute within that description matches its priority relative to other attributes.
Use consistent styling across list entries to support comparison
In other words, the same piece information should be represented in the same place using the same visual treatment. (See: the amazon example in Design principles: Repetition @2:28)

Definition: A card is container for a few short, related pieces of information. It roughly resembles a playing card in size and shape, and is intended as a linked, short representation of a conceptual unit.

Cards have 4 key properties:

When Cards Are Useful:

Cards are better suited when users browse for information than when they search.
- Card layouts typically deemphasize the ranking of content.
- Card layouts are less scannable than lists.
- Cards take more space.
Cards work best for collections of heterogeneous items (i.e. not all the content is of the same basic type).

Some of the most common footer components, examples, and recommended situations in which to use them: