Unit 05 · overview

Unit 5: Assets, CSS, Responsive Design, and Accessibility

The portfolio finally gets a deliberate visual system in this Unit.

But we are not leaving systems thinking behind.

You will trace assets through Jekyll, separate generation from browser styling, build responsive CSS, and verify semantic/keyboard/image accessibility in the generated pages.

Unit question

How does source become a usable visual interface without hiding asset, browser, and accessibility failures behind "it looks fine on my screen"?

Unit path

  1. Processed Assets vs Static Files
  2. Asset Paths and Why They Break
  3. CSS Architecture for a Small Jekyll Site
  4. Typography, Spacing, and Visual Hierarchy
  5. Responsive Layouts
  6. Images and Alternative Text
  7. Semantic HTML
  8. Keyboard and Focus Checks
  9. Metadata and Link Quality
  10. Responsive and Accessibility Failure Lab
  11. Unit Build: Portfolio Visual System

Unit artifact

A responsive, accessible portfolio visual system plus asset-path, keyboard, responsive, and generated-output evidence.

Upstream foundation

This Unit adapts Jekyll's official Assets/static-file behavior and source/build conventions. Robotnix adds the responsive-design and accessibility instruction around the generated site.