Development Glossary

Here you can find important tech terms and definitions, explained in a simple and clear way.

Native App

A Native App is a software application built using the specific programming languages and tools dedicated to a single platform or operating system (such as Swift or Objective-C for Apple iOS, and Kotlin or Java for Android). Because they are written specifically for that ecosystem, native apps are installed directly onto the device (via the App Store or Google Play) rather than being accessed through a web browser.

Technical Debt

Technical Debt is a concept in software and web development that describes the implied cost of future reworking caused by choosing an easy, fast, or "hacky" solution now, instead of taking the time to build a better, scalable approach. Just like financial debt, technical debt accrues "interest"—the longer you leave bad code in place, the harder and more expensive it becomes to fix or build new features on top of it.

Tailwind CSS

Tailwind CSS is a highly popular, "utility-first" CSS framework. Instead of creating pre-designed, rigid components (like a standard "Bootstrap button"), Tailwind provides developers with hundreds of low-level utility classes (like text-center, mt-4 for margin-top, or bg-blue-500). Developers combine these tiny utility classes directly within their HTML to rapidly build completely custom designs without ever writing custom CSS files from scratch.

Syntax

In computer science, Syntax refers to the strict set of rules, structure, and spelling that dictates how symbols and words must be combined to form a correctly functioning line of code. Just as human languages have grammar rules (subject-verb agreement, punctuation), programming languages (like HTML, CSS, JavaScript, and Python) have syntax. If a developer misses a single bracket or semicolon, it results in a "syntax error" and the code breaks.

Static Site Generator (SSG)

A Static Site Generator (SSG) is a software tool (like Gatsby, Next.js, or Hugo) that takes raw data, markdown files, and templates, and pre-compiles them into a complete directory of static HTML, CSS, and JavaScript files. Unlike a traditional database-driven CMS (like WordPress) which builds the webpage from scratch every single time a user requests it, an SSG generates all the pages in advance.

Node.js

Node.js is an open-source, cross-platform runtime environment that allows developers to execute JavaScript code on the server (the backend), rather than just in the user's web browser (the frontend). Built on Google Chrome's V8 JavaScript engine, it is designed to build highly scalable, fast, and data-intensive network applications.

Media Queries

A Media Query is a fundamental CSS technique used to apply different styling rules to a webpage based on the user's device characteristics, most commonly the browser viewport width.

Inline-Block

In CSS, display: inline-block is a layout property that combines the behaviors of both "inline" and "block" elements. Like an inline element (such as a standard text link), it allows the element to sit side-by-side with other elements on the same horizontal line. However, like a block element (such as a <div>), it allows developers to explicitly set its width, height, top margin, and bottom padding.

Iframe (Inline Frame)

An Iframe (Inline Frame) is an HTML document embedded inside another HTML document on a website. It essentially cuts a "window" into your webpage, allowing you to display content hosted on a completely different server without sending the user away from your site. Common uses include embedding YouTube videos, Google Maps, or third-party scheduling widgets.

Full-Stack

Full-Stack refers to the entire depth of a computer system application. A "Full-Stack Developer" or agency possesses the skills to work on both the "Frontend" (the user-facing interface built with HTML, CSS, JS) and the "Backend" (the server, database, and application logic that powers the software behind the scenes).

Flexbox (Flexible Box Layout)

Flexbox (Flexible Box Layout) is a fundamental CSS layout module designed to provide a highly efficient way to lay out, align, and distribute space among items in a container, even when their exact size is unknown or dynamic. Unlike older layout methods that relied on clunky floats and rigid margins, Flexbox is fluid by nature.

Finsweet Attributes

Finsweet Attributes (often referred to simply as "Attributes") is a powerful, industry-standard suite of low-code solutions created specifically for Webflow by the agency Finsweet. By simply adding specific custom attributes (like fs-cmsfilter-element="list") to Webflow elements, developers can unlock highly advanced functionalities that normally require complex, custom JavaScript.

Embed Code

An Embed Code is a small block of HTML or JavaScript provided by a third-party application that allows you to integrate that application's functionality directly into your own website. By pasting this snippet into a custom code block, the external content (like a video, calendar, or form) renders seamlessly on your page as if it were natively built there.

Elastic Beaming

