Anatomy of an Adobe Portfolio Website

This article will map out the different components of an Adobe Portfolio site using the Andreas theme as an example.

image-20240130-155917.png

 

Collection Page
A Collection is a group of Pages(sub-pages) that are thematically similar. In this example, we’re viewing a Collection called ‘work’ that contains Pages including At Night 4

Cover Image
A Cover Image is used to represent a Page on a Collection Page. It’s recommended to use an image closely related to the Page's content, but you can decide what you want to show. 

Page Title & Descriptions
Depending on the Theme, Page Titles and Descriptions will appear by default or may be activated when a mouse cursor hovers over the Cover Image (known as a "Rollover"). 

Navigation
The Navigation usually appears on the top or the left side of your site depending on the Theme you’ve selected. The Navigation is used to help visitors get around your site. It’s also where you can showcase your Logo  and where you can add Social Profile Icons  to link out to other accounts across the web like Facebook, Twitter, and Behance.

Masthead
The Masthead is the area near the top of a Page that can be used to provide a greeting, a call to action (CTA) or other additional information about you or your work. Mastheads can appear on Galleries or Pages. 

 Page
A Page is a collection of images, videos, text, and other elements that are arranged to showcase your creative projects. Pages is where you upload your content (images, videos, etc.) to. A visitor can reach a Page via a Collection page or directly from the Navigation. 

Page Title & Description
A Page Title Description here is the same information that appears on the Page Title and Descriptions on the Cover Image.

Photo Grid
One of the elements you can add to a Page is a Photo Grid. As the name suggests, a Photo Grid is an element that groups a collection of images into a neat, responsive grid. Images from your computer or Lightroom Web Collections can be imported into a Photo Grid.

More in this Collection
Located at the bottom of a Page, Other Pages navigates visitors to other Pages within the Collection you’re currently viewing. Remember, in this example, we’ve started in the "work" Collection, and we’re viewing the Page At Night 4. At Night 2, Iceland Road Trip, and Modern World 1are also Pages included in the "work" Collection.