Accessibility

The practice of designing websites that can be used by everyone, including people with visual, auditory, motor, or cognitive disabilities. Beyond being ethically important, accessibility improves SEO, expands your audience, and is legally required in many jurisdictions. Key practices include proper heading structure, alt text for images, sufficient color contrast, and navigationkeyboard navigation support.

Related terms

Related terms

  • ARIA Label

    Accessibility

    An HTML attribute that provides accessible names for elements that lack visible text labels, helping screen readers describe interactive elements. These are essential for icon buttons, decorative links, and complex widgets where the visual context isn’t available to assistive technology. Use aria-label when there’s no visible text, and aria-labelled by to reference existing text on the page. See Improving Accessibility with ARIA Labels. See Optimizing images, icons & interactive elements.

  • Color Contrast

    Accessibility

    The difference in luminance between foreground and background colors, critical for text readability and accessibility. WCAG guidelines require minimum contrast ratios of 4.5:1 for normal text and 3:1 for large text. Use contrast checking tools to ensure your color combinations are accessible to users with visual impairments. See Understanding contrast ratio.

  • Focus State

    Accessibility

    The visual appearance of an interactive element when it receives keyboard focus, which is critical for accessibility. Focus states must remain clearly visible; do not remove them without providing an equally visible replacement. A strong focus style improves usability for keyboard and assistive-technology users.

  • Heading Hierarchy

    Accessibility

    The structured use of heading levels (H1-H6) to organize content and communicate importance to users and search engines. Proper heading hierarchy improves accessibility, SEO, and content scanability. Use only one H1 per page and don't skip levels for visual styling. See Text styles and semantic tags.

  • 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.

  • Keyboard Navigation

    Accessibility

    The ability to navigate and interact with a website using only keyboard controls, essential for accessibility. Test tab order, focus visibility, and keyboard-activated interactions to ensure full functionality. Many users rely on keyboard navigation due to motor disabilities or preference.

  • Motion

    Motion

    The use of animation and movement in interfaces to communicate, guide attention, and create engaging experiences. Thoughtful motion provides feedback, shows relationships, and adds personality. Balance motion benefits with accessibility concerns and performance impacts.

  • Parallax

    Motion

    A scrolling effect where background elements move slower than foreground elements, creating an illusion of depth. Parallax adds visual interest and engagement but can impact performance and cause motion sickness. Use parallax sparingly and provide reduced-motion alternatives for accessibility. See Creating parallax with Scroll Speed in Framer.

  • Pointer Events

    Interaction

    A CSS property controlling whether an element responds to mouse and touch interactions, useful for making elements click-through or non-interactive. Disable pointer events for decorative overlays that shouldn’t block underlying interactions. Be cautious—removing pointer events can create accessibility issues.

  • Screen Reader

    Accessibility

    Assistive software that converts on-screen content into speech or braille for people with visual impairments. Good screen-reader support requires htmlsemantic HTML, proper heading structure, and clear labels. Testing with screen readers helps catch accessibility issues early.

  • Scroll Transform

    Framer

    Animation effects tied to scroll position, creating parallax, reveal, and other scroll-driven visual changes. Scroll transforms add interactivity and storytelling potential to long-form content. Balance visual interest with performance and accessibility considerations.

  • 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.

  • Text

    Typography

    Written content displayed on web pages, the primary means of communicating information to visitors. Quality text content is essential for engagement, SEO, and accessibility. Structure text with headings, short paragraphs, and scannable formatting.

  • UX

    Design

    User Experience—the overall experience a person has when using a product, encompassing usability, accessibility, and emotional response. Good UX anticipates user needs and removes obstacles to goal completion. UX extends beyond UI to include performance, content clarity, and trust signals.

  • WCAG

    Accessibility

    Web Content Accessibility Guidelines—international standards defining how to make web content accessible to people with disabilities. WCAG compliance is increasingly required legally and expands your potential audience. Aim for at least WCAG 2.1 AA conformance.

  • Web Accessibility

    Accessibility

    Designing and developing websites usable by people with various disabilities including visual, auditory, motor, and cognitive. Accessibility is both ethically important and often legally required. Build accessibility in from the start rather than retrofitting.

  • Inclusion

    Accessibility

    Inclusion is a design principle focused on creating experiences that are welcoming, usable, and respectful for diverse users and contexts.

  • Agent Review

    AI

    Agent review is the process of checking AI-made changes for accuracy, visual quality, links, accessibility, and consistency before publishing.

    Agent review is important because AI can make fast changes across content and design. A review pass catches duplicate content, broken links, weak metadata, layout issues, or edits that do not match the project’s existing structure.