Componentizing Designs

In this video, Martina Welander goes through the process of breaking a set of HTML templates into data templates and components before programming even starts. ----------------------------------------------------- [TEMPLATES] Page Meta Data (Base) • Page Title • Page Meta Description • Page Keywords Page Content (Base) • Heading (may be replaced by ‘Heading’ items if content needs to be personalized or testable) • Main Content • Main Image Home (Page – Inherits Page Meta Data) Pet List (Page – Inherits Page Meta Data, Page Content) Pet Detail (Page – Inherits Page Meta Data, Page Content) Banner • Title • Text • Link • Image Promotion • Title • Text • Link • Image Call to Action • Phone Number • Subtitle Navigation Item • Link • Icon (?) [COMPONENTS] Banner Promotion Call to Action Featured Pet List (?) Breadcrumb Title (Required if individual page titles need to be tested) Body Content Pet List Header Footer Two Column (may need one and three column in future) Promotions Wrapper (is this too much?) Featured Pets Wrapper