Elastic Beaming is an advanced, highly sophisticated front-end development technique where an entire website layout—including typography, spacing, and image dimensions—scales proportionally fluidly based on the user's viewport width. Instead of using static pixel sizes, it relies heavily on relative units like vw (viewport width), em, and rem.

Z-Pattern Layout

A Z-Pattern Layout is a web page layout that guides users' eyes in a Z-shape: starting at the top-left, moving horizontally to the top-right, then diagonally to the bottom-left, and finally horizontally to the bottom-right. This layout follows natural eye movement patterns and is effective for guiding user attention.

Wized

Wized is an advanced low-code platform that acts as a logic and authentication layer for Webflow. It allows developers to transform a static Webflow marketing site into a fully functional, data-driven Web Application. By connecting Webflow's frontend directly to external databases (like Xano, Supabase, or Airtable) and REST APIs, Wized enables user login portals, gated dashboards, and complex data manipulation.

Webflow CMS

The Webflow CMS (Content Management System) is a powerful, visual database integrated directly into the Webflow development platform. Unlike traditional CMS platforms (like WordPress) which force content into rigid, pre-defined templates, the Webflow CMS allows developers to design completely custom data structures (Collections) and visually bind that data to any bespoke frontend design.

Wireframe

A Wireframe is a low-fidelity layout sketch that shows the structure and content organization of a webpage or application screen. Wireframes focus on content hierarchy and user flow without visual design details like colors, fonts, or images.

Widget

A Widget is a reusable UI component that provides specific functionality. Examples include: date pickers, dropdown menus, modal dialogs, sliders, and carousels. Widgets are building blocks for user interfaces, enabling faster development and consistent design.

Webpack

Webpack is a highly popular, open-source "module bundler" used in modern JavaScript applications. When developers build complex web applications, they write hundreds of separate, organized files for JavaScript, CSS, and images. Webpack takes all of these separate files, processes them, and "bundles" them together into a few highly optimized, minified files that the web browser can load efficiently.

Web Application (Web App)

A Web Application (Web App) is a piece of interactive software accessed through a web browser. Unlike a traditional "website" (which is primarily designed to display static information or marketing content), a web application is highly interactive, allowing users to manipulate data, create profiles, conduct secure transactions, and utilize complex tools (e.g., Salesforce, Google Docs, or a proprietary SaaS dashboard).

Web Accessibility Initiative (WAI)

The Web Accessibility Initiative (WAI) is an effort brought together by the World Wide Web Consortium (W3C)—the main international standards organization for the internet. The WAI's sole mission is to improve the accessibility of the web for people with disabilities. They are the governing body responsible for researching, developing, and publishing the universal standards and guidelines that make digital inclusivity possible.

Viewport

A Viewport is the visible area of a webpage or application on a user's device. The viewport dimensions change depending on the device: a desktop browser might have a 1920px wide viewport, while a smartphone might have a 375px wide viewport. Responsive web design uses the viewport to adapt layouts for different screen sizes.

Usability Testing

Usability Testing is a research method where real users are observed using a product or website while completing specific tasks. Researchers note where users struggle, what confuses them, and what delights them. This qualitative feedback reveals UX problems that metrics alone cannot show.

User Experience (UX)

User Experience (UX) encompasses all aspects of how a user interacts with a product or website, including usability, accessibility, aesthetics, and emotional response. Good UX makes products easy to use, enjoyable, and effective at achieving user goals.

Typeface (Font Family)

A Typeface (also called a Font Family) is a set of characters (letters, numbers, symbols) designed with a consistent visual style. Examples include Arial, Helvetica, Times New Roman, and Georgia. A typeface family typically includes variations like bold, italic, and different weights.

Text Overlay

A Text Overlay is text displayed on top of a background image or video. Text overlays are commonly used in banner images, hero sections, and marketing videos to convey messages without requiring users to read separate text blocks.

Sticky Navigation

Sticky Navigation (also called fixed navigation) is a navigation menu that remains visible and fixed at the top of the screen as a user scrolls down a webpage. Sticky navigation improves user experience by keeping important navigation links constantly accessible, reducing the need for users to scroll back to the top.

Stock Photography

Stock Photography refers to images from licensed libraries (like Unsplash, Pexels, Shutterstock, Getty Images) that can be used on websites, marketing materials, and publications. Stock photos provide affordable, professional-quality imagery without requiring expensive photoshoots.

Source Code

