Glossary

A 301 redirect is a permanent redirect from one URL to another. It tells both users and search engines that the page has moved for good—and passes most of the SEO authority to the new URL. Use it during site migrations, content restructures, or when retiring outdated pages.

A 302 redirect is a temporary redirect that tells browsers and search engines the move isn’t permanent. Unlike 301s, they don't pass full SEO authority.

The “404 Not Found” error signals that the requested page doesn't exist. Broken or misconfigured links resulting in 404s harm UX and SEO if not handled with custom messaging and navigation.

404 Error best practice: create a custom 404 page with helpful links, search functionality, or a CTA to guide users back to your site. This page should not be a dead end!

A/B testing (also known as split testing) is a method of comparing two versions of a webpage, email, or digital asset to see which one performs better. It’s a go-to strategy for improving conversion rates and UX—think testing two different headlines, button colors, or page layouts to see what gets more clicks.

APIs let different tools and platforms talk to each other. In design and dev, this might mean pulling in dynamic content from a CMS or integrating a third-party service like a calendar, CRM, or analytics tool.

ARIA (Accessible Rich Internet Applications) labels help improve accessibility by giving extra context to screen readers. They’re used when standard HTML tags don’t give enough info—like in custom dropdowns or sliders.

"Above the fold" refers to the portion of a webpage visible before you start scrolling, the initial screen view. It’s prime real estate for grabbing attention and communicating your core message quickly.

A recent eye-tracking study from Nielsen Norman Group found that users spend about 57% of their viewing time above the fold, and around 74% within the first two screenfuls, then attention sharply drops off.

Why it matters:

Crucial messaging, headlines, and CTAs should live here. This is where most users focus first.

It impacts bounce rates and conversions. First impressions count!

It’s mobile-first land too; make sure that above-the-fold content adapts well across devices.

That said, people do scroll, just prioritize what’s seen first. For a more in depth look at how to optimize above the fold, read .

Accessibility in web design means building websites that everyone can use—including people with disabilities. This includes visual, auditory, motor, and cognitive impairments. Good accessibility benefits all users (think: clear navigation, readable text, keyboard-friendly forms), but it also ensures your site meets legal standards and performs better in search rankings.

In many regions (including the U.S.), public-facing websites are expected to follow standards like to ensure digital content is perceivable, operable, understandable, and robust. In the U.S., we follow:

The Americans with Disabilities Act (ADA) applies to public-facing websites, especially for businesses and institutions.

Section 508 of the Rehabilitation Act requires federal agencies and contractors to make electronic content accessible.

Accessible design is also SEO-friendly! Search engines love structured, readable content, fast load times, and mobile-friendly layouts.

An accordion is a UI component that expands to show or hide content. Think of it like a drawer—click to open, click again to close. It’s handy for FAQs, mobile menus, or anywhere you need to pack a lot of info into a small space.

refers to artificial intelligence systems that go beyond passive interaction. Instead of waiting for commands, these models take initiative:making decisions, completing tasks, and optimizing outcomes on behalf of users.

This shift impacts both UX and SEO. Interfaces must now serve users and agents, while content needs to be structured for AI interpretation as much as for human readability.

Explore the future of user-agent interaction in Agentic AI and AX: How AI Is Reshaping UX and Marketing.

Alt text (short for “alternative text”) is a written description of an image that helps screen readers explain visuals to users with vision impairments. It also gives search engines more context about your content, so it’s a win for both accessibility and SEO.

Be descriptive: Explain the content and purpose of the image, like “Illustration of a dashboard UI showing user analytics.”

Don’t start with “image of…”: Screen readers already announce it’s an image.

Avoid keyword stuffing: Use natural language that actually describes the image.

Decorative images? Skip it: If an image doesn’t add meaning, use an empty alt="" so it’s ignored by screen readers.

Alt text is essential for accessible design—and it’s often one of the easiest SEO wins on a site.

Analytics tools (like Google Analytics or Hotjar) help you track how people use your site: pageviews, bounce rates, top-performing content, and more. They’re your best friend for making data-informed design decisions.

