Module 3 · Media & Embedded Storytelling

Module 3 transforms Portfolio Pulse into a compelling visual narrative. You will ship a responsive gallery, integrate embedded media responsibly, and maintain performance budgets that keep the experience fast on any device.

What You Will Deliver

• Responsive images with srcset, sizes, and correct intrinsic dimensions.
• Accessible media with captions, transcripts, and descriptive alt text.
• Embedded video or audio assets that respect privacy and performance.
• A gallery section that tells the portfolio story without sacrificing speed.

Lesson Map

1. Media Strategy Introduction — align storytelling goals with performance guardrails.
2. Responsive Images — master srcset, sizes, and intrinsic sizing.
3. Art Direction with <picture> — tailor imagery across breakpoints and formats.
4. Media Performance — set budgets, lazy load, and choose optimal formats.
5. Accessible Media — craft alt text, captions, and transcripts that add meaning.
6. Video & Audio Embeds — integrate rich media with fallbacks and consent.
7. Gallery Blueprint — structure figures, captions, and callouts for the showcase.
8. Implementation — build the full showcase gallery for Portfolio Pulse.
9. Validation — audit accessibility, performance, and documentation.

Bring your project brief, accessibility manifesto, and validation logs. You will expand each to cover media governance and analytics notes.