Source Code is the fundamental, underlying set of human-readable instructions and statements written by a programmer using a specific programming language (like HTML, CSS, JavaScript, or Python). It is the raw structural DNA of a website or application before it is translated (compiled) by a web browser or server into the visual, interactive interface that the user actually sees.

Semantic HTML

Semantic HTML is the practice of using HTML markup tags that clearly convey the meaning and structure of the content they contain, rather than just dictating how it should look visually. For example, instead of using a generic <div> (which has no meaning) for everything, a semantic developer uses <header>, <nav>, <article>, <aside>, and <footer> to explicitly describe the role of each section on the page.

Sandbox (Testing Environment)

A Sandbox is an isolated, safe testing environment that perfectly replicates a live software application or website, but is completely disconnected from the actual production database. It allows developers, QA testers, or potential clients to execute code, test API integrations, or explore software features without any risk of breaking the live site, altering real customer data, or triggering actual financial transactions.

Robots.txt

A robots.txt file is a simple text file placed in the root directory of a website. It acts as the "doorman" for search engine crawlers (like Googlebot). Using a standard protocol, it tells these automated bots exactly which pages, folders, or directories they are allowed to crawl and Index, and which ones they are strictly forbidden from entering.

REM Units (Root Em)

A REM (Root Em) is a relative CSS measurement unit used to define typography size, padding, and margins. Unlike static "Pixels" (px) which represent an absolute dot on a screen, 1 REM is equal to the font size of the root HTML element of the webpage (which is overwhelmingly defaulted to 16px by modern browsers). Therefore, 2rem equals 32px, 0.5rem equals 8px, and so on.

React.js

React.js (often just called React) is a highly popular, open-source JavaScript library developed by Meta (Facebook) used for building dynamic, interactive user interfaces. It utilizes a "component-based" architecture, meaning developers build small, isolated pieces of UI (like a button or a search bar) and then combine them to create complex, fast-loading Single Page Applications (SPAs).

Prototype

A Prototype is a preliminary version of a product, website, or feature built to test concepts, gather feedback, and validate assumptions before investing in full development. Prototypes can range from low-fidelity (sketches, wireframes) to high-fidelity (interactive mockups that closely resemble the final product).

Positioning (CSS)

Positioning is a fundamental set of CSS properties (static, relative, absolute, fixed, and sticky) that define exactly how an HTML element is placed and manipulated within the browser's document flow. It allows developers to break elements out of the standard top-to-bottom layout, enabling complex, overlapping, and interactive user interfaces.

Global Styles

Global Styles are a centralized set of foundational CSS rules that dictate the default appearance of all standard HTML elements across an entire website. Instead of styling every single paragraph or button individually, developers define the rules for typography, color variables, spacing, and link behaviors in one master location.

Git (Version Control)

Git is the world's most popular distributed version control system, used by developers to track changes in source code over time. It allows multiple team members to work on the same project simultaneously without overwriting each other's work. If a mistake is made or a bug is introduced, Git allows developers to safely "roll back" the codebase to a previous, stable version.

Form Validation

Form Validation is the process of automatically checking user input (in real-time or upon submission) to ensure it meets required criteria before processing. Validation rules can check for required fields, email format, password strength, character limits, and custom business logic.

Document Object Model (DOM)

The Document Object Model (DOM) is a programming interface for web documents. When a web browser loads an HTML document, it creates a structural representation of that document as a "tree" of objects and nodes. This DOM tree dictates how the page is structured and allows programming languages (like JavaScript) to dynamically read, access, and manipulate the content, style, and structure of the site.

Custom Code

In the context of platforms like Webflow, Custom Code refers to any HTML, CSS, or JavaScript that a developer writes manually to inject functionality or styling that goes beyond the native capabilities of the visual editor. This code can be added at the site level, the page level, or embedded directly within specific components.

Authentication

Authentication is the critical security process of verifying the identity of a user, device, or system before granting access to protected resources, dashboards, or gated content. In the context of web applications and SaaS platforms, it is the mechanism that ensures the person attempting to log in is actually who they claim to be, typically utilizing credentials like passwords, biometric data, or security tokens.

ARIA Attributes

ARIA (Accessible Rich Internet Applications) attributes are specialized HTML codes added to a website's markup to make web content and web applications more accessible to people with disabilities.

Anchor Link