Anchor links let you jump to a specific section of a page. They're especially helpful for long-scroll pages like glossaries, FAQs, or case studies. You’ll usually see them in table-of-content menus or “back to top” buttons.

An anti-pattern is a common solution to a design or development problem that seems helpful but actually causes more harm than good. It might work in the short term, but leads to poor usability, scalability issues, or technical debt down the line.

Examples include:

Aspect ratio is the width-to-height relationship of a visual element. For example, a square is 1:1 and a standard HD video is 16:9. Keeping aspect ratios consistent is key to responsive design that actually looks good on all screens.

Atomic design is a method of building design systems from the ground up—starting with basic elements (like buttons or inputs), then combining them into larger components (like forms or cards), and finally into full layouts. It’s all about consistency and scalability.

A backlink is a link from another website to yours. Search engines see backlinks as votes of confidence—especially if they’re from reputable, relevant sites. More high-quality backlinks = better domain authority and higher rankings.

Tip: Backlinks from design blogs, awards sites (like Awwwards), or industry features are gold for agencies.

Banner blindness happens when users mentally skip over areas of a page that look like ads—even if they’re not. It’s why CTAs that look like banners often get ignored. Clean, integrated design usually performs better than something flashy and loud.

A baseline grid is a design system where all text aligns to a consistent vertical rhythm—kind of like writing on lined paper. It improves readability, keeps your layout looking intentional, and is especially useful for long-form or editorial-style pages.

This refers to tailoring content or ads based on a user’s past behavior—like pages viewed, buttons clicked, or time spent on site. It’s often used in remarketing campaigns or dynamic content blocks on websites.

Bounce rate is the percentage of users who visit a page and leave without clicking anything else or navigating to another page. A high bounce rate can sometimes indicate a problem—like slow load times, confusing design, or content that doesn’t match user intent.

But context matters:

A blog post might have a high bounce rate and still perform well if users get what they need and leave satisfied.

Landing pages with a single CTA may naturally see fewer pageviews but high conversions.

The goal isn’t always to lower bounce rate—it’s to understand why people are leaving and what action you actually want them to take.

The CSS box model is how every element on a webpage is structured—like a series of boxes wrapped around your content. It includes:

Brand guidelines are your go-to rules for maintaining visual and verbal consistency. They cover everything from logo usage and color palettes to tone of voice and motion styles. At Composite, we often build design systems that double as lightweight brand guidelines.

Breadcrumbs show users where they are in your site structure, like Home > Resources > Blog > Article Title. They're especially useful for content-rich sites and improve both navigation and internal linking for SEO.

Breakpoints define when your design should adapt to different screen sizes. Common ones include mobile (≤768px), tablet (768–1024px), and desktop (1024px+). In Webflow, you can customize styles for each breakpoint to make your site truly responsive.

A broken link leads to a page that no longer exists (hello, 404 error). It’s bad for UX and SEO. Regularly audit your site for broken links, especially after content migrations or redesigns.

Browser compatibility means your site works well across different browsers (like Chrome, Safari, Firefox). Some design features or animations can break in older or less common browsers—always test before launch.

Button states show users what’s happening: default, hover, active, disabled, loading. Clear button states make interfaces feel responsive and trustworthy, especially on forms or e-commerce checkouts.

A CDN is a distributed server system that delivers website assets (like images, CSS, and JS) from locations closer to the user, dramatically improving load times, especially for global visitors.

Sites that score well on Core Web Vitals tend to rank higher and feel smoother to use.

A CMS lets you create, manage, and update content on your website without needing to touch code. Webflow’s CMS is especially flexible. It's great for dynamic content like blogs, team pages, and product libraries.

We often help clients migrate to Webflow’s CMS. Check out how we rebuilt Obligo’s 30+ page site with a content-first approach.

CSS is the code that controls how HTML elements look—colors, fonts, spacing, layout, hover effects, and more. Webflow writes CSS visually, but knowing the basics helps you understand how styling is applied behind the scenes.

Flexbox is another CSS layout system, best for aligning items in one dimension (row or column). It’s super handy for centering content, building nav bars, and making flexible UI layouts without breaking your brain.

