Портфолио — частый учебный и одновременно вполне реальный проект: с одной стороны, на нём удобно тренировать вёрстку, с другой — готовый результат можно использовать как настоящую визитную карточку при поиске работы или заказов в сфере разработки и дизайна.
Структура личного портфолио обычно проще, чем у коммерческого лендинга: краткое представление в самом начале, раздел с примерами работ, иногда небольшой блок о профессиональном опыте и способ связаться в конце страницы. Лишние декоративные блоки здесь часто только отвлекают от главного — самих работ.
Раздел с работами — смысловой центр всей страницы, и ему стоит уделить больше всего внимания при вёрстке. Сетка из карточек проектов с изображением, названием и коротким описанием технологий, использованных в работе, — рабочий и проверенный вариант, который легко читается посетителем.
Для портфолио особенно важно, чтобы сама страница демонстрировала аккуратный код и хороший вкус — это ведь пример собственных навыков вёрстальщика, и небрежность в деталях здесь заметна вдвойне сильнее, чем на любом другом проекте, сделанном для стороннего заказчика.
Анимации на портфолио уместны, но лучше использовать их умеренно — цель страницы показать работы, а не перегрузить посетителя эффектами. Лёгкое появление карточек при прокрутке и плавные переходы при наведении обычно достаточны, без более сложной и отвлекающей анимационной хореографии.
Тёмная тема на портфолио разработчика или дизайнера встречается особенно часто — аудитория таких страниц нередко сама предпочитает тёмный режим в своих инструментах, и учёт этого предпочтения хорошо считывается как внимание к деталям.
Вдохновение и примеры структуры личных портфолио можно найти в подборках на Awwwards в разделе портфолио.