Who this is for
If an agency or freelancer has just handed you a Webflow site, you will meet a vocabulary that sounds familiar but behaves in specific ways. The costliest mistakes are not technical: editing a class and restyling the whole site, unlinking a component and losing its link to the rest, or paying for the wrong plan. Each term below has a one-line reason it matters and the mistake beginners usually make.
Definitions come from Webflow Help Center articles and Webflow's pricing page, read on 30 October 2026. We have not edited a client site for this guide; the mistakes listed are the ones Webflow's own documentation warns about.
Plans and roles
| Term | What it means | Why it matters | Common beginner mistake |
|---|---|---|---|
| Site plan | A per-site subscription that lets one site publish to a custom domain. | Without it the site only lives on its webflow.io address. | Buying a Workspace plan and expecting the domain to connect. |
| Workspace plan | An account-level plan covering all sites in the workspace: staging, collaboration, code export. | Agencies need it; a single site owner often does not. | Paying for one when you only own one site and edit copy. |
| Starter | The free tier: webflow.io domain, 2 static pages, 50 CMS items, 1 GB bandwidth, 50 form submissions. | Each Starter Workspace includes 2 free Starter sites. | Treating it as a launch plan. |
| Basic and Premium | Paid Site plans; on 30 October 2026, $15 and $25 a month billed yearly. Premium lists Webflow CMS. | If your site has a blog, you are on a CMS-capable plan. | Downgrading a blog site to Basic to save money. |
| Content editor role | A role that edits copy, images, CMS items and SEO fields but not the design. | Lets clients update the site without breaking layouts. | Asking for full designer access when you only change text. |
| Team members | People invited to a workspace. | Webflow says buying seats for them does not require upgrading from the Starter Workspace; the seats themselves are paid. | Upgrading the workspace just to add one colleague. |
Styling: classes, combo classes and breakpoints
Webflow creates a class the moment you style an element, and any change to that class affects every element using it. That is the biggest difference between Webflow and a page builder where you style one box at a time. Webflow recommends function-based class names such as form-button rather than blue-button, and it notes class names are case-insensitive and must start with a letter.
| Term | What it means | Why it matters | Common beginner mistake |
|---|---|---|---|
| Class | A named set of styles applied to as many elements as you like. | Change it once and the whole site updates. | Restyling one button and accidentally changing them all. |
| Base class | The first class on an element; combo classes inherit from it. | Base class edits reach every element using it, including those with combo classes. | Editing the base when you meant only the variation. |
| Combo class | A class added after the base class to make one variation. | Lets one card look different without a new class. | Stacking several combo classes; Webflow recommends no more than one. |
| Global class | A shared style, such as a shadow, built on a style guide page and combined with other classes. | Keeps repeated details consistent. | Recreating the same shadow on many elements by hand. |
| Duplicated class | A copy disconnected from the original. | Later edits to the original do not reach it. | Duplicating instead of using a combo class, then wondering why updates miss it. |
| Breakpoints | Screen widths where styles can change: tablet 991px and below, mobile landscape 767px, mobile portrait 479px, plus optional 1280, 1440 and 1920px. | Styles cascade down from desktop and up to larger breakpoints. | Editing on tablet and expecting desktop to change; only smaller breakpoints follow. |
| Hidden (display: none) | Hiding an element at a breakpoint. | Hidden elements still ship in the published HTML. | Using it to delete content you no longer want. |
Components
| Term | What it means | Why it matters | Common beginner mistake |
|---|---|---|---|
| Component | A reusable block of elements, styles and interactions, such as a navbar. | One change updates every page that uses it. | Copying sections by hand instead. |
| Main component | The definition that holds the structure and styles. | Structure and styles can only be edited here. | Trying to restructure an instance. |
| Instance | A placed copy linked to the main component. | Edits inside an instance affect only that instance. | Editing one instance and expecting the rest to change. |
| Props | Settings exposed on a component so each instance can have its own value, such as button text. | Safe customization without touching the design. | Asking a designer to unlink when a prop would do. |
| Slots | Placeholders inside a component where other components can go. | Flexible layouts without new components. | Not realising a slot exists and adding elements outside it. |
| Unlink | Breaking an instance from its main component. | Props become static settings, variants become styles, slots become plain elements. | Unlinking the original; Webflow suggests duplicating the instance and unlinking the copy. |
Interactions
Interactions are Webflow's animations. Interactions with GSAP is the current default; Webflow says it is the only version that will be forwards compatible with new features. Classic interactions still exist for things GSAP does not cover yet, such as navbar, dropdown, tab and slider change events, page branching, and interactions on non-primary locales. Each system loads its own resources, and Webflow ranks using both on one site as the worst option for performance.
| Term | What it means | Why it matters | Common beginner mistake |
|---|---|---|---|
| Interactions with GSAP | The default system using a trigger, target and action model with a timeline. | Supports stagger, split text, scroll triggers and reduced-motion preferences. | Building new animations in Classic out of habit. |
| Classic interactions | The older page and element trigger system. | Still needed for some events listed above. | Mixing both systems on one page without need. |
| Trigger | What starts an animation: a click, hover, scroll or page load. | Determines when visitors see it. | Ignoring motion settings; only GSAP interactions support reduced-motion preferences. |
CMS and publishing
| Term | What it means | Why it matters | Common beginner mistake |
|---|---|---|---|
| Collection | A content type, like a database table, such as blog posts. | The CMS plan limits how many you can have. | Creating a new Collection for what should be a field. |
| Item | One record in a Collection. | Items can be staged (draft, not live) or live. | Editing an item and forgetting to publish it. |
| Reference field | A field that links to an item in another Collection, such as an author. | CSV imports match a reference by the item's name, or by its slug if it has a custom one. | Importing posts before their authors exist. |
| CSV import and export | Bulk moving items as a spreadsheet; files up to 4 MB. | Exported images are Webflow-hosted URLs; imported images get no responsive variants. | Deleting the old site and breaking image links in exported content. |
| Collection list | An element that shows items from a Collection on a page. | Renders every item from one template instead of hand-built cards. | Hand-building a list that should update automatically. |
| Staging subdomain | The yoursite.webflow.io address used for testing and approval. | You can publish only there before going live. | Choosing a subdomain starting with "ad"; Webflow warns ad blockers may block it. |
| 301 redirects | Permanent forwards from old paths, set in Site settings under Publishing. | Need a paid Site or Workspace plan; run in the order added; about 1,000 recommended. | Putting a broad wildcard first so it catches everything. |
| SSL | The https certificate. | Renews automatically while DNS points to Webflow. | Moving DNS away and expecting the certificate to keep renewing. |
| Code export | Downloading HTML, CSS, JS and images. | Needs a paid Workspace plan; leaves out CMS items, forms and search. | Treating it as a full backup. |
First-week checklist for a new Webflow editor
- Confirm which Site plan the site is on and when it renews.
- Ask for the content editor role if you only change copy, images and posts.
- Find the style guide page, if any, and the list of global classes.
- Before styling anything, check whether the selected element shares a class with others.
- Edit headers, footers and buttons on the main component, not on one instance.
- Publish to the webflow.io staging address first and review tablet and phone widths.
- Export each CMS Collection to CSV once a quarter as a content backup.
Questions before you decide
What is the difference between a class and a combo class in Webflow?
A class is a reusable set of styles, and changing it changes every element that uses it. A combo class is added on top of a base class to create a variation for specific elements. Webflow recommends no more than one combo class per element.
Why did changing one button change every button?
Because the buttons share a class or are instances of one main component. Webflow applies class edits to every element with that class and main component edits to every instance. Use a combo class or a component prop for one-off changes.
Do I need a Workspace plan to edit my own Webflow site?
Usually not. Webflow says a paid Site plan is what publishes a site to a custom domain, and adding team members does not require upgrading from the free Starter Workspace. Workspace plans add staging, collaboration and code export.
Sources & verification
Product details and prices can change. Check the linked provider before buying.
- Webflow Help: Classes Accessed 30 Oct 2026
- Webflow Help: Breakpoints overview Accessed 30 Oct 2026
- Webflow Help: Components overview Accessed 30 Oct 2026
- Webflow Help: Interactions with GSAP vs Classic Interactions Accessed 30 Oct 2026
- Webflow Help: Workspace and Site plans overview Accessed 30 Oct 2026
- Webflow Help: Edit site content as a content editor Accessed 30 Oct 2026
- Webflow Help: How do I import content into the Webflow CMS Accessed 30 Oct 2026
- Webflow Help: Webflow staging subdomain Accessed 30 Oct 2026
- Webflow Help: How do I set up redirects in Webflow Accessed 30 Oct 2026
- Webflow Help: SSL hosting Accessed 30 Oct 2026
- Webflow Help: How do I export my Webflow site code Accessed 30 Oct 2026
- Webflow Developers: Working with the CMS Accessed 30 Oct 2026
- Webflow pricing Accessed 30 Oct 2026
Sources link directly to providers. Product buttons may use separately labeled affiliate links. Read our disclosure.