CSS Grid is a layout system in CSS that lets you design complex grid structures on the web. It gives you control over rows, columns, spacing, and alignment. Perfect for responsive designs with modular layouts.

Caching stores versions of your site so it loads faster the next time someone visits. It’s great for performance, but if you’ve ever made a design change that isn’t showing up, it’s probably your cache acting up. Clear your cache if you have trouble loading sites or clicking form buttons.

A call to action is what you want users to do, like “Book a demo,” “Download the guide,” or “Start your free trial.” CTAs should be clear, visible, and frictionless. Good ones turn passive visitors into active users.

A <link rel=”canonical” href=”...”> helps prevent duplicate content issues by telling search engines which version of a page is the "main" one. Especially useful for sites with paginated or filter-based URLs.

Card sorting is a user research method where participants organize content into groups that make sense to them. It helps you design navigation and information architecture that actually matches how users think.

A class is a reusable set of styles that you can apply to multiple elements. For example, if you create a .button-primary class, every element with that class will follow the same styling rules. In Webflow, classes are your main way of applying consistent design.

CTR is a percentage that measures how often people click on a specific link—like a CTA or a Google search result. It’s calculated as clicks ÷ impressions × 100. A higher CTR usually means your design or messaging is working well.

In SEO, cloaking refers to showing different content to users vs. search engines—often used for deceptive purposes. It's considered a black-hat technique that can result in search penalties.

Color contrast refers to the difference between text and background colors. High contrast makes text easier to read, especially for users with vision impairments. WCAG recommends a contrast ratio of at least 4.5:1 for body text.

A component library is a collection of reusable UI elements—like buttons, modals, or nav bars—that help keep your design consistent and scalable. Think of it as the building blocks of your design system.

Contentful is a headless CMS used by enterprise teams to manage and deliver content across multiple platforms. It’s API-first and highly customizable, but often requires developer resources to build and maintain frontend experiences. For teams that want visual control and faster publishing, Webflow offers a more design-friendly alternative.

Migrating your site from Contentful to Webflow? Check out our .

This is the journey users take from first landing on your site to completing a goal—like signing up or making a purchase. Each step (awareness, interest, decision, action) is a chance to optimize for better results.

Your conversion rate is the percentage of visitors who complete a desired action. Improving this often means better UX, more persuasive copy, or faster site speed. It’s calculated as actions ÷ visitors × 100.

These are Google’s key performance metrics for user experience:

CLS measures how much things unexpectedly move around on your site as it loads. Ever try to tap a button and it jumps out of the way? That’s a layout shift, and it frustrates users and hurts your Core Web Vitals score.

The DOM is the structured tree of elements that browsers use to render a page. Designers may not touch it directly, but understanding it helps with dev handoff and debugging. Tools like DevTools let you inspect the DOM live.

Dark mode is a UI option that uses light text on a dark background. It’s popular for reducing eye strain and improving battery life on OLED screens. Designing for dark mode means adjusting contrast, shadows, and colors so your interface still looks great when flipped.

A data layer is a structured way to store and pass information (like user behavior or product IDs) to tools like Google Tag Manager or analytics platforms. It helps track events without cluttering your codebase.

Design debt is what builds up when you prioritize speed over scalability, like quick-fix layouts, inconsistent buttons, or missing documentation. It makes future updates harder and leads to messy user experiences unless regularly addressed.

A design sprint is a 5-day process (popularized by Google Ventures) that helps teams prototype and test ideas quickly. It’s a fast way to validate concepts before committing to full builds.

A design system is a collection of reusable components, design tokens, guidelines, and code that keeps your product consistent. Think: buttons, spacing, typography, accessibility rules—all working together across pages, teams, and tools.

Closely tied to Accessibility, this refers specifically to ensuring websites, apps, and digital content are usable by people with disabilities. It includes following standards like WCAG, supporting screen readers, and avoiding motion that can trigger vestibular disorders.

Digital strategy is your master plan for using digital channels to grow your brand or product. It includes content, UX, SEO, performance, and marketing, and it’s the lens we bring to every Composite Global project.

