Tunics vs. Shirts vs. Blouses: What’s the Difference?

Vermont Country Store — Oracle Commerce Cloud
Role: Frontend Developer / OCC Implementation
Live URL: [vermontcountrystore.com/signature-products-tunics-vs-shirts-vs-blouses-whats-the-difference](https://www.twine.net/signin

What This Was

A static editorial page in VCS’s Signature Products series built around a genuine customer confusion point — the vocabulary difference between tunics, shirts, and blouses, and what each means in practice when shopping. The page educates before it sells, resolving terminology friction that can stall a purchase decision, then funnels shoppers into VCS’s women’s tops catalog, including the exclusive Ella Simone and M. Mac collections.

What I Built

Organized the page as a plain-language comparison: what defines each garment type (fit, length, fabric weight, occasion), how they differ at a glance, and which VCS styles fall into each category. The structure moves from definition to differentiation to product — the natural path for a shopper who arrives not knowing what to search for.

Content decisions were made at the developer level. Copy was written to match VCS’s voice: clear, practical, and respectful of the customer’s intelligence — not fashion-editorial, not condescending. Special attention was given to tunics, a VCS strength relevant to plus-size shoppers, where relaxed silhouettes serve comfort and coverage needs.

Code Sample

The comparison-table pattern used to lay out the three garment types side by side:

<table class="comparison-table">
  <tr><th>Type</th><th>Length</th><th>Best For</th></tr>
  <tr><td>Tunic</td><td>Hip to mid-thigh</td><td>Layering, coverage</td></tr>
  <tr><td>Blouse</td><td>Waist length</td><td>Dressier occasions</td></tr>
</table>

Constraints

• Vanilla HTML/CSS only — no framework, no custom JS
• Authored entirely through OCC Admin content editor
• Bound to VCS’s global stylesheet — no shared CSS modifications
• Images sourced from OCC media asset library
• SEO-optimized: comparison-format H1 targeting definitional search queries

Why It’s Interesting

Comparison and definition pages are among the highest-converting editorial formats in ecommerce — they intercept shoppers at the moment of confusion, before they’ve committed to a category. Building this in OCC required translating that content strategy insight into a static page structure with no CMS tooling, no templates designed for comparison content, and no UX support — just clean HTML, good content judgment, and an understanding of where the shopper is in their decision.

Oracle Commerce Cloud OCC Admin ATG HTML CSS Enterprise Ecommerce Content Architecture UX Writing SEO Women's Apparel Comparison Content

Role — Frontend Developer