An Anchor Link is a type of hyperlink that, when clicked, immediately scrolls the user to a specific section on the same webpage, rather than taking them to a completely different URL. It is created by assigning a unique ID to a page section and linking to that ID (e.g., #pricing-section).

Agile Methodology

Agile Methodology is a project management and product development approach that prioritizes flexibility, collaboration, and customer feedback. Instead of delivering a project all at once at the very end, work is broken down into small, manageable increments called "sprints."

Absolute Positioning

Absolute Positioning is a CSS (Cascading Style Sheets) rule that allows developers to place an element exactly where they want it, relative to its closest positioned ancestor. Unlike static or relative elements, an absolutely positioned element is removed from the normal document flow.

Webflow

Webflow is an all-in-one Software as a Service (SaaS) platform that functions as a visual development tool, a CMS (Content Management System), and a hosting service. It empowers designers to build, style, and launch websites that generate high-quality HTML, CSS, and JavaScript.

Z-Index (CSS Property)

The Z-Index controls the depth position of elements on the z-axis (the axis coming out of the screen). Elements with a higher Z-Index value appear on top of elements with lower values.

XML (Extensible Markup Language)

XML is a foundational technical language, similar to HTML, but unlike HTML (which defines content structure for display), XML defines data structure for storage and transfer.

Workflow

A Workflow defines the repeatable process for any business activity, from the internal steps a developer takes to build a feature to the automated sequence that routes a new lead. In web development, key workflows include: development, marketing, and content.

Version Control

Version Control (most commonly using a tool like Git) is a foundational practice in professional development. It allows multiple developers to work on the same project simultaneously without overwriting each other's work.

Template

A Template is the structured design blueprint for a category of pages, ensuring consistency across a large volume of content. In Webflow, the CMS (Content Management System) uses templates to display every blog post, case study, or team member profile.

Section

A Section is the large container that divides a webpage into digestible parts, such as the Hero Section, a "Features" section, or a "Testimonials" section.

Quality Assurance (QA)

Quality Assurance is a comprehensive process that spans the entire Revamp and development cycle, ensuring high-quality standards are met. It involves: testing, technical checks, and aesthetic review.

Reusable Components

Reusable Components are the building blocks of Modular Design and the coded realization of a Component Library. They are built once and then dropped onto any number of pages or templates across the site.

Responsive Design

Responsive Design ensures a single codebase adapts fluidly to all Viewports, from large desktop monitors to small smartphones. It is achieved through flexible Layout Grids, fluid images (Object Fit), and CSS (Cascading Style Sheets) media queries that apply specific styles based on screen size.

Render Blocking

Render Blocking code is a major cause of slow Page Speed and a poor Lighthouse Score. When a browser encounters a large, external JavaScript or CSS file, it stops rendering the page until that file is downloaded and executed.

Reflow

Reflow is a heavy computational task that slows down a web page's rendering speed and causes Jitter in Animation or scrolling. It is triggered by changes to element dimensions, content, or specific CSS properties.

Progressive Web App (PWA)

A PWA is built using standard web technologies (HTML, CSS, JavaScript) but offers features traditionally reserved for native mobile apps: offline functionality, and performance.

Pixel Perfect

Pixel Perfect is a term used to define the highest quality standard for Frontend Development. It confirms the coded Webflow site adheres precisely to the original Figma Mockup or High-Fidelity Prototype in terms of: spacing, tyography, and aligne

Object Fit

Object Fit is a critical CSS property for Responsive Design. It addresses the common problem of images being either stretched, distorted, or cropped incorrectly within a fixed container size. The most common values are: cover, contain, and fill.

No-Code Development

No-Code Development utilizes platforms like Webflow to empower designers and subject matter experts to build highly custom, production-ready digital products. These platforms manage the underlying HTML, CSS, and JavaScript automatically.

Naming Convention

A Naming Convention provides a structure and vocabulary for the entire development project. Using a recognized system (like BEM or a custom client-specific standard) for naming CSS (Cascading Style Sheets) classes is vital.

Modular Design

Modular Design is the application of the Component Library and Atomic Design principles to the entire website structure. Instead of building pages from scratch, developers build them by snapping together pre-designed and pre-coded modules (Sections, components, and organisms).

Mobile Responsiveness

Mobile Responsiveness is essential for all modern websites, as a majority of traffic often comes from mobile devices. It is achieved primarily through flexible CSS (Cascading Style Sheets) and the use of a fluid Layout Grid.

Jitter (in animation)

Jitter is the visual symptom of the browser struggling to render visual changes at a consistent frame rate (ideally 60 frames per second). It's caused when the JavaScript or CSS used for Animation is computationally expensive or forces the browser to frequently recalculate the layout (known as Reflow or layout thrashing).

JavaScript

JavaScript is one of the three core web languages (along with HTML and CSS). It is primarily executed on the client-side (the user's browser) and handles everything related to interactivity.

JSON (JavaScript Object Notation)

JSON is the most common format for data exchange on the web today. It is based on a simple "key: value" pair structure, making it easy for both humans to read and machines to parse.

Iteration

Iteration is the principle of continuous improvement, moving away from a single, static product launch toward an ongoing cycle of refinement. It is the engine behind Conversion Rate Optimization (CRO) and Growth-Focused Strategies.

Integration

Integration is the fundamental act of making disparate software tools work together. For B2B/SaaS, this means connecting the Webflow marketing site to the rest of the business ecosystem: CRM, analytics, and marketing.

HTML (Hypertext Markup Language)

HTML is the foundational structure of every website. It is not a programming language, but a markup language that uses tags to structure the content and provide meaning (semantics).

Frontend Development

Frontend Development is the practice of converting data and design concepts into a graphical interface that users can view and interact with on the web. It involves writing the code—primarily HTML (structure), CSS (styling), and JavaScript (behavior)—that dictates everything a user sees, clicks, and experiences in their browser.

Framework

A Framework offers a foundation upon which to build, defining the rules and structure, unlike a simple library (which only offers components). They promote efficiency, consistency, and adherence to best practices.

Ecommerce

Ecommerce refers to all online transactions. While Flowtrix primarily serves B2B and SaaS clients focused on Lead Generation, we provide solutions for companies selling services or products online

Dynamic Content

Dynamic Content refers to text, images, or layouts on a webpage that change automatically based on data drawn from a database, user behavior, location, or time. Unlike "static content" (which is hard-coded into the page and looks exactly the same for everyone), dynamic content updates in real-time to provide a customized or scalable experience.

Design System

A Design System is more than a simple Style Guide; it is the single source of truth for the entire interface. It is typically housed in Figma (design files) and implemented in Webflow (code structure). It defines rules for: brand identity and component library.

Deployment

Deployment is the technical procedure that pushes the final, tested code from the development environment to the live production environment. It includes several non-negotiable steps.

Component Library

A Component Library is the heart of a Design System, containing all the modular parts used to construct the interface. These components are fully defined in Figma (design specs) and built as Reusable Components in Webflow (coded elements).

CSS (Cascading Style Sheets)

CSS is one of the three core technologies of the World Wide Web, alongside HTML and JavaScript. It controls the visual appearance of all website elements, including: color theory, typograpy, and animation.

CMS (Content Management System)

A CMS is the foundational tool that allows non-developers (like marketing or editorial teams) to update website content, such as blog posts, case studies, team member profiles, and product features. The Webflow CMS is highly flexible, functioning as a structured database that separates the content from the design.

Browser Compatibility

Browser Compatibility is a key concern during the Quality Assurance (QA) and Testing phase of web development. Even with modern platforms like Webflow generating clean code, subtle differences in how each browser interprets CSS (Cascading Style Sheets) or JavaScript can cause visual or functional issues.

Backend

The Backend is the technical foundation that powers the website's functionality. It includes the server, the database (where data is stored), and the application logic that processes requests. While Webflow handles much of the complexity, integrating external services or custom web applications (like user authentication or complex database querying) requires custom Backend solutions.

Atomic Design

Coined by Brad Frost, this methodology uses the metaphor of chemistry to organize a Design System into hierarchical components: Atoms, Molecules, Organisms, Templates, and Pages.

Asset Optimization

This technical process ensures that a website's media files (Assets) are as small as possible without sacrificing visual quality, leading to faster loading times. Techniques include: Image compression, lazy loading, and minification.

API (Application Programming Interface)

An API acts as a middleman, defining the methods and data formats that different programs can use to request and exchange information. When your website needs to talk to a separate service (like your CRM, a payment gateway, or a third-party analytics tool), it uses an API.