Spotting and avoiding anti-patterns helps you build experiences that are intuitive, accessible, and future-proof.

Domain Authority (DA) is a score (1–100) developed by Moz that predicts how likely your site is to rank in search engines. It’s based on backlinks, content quality, and other SEO factors. Higher DA usually = better visibility. Building DA is a long game, be patient, stay consistent, and trust the results.

A drop shadow is a visual styling effect that gives elements a sense of depth by adding a shadow behind them. In modern design, subtle shadows help distinguish elements (like cards or modals) without feeling too heavy.

Drupal is an open-source content management system known for its flexibility and scalability. It’s commonly used for government and enterprise websites—but its steep learning curve and heavy reliance on developers can slow teams down. Webflow provides a modern, no-code alternative with built-in design tools and CMS features.

Migrating your site from Drupal to Webflow? Check out our .

Dynamic content changes based on user input, data, or CMS updates—like showing personalized messages, location-based offers, or auto-populated blog posts. Webflow’s CMS makes it easy to build and update dynamic pages visually.

An edge case is a scenario that’s uncommon but possible—like a user uploading a 10MB GIF as a profile photo or using a 10-year-old browser. Good UX anticipates edge cases and prevents them from breaking the experience.

In UI design, elevation refers to the visual layering of elements, like shadows or overlays, to show what’s in the foreground vs. background. It helps communicate hierarchy and clickability, especially in material design systems.

This refers to the full journey a user takes: from the first touchpoint (like a social ad) all the way through conversion and follow-up. It’s about designing not just screens, but the whole experience ecosystem.

Engagement rate measures how much users interact with your content: likes, clicks, comments, shares. For websites, it might include time on page or interactions with features. A high engagement rate usually means your design is doing its job. It’s calculated as interactions ÷ viewers × 100.

An error state is what users see when something goes wrong, like a failed form submission or 404 page. Good error design explains what happened, how to fix it, keeps the user from feeling lost, and directs them back to the homepage.

Evergreen content stays relevant over time, like glossary pages or design tutorials. It’s great for SEO and helps build long-term traffic. Unlike trend-based posts, evergreen content keeps delivering value for months (or, hopefully, years).

Exit intent technology tracks mouse movement to detect when a user is about to leave a page, often triggering a popup or special offer. While sometimes effective, it can be intrusive if overused. Once trust is broken, it is hard to rebuild. Use with care.

Experience architecture is the big-picture design of how users interact with your product—across pages, flows, channels, and even time. It combines IA, UX, content, and emotion to guide users toward a goal.

The F-pattern describes how users typically scan a webpage—starting at the top left, then across, then down the left side. It’s common in text-heavy layouts like blogs or documentation. Use it to guide CTA placement and content hierarchy.

A favicon is the tiny icon that appears in a browser tab, bookmark, or search result, usually your logo or symbol. It helps reinforce brand recognition and makes your site look more polished.

Feature creep happens when new features keep getting added to a project, often without a clear plan. It leads to bloated products, scope delays, and confused users. Guard against it with clear goals and a solid MVP.

Figma is a cloud-based design tool used for UI, prototyping, and design systems. It’s collaborative, dev-friendly, and central to most modern design workflows, including ours at Composite.

We explored in our recent article.

FCP is a Core Web Vitals metric that measures how quickly the first piece of content appears on screen. Faster FCP = better perceived performance. It’s often affected by image size, font loading, and JS delays.

Flexbox is a CSS layout tool that helps you align elements in rows or columns. It’s great for building responsive headers, nav bars, and cards. Webflow uses flexbox under the hood—and lets you control it visually.

The fold is the bottom edge of the screen when a page first loads. Anything visible before scrolling is “above the fold” and often gets the most attention. Still, users do scroll—just make sure the first screen pulls them in.

Form UX is the practice of designing forms that are clear, easy to complete, and error-resistant. Good forms use logical groupings, clear labels, helpful microcopy, and smart defaults to reduce friction and boost conversions.

