Section Skeleton Skill
Purpose
Outputs Astro component skeleton with named slots. Structure only.
Input
section_type: hero | trust-strip | problem | solution | benefits | how-it-works | social-proof | faq | final-cta | footer | pricing | gallery
variant: default | compact | expanded
page_type: landing | service | service-area | article | calculator | thank-you
Output
skeleton: "<section>...</section>"
slots: [headline, body, cta-primary]
slot_semantics: { headline: h2_primary }
skeleton_verdict: PASS | WARN | FAIL
Page-Type Compatibility
| Section |
Allowed |
Forbidden |
| hero |
landing, service, service-area |
- |
| problem |
landing |
service-area, article |
| solution |
landing |
article, thank-you |
| pricing |
service, landing |
article, thank-you |
| gallery |
service, landing |
calculator |
| calculator-widget |
calculator, landing |
article |
| local-reviews |
service-area |
landing |
| upsell |
thank-you |
landing, service |
Forbidden combination → STOP.
Section Order Constraints
| Section |
Rule |
| hero |
must_be_first |
| footer |
must_be_last |
| final-cta |
before footer only |
| trust-strip |
after hero only |
Order violation → FAIL.
Slot Cardinality
| Slot |
Min |
Max |
| headline |
1 |
1 |
| subheadline |
0 |
1 |
| body |
0 |
1 |
| cta-primary |
0 |
1 |
| cta-secondary |
0 |
1 |
| image |
0 |
1 |
| items |
0 |
∞ |
| cards |
0 |
∞ |
Max exceeded → FAIL. Required missing → FAIL.
Slot Semantic Roles
| Slot |
SEO Role |
| headline |
h2_primary_keyword |
| subheadline |
semantic_support |
| body |
topical_depth |
| items |
long_tail (FAQ) |
Cross-reference: heading-tree skill uses this.
Variant Behaviour
default
All slots available.
compact
forbidden_slots: [subheadline, cta-secondary, image]
expanded
required_slots: [image, subheadline]
Variant violation → WARN.
Accessibility Requirements
| Slot |
A11y Rule |
| image |
alt required |
| faq items |
aria-expanded |
| cta-* |
aria-label if icon-only |
A11y missing → WARN.
Slot Naming Convention
| Slot |
Content Type |
| headline |
H2 element |
| subheadline |
Paragraph |
| body |
Multiple paragraphs |
| cta-primary |
Primary Button |
| cta-secondary |
Secondary Button |
| cta-phone |
Phone link |
| image |
Picture component |
| items |
Repeated list items |
| cards |
Repeated card components |
Skeleton Verdict
skeleton_verdict: PASS | WARN | FAIL
issues: []
| Condition |
Verdict |
| Forbidden page-type |
FAIL |
| Order violation |
FAIL |
| Required slot missing |
FAIL |
| Max cardinality exceeded |
FAIL |
| Variant slot violation |
WARN |
| A11y missing |
WARN |
| All rules pass |
PASS |
FAIL States
| Condition |
| Section on forbidden page-type |
| hero not first |
| footer not last |
| Required slot missing (headline) |
| Slot count > max |
WARN States
| Condition |
| Compact variant with forbidden slot |
| Image without alt |
| Icon button without aria-label |
Non-goals
- Does NOT write content
- Does NOT style beyond structure
- Does NOT include interactivity
- Does NOT generate child components
References
- skeletons.md — Full Astro skeleton code
Definition of Done
majiayu000