Understanding HTML Tags

Understanding and using HTML tags correctly can greatly improve accessibility, optimize search engine results, and enhance the overall user experience.

In this guide, we'll explore the strategic placement of HTML tags within Framer and discuss the benefits they offer to your website.


Encapsulates the main content of a page, including the title and body, but excludes general site elements like navigation.


Represents content tangentially related to the content around it. Often used for sidebars or pull quotes.


Creates a clickable button. Always use Button tag for interactive elements rather than relying on non-semantic elements like <div> or <span>.


The <div> element in HTML is a generic container used to group other HTML elements and apply styles or scripting to them. It does not inherently provide any semantic meaning to the content it wraps. Its primary purpose is to structure and organize the layout of a webpage.


Provides a caption or description for the content inside <figure>.


Encapsulates any content that is referenced from the main content (such as images).


Utilize the <main> tag to signify the main content of a website or section. This tag enhances the accessibility and usability of your website by simplifying navigation and aiding users in finding the information they seek.

Ol (Ordered List)

Use the <ol> element to create an ordered list, where each list item is numbered. The order of items has significance.

Ul (Unordered List)

The <ul> element is used to create an unordered list, where each list item is typically bulleted or marked with a different symbol. The order of items does not carry significance.


Designates the site's footer, typically containing secondary links and email sign-up sections. It can also be used within individual sections.


Identifies the site's header or navigation bar, which can be a floating sticky bar. It's also applicable within sections.


Surrounds all navigation elements on a page, such as header links, footer links, or sidebar navigation.


Marks a distinct section of your page, like a block for unique selling points (USPs) or testimonials.

If you encounter any issues or need further assistance, create a support ticket in the Community.