Header
The top section of a webpage, typically containing the logo, main navigation, and key actions like sign-in buttons. Headers establish brand identity and provide consistent navigation across all pages. Design headers to be useful without overwhelming—users should find what they need without excessive visual competition.
Footer
Layout
The bottom section of a webpage, typically containing navigation links, copyright information, and secondary content like contact details or social links. Footers provide a sense of closure and catch visitors who've scrolled through all content. Design footers to be useful—include key links users might need after reading your page.
HTML
General
HyperText Markup Language—the standard code that structures web content using tags that define headings, paragraphs, links, and other elements. While Framer generates HTML automatically, understanding its structure helps with SEO, accessibility, and debugging. Semantic HTML using proper tags like header, nav, and main improves accessibility and search rankings.
Semantic HTML
Accessibility
Using HTML elements according to their intended meaning rather than just visual appearance, improving accessibility and SEO. Semantic elements like header, nav, main, and article convey document structure to assistive technologies. Framer generates semantic HTML from visual designs automatically. See How to use semantic tags for navigation and footers.
Sticky Position
Layout
A hybrid positioning method where elements behave normally until reaching a scroll threshold, then fix in place. Sticky positioning creates headers that stay visible during scrolling within their container. Use sticky for navigation, sidebar elements, and persistent calls to action.
Header Navigation
Layout
The primary navigation links typically placed in the site header, providing access to main sections. Header navigation should prioritize the most important destinations while remaining uncluttered. Design mobile variations carefully, often using hamburger menus to save space.