Text styles and semantic tags
In Framer, when you create text styles, they are automatically assigned semantic tags like h1–h6, p, or span.
These tags can be overridden for specific instances using the Accessibility panel, enabling you to customize your site’s semantic structure as needed.
Using a clear heading structure is essential. Start with an <h1>
for the main title, then organize content using <h2>
and <h3>
headings. This approach enhances usability, avoids large text blocks, and helps search engines understand the content’s hierarchy and significance.
A well-structured layout improves SEO and accessibility. Headings and subheadings enhance readability for users with visual or cognitive disabilities. They also improve navigation for screen reader users, making information easier to access.