Framer is a web design platform known for its fast publishing workflow and clean visual UI. It's great for prototyping and building static landing pages, but for more complex CMS, animation, or SEO needs, many teams migrate to Webflow.

Migrating your site from Framer to Webflow? Check out our .

Front-end development is the part of web dev that handles what users see and interact with: HTML, CSS, JavaScript. It’s where design and code meet. Webflow is a visual front-end dev platform that outputs clean code without hand-coding.

Functional animation is movement used to support UX, not just decoration. Think hover states, loading spinners, or transitions that explain what's happening. When done right, it makes interfaces feel smoother and more intuitive.

Curious how motion helps engagement? Read our post on .

Gamification is the use of game-like elements—like progress bars, badges, or rewards—in non-game contexts. In UX, it’s a way to boost engagement and make interactions more enjoyable or motivating.

Gated content is content users can only access after providing something like their email address. It’s commonly used for lead generation (think: whitepapers, webinars, resource libraries). The key is to make sure the content is worth the “gate.”

Geo-targeting is the practice of customizing content or features based on a user’s location. It can be used to display local pricing, personalize search results, or direct users to region-specific pages.

Git is a version control system used by developers to track changes to code over time. It helps teams collaborate, revert to earlier versions, and manage updates safely. You might not use Git directly in Webflow, but understanding how version control works is helpful in cross-functional teams.

Global styles are reusable design settings—like typography, color, and spacing—that ensure consistency across your site. In Webflow, these are managed through the Style Manager and style guides. It’s a foundational part of any design system.

A grid system is a layout framework made of rows and columns that helps align content on a page. It’s essential for clean, organized, and responsive design. Tools like CSS Grid and Webflow’s visual grid controls make it easy to build layouts that flex across devices.

The Gutenberg Editor is WordPress’s block-based visual builder. It simplified content editing but can still feel clunky compared to modern no-code tools. Many teams migrate away from WordPress entirely for a smoother design/dev workflow in Webflow.

Migrating your site from WordPress to Webflow? Check out our .

HTML is the code that structures content on the web: headlines, paragraphs, images, links, and more. Every webpage is built on HTML. Tools like Webflow let you work visually, but knowing HTML basics helps with clean structure and SEO.

A hamburger menu is a three-line icon used to toggle a hidden navigation menu—especially on mobile. It helps declutter the interface, but can hide important links if overused. Use it wisely, especially for primary site navigation.

Handoff is the process of transferring a design to developers for implementation. A good handoff includes assets, specs, animations, and interaction notes. In Webflow, many teams skip traditional handoffs by building the production site visually.

A hard bounce happens when an email can’t be delivered because the address doesn’t exist, is blocked, or has a typo. Too many hard bounces hurt your sender reputation and email deliverability.

Header tags are HTML elements that define the hierarchy of your content—like <h1> for main titles, <h2> for subtitles, and so on. They help with both readability and SEO. Every page should have one (and only one) H1.

A heatmap is a visual report that shows where users click, scroll, or hover on your site. It’s great for spotting patterns, identifying weak spots, and optimizing page layout. Tools like Hotjar or Crazy Egg generate them automatically.

The hero section is the first thing users see on a page, usually a big headline, subtext, and a CTA. It sets the tone for the site, tells visitors they’re in the right place, and guides them to the next step.

A hover state is a visual change (like color, underline, or animation) triggered when a user places their mouse over an element. It’s a small but powerful UX cue that something is clickable or interactive.

Iconography refers to the style and use of icons across a product or brand. Good iconography is clear, consistent, and enhances usability, especially when used alongside text, not in place of it.

Inclusive design is the practice of creating digital experiences that work for as many people as possible—regardless of age, ability, language, or tech access. It overlaps with accessibility but focuses more broadly on diversity and equity in user experience.

Infinite scroll loads more content as a user scrolls down the page—common on social feeds and product listings. It can keep users engaged but may harm SEO and frustrate those looking for a footer or pagination.

Information architecture is how content is organized and labeled across a site. A good IA helps users find what they need without thinking too hard. It’s often mapped out through sitemaps, navigation structures, and user flows.