University
Home
Search
⌘E
Dashboard
Try Webflow — it's free
Learn
Courses
Docs
Videos
Interactive Learning
Glossary
Certifications
Engage
Support
Community
Events
Forum
Accessibility
Switch to Light mode
Switch to Dark mode
High contrast
Glossary
Resolution

Resolution

Resolution is a metric measuring clarity and detail through the number of pixels displayed on a screen or used to render an image. Pixels are arranged horizontally and vertically in a grid, with resolution typically measured in width and height. For example, a 1,920 x 1,080 screen resolution houses 1,920 horizontal and 1,080 vertical pixels, resulting in 2,073,600 total pixels. Similarly, an image resolution of 1,024 x 768 has 786,432 pixels. The more pixels a screen has, the higher its resolution, with the total number of pixels determining the screen resolution.

However, screen resolution and screen size are distinct concepts. Size refers to a display’s size from corner to corner, such as 6", 10", 17", and so on. For example, an Apple iPhone 14 has a 6.1" display with a screen resolution of 2,532 x 1,170. Since different devices have varying screen sizes and resolutions, both are essential considerations in responsive design. 

Visit Webflow University to learn more about how image resolution and breakpoints contribute to responsive design.

Relevant courses

Figma to Webflow

Learn the entire design process from idea to final output as we take you through Figma, Cinema 4D and Octane, and Webflow.

Web animations with After Effects & Lottie

Create animations in Adobe After Effects — the industry standard for motion graphics. Embed and animate them in your Webflow site.

Webflow Ecommerce

Learn how to build and design your Webflow Ecommerce store. Customize every detail and launch a fully functional online store — without writing code.

Ultimate web design course

From the fundamentals to advanced topics — learn how to build sites in Webflow and become the designer you always wanted to be.

Accessibility on the web

Learn about accessibility on the web and how to create inclusive and accessible sites without writing code.

SEO fundamentals

An overview of search engine optimization (SEO) fundamentals and best practices — learn how to optimize your content from the start.

Other glossary terms

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

CRUD

→
CRUD stands for Create, Read, Update, and Delete — the four basic operations all software applications should perform.

Google site verification meta tag

→
Adding a Google site verification meta tag to your website's HTML code allows Google to verify that you own the site.

Form button

→
A form element that lets website visitors submit data to your form handler.

Element breadcrumbs

→
A navigational aid that displays in the bottom of the Webflow Designer to help you keep track of the element you're interacting with in relation to its hierarchy.

Python

→
Python is a high-level, object-oriented, general-purpose programming language (GPL).

Selector

→
A selector identifies and selects specific HTML elements to apply CSS styles to.

Field label

→
A field label is descriptive text that helps users understand what information to enter in an input field on a web form.

Button

→
A button is an interactive element that facilitates user actions.

Dropdown

→
A dropdown, or dropdown menu, is a pre-built navigation element you can add to almost any part of a website.

Required field

→
You can set any Collection field as "Required," which means that a value must be added to that field in the Collection item before it can be published. The only Collection field that cannot be made required is the Switch field.

Public site

→
A Webflow site that is publicly visible in your public profile and in Made in Webflow search results.

Total Site Pages

→
The amount of pages your site currently has.

Backup

→
A backup is a copy of data stored in an alternate location, including hard drives, cloud servers, or network-attached storage (NAS) servers.

Compile

→
Compiling is the process of converting code from a high-level programming language into a low-level language that computers can understand.

Mobile (landscape) breakpoint

→
A Webflow canvas setting that lets you create styles for viewports with a minimum width of 480px and a maximum width of 767px. Also known as the mobile landscape media query.

Save as Backup

→
The ability to manually save a version of your site that you can restore at a later date using the keyboard shortcut Command + Shift + S (on Mac) or Control + Shift + S (on Windows).‍

Container

→
An element that contains content.

Display: inline

→
The display: inline CSS property is a display option that controls an element’s appearance and layout.

Ciphertext

→
Ciphertext is unreadable, encrypted data that ciphers use for security during data transit.

Robots.txt

→
A robots.txt file instructs search engine crawlers which webpages and sections they can or can't crawl and index.

Alt text

→
Alt text, short for alternative text, refers to text that describes online images.

Maximum width (max width)

→
The “max-width” CSS property defines an element’s maximum width.

Form submission

→
When someone sends data through one of your site's forms.

Inheritance

→
Inheritance describes a principle where child elements adopt the style properties of parent elements.

Percent

→
A measurement unit relative to an element's parent.

CMS Collection page

→
A dynamic page that Webflow automatically creates for each Collection item. When you design a Collection page, all the pages that are created for each Collection item will have the same template but different content.

Collection list

→
A Collection list is a Webflow element that lets you dynamically display content from a CMS Collection.

Profile settings

→
The area where you can manage your profile, email settings, and security settings.

URI

→
A Uniform Resource Identifier (URI) is a string of characters identifying an online resource.

Cryptanalysis

→
Cryptanalysis examines cryptographic systems to find weaknesses that could allow attackers to uncover plaintext or break encryption.

Flex-sizing

→
A flexbox property that determines the resizing behavior of flex children across viewport sizes. They can shrink, grow, or remain static.

Child

→
A child element is an element nested within a parent element in a hierarchy.

Design mode

→
The mode that enables a designer to build in Webflow.

Desktop breakpoint

→
A breakpoint, or media query, is the width at which a website’s design and layout adjust to fit screens of different sizes. When designing in Webflow, breakpoints for smaller devices inherit styles from the base — or desktop — breakpoint by default.

Link block

→
A link block operates much like a div block, an HTML element for grouping and organizing other HTML elements (like text, images, and forms) into block-level containers. But in the case of a link block, what’s inside the block becomes a link.

Flex-shrink

→
The flex-shrink CSS property defines how much an element shrinks relative to other flexible items inside the same parent element.

UI state

→
The UI state changes how Collection lists display when you’re designing. The Items state is the default option, and shows the items that you have within the Collection. The Empty state doesn’t show these items and gives the designer the opportunity to design for a circumstance if/when there is no data to be displayed in the Collection list.

Domain

→
A domain, or domain name, is the unique address that directs to a website on the internet.

Inline style

→
Inline style applies CSS to an individual HTML element using the "style" attribute within the HTML tag.

Embed component

→
A Webflow component you can use to embed HTML to display external content, plugins, or applications.

Columns

→
Columns let you create sections of content that sit side by side on your website, like the columns in newspapers. You can choose how many columns you want and their widths. You can also control how they display on smaller screens — such as stacking them.

Syntax

→
Syntax is the name for the rules specifying a programming language's structure and formatting.

Static page

→
A static page is a document with fixed content that makes up an individual web page on your site.

Undo

→
To move backward one step while making changes to a Webflow site.

Account notifications

→
Account notifications update you about activity in your account. New notifications appear on your Webflow Dashboard after you log in.

Flex child

→
An element contained within a parent element that has display: flex set.

Google Universal Analytics Tracking ID

→
A unique ID you can use to link your Google Analytics account to your Webflow site.

Image field

→
Available in CMS Collections. With this field, you can upload images from your computer and use them as dynamic items in your individual Collection item.

Headless CMS

→
A headless content management system (CMS) separates the front-end presentation layer from the back-end management layer, allowing for more flexible content delivery.

Publish site

→
The act of updating your live site to reflect new design changes.

Redo

→
To move forward one step while making changes to a Webflow site.

Deployment

→
In software and web development, deployment is the process of moving code from one environment to another, usually in the form of changes or updates.

Width

→
Width defines how wide an element can be. This can be defined in absolute terms (pixels) or relative terms (ems, rems, percentages, viewport-height, or viewport-width).

Maximum height (max height)

→
The “max-height” CSS property defines an element’s maximum height.

Synchronous

→
Synchronous programming refers to sequentially executed operations.

Entity

→
An entity is a representation of a special character that causes syntax conflicts in HTML (Hypertext Markup Language).

Resolution

→
Resolution is a metric measuring clarity and detail through the number of pixels displayed on a screen or used to render an image.

Element

→
Elements are individual HTML components that constitute a webpage’s structure and contents.

Below the fold

→
Below the fold refers to the lower portion of a webpage that isn’t immediately visible to visitors upon loading until they scroll down.

Padding

→
Padding is a CSS property defining the space between an element's borders and its content.

Left padding

→
Left padding is a CSS property that defines the space between an element's left border and its content.

Footer

→
A footer is a section at the bottom of a web page.

Save

→
The Designer automatically saves your progress every 10 seconds.

Abstraction

→
In object-oriented programming (OOP), abstraction conceals irrelevant details so they don’t interfere with the task at hand.

Favicon

→
A 16x16 px image that displays in browser tabs, bookmarks, and other browser areas. It's typically a simplified version of the site's logo.

Page name

→
The title of a page in your site. This is visible in the Pages panel.

Minimum width (min width)

→
The min-width CSS property defines an element's minimum width. This can be defined in absolute terms (pixels) or relative terms (ems, rems, percentages, viewport-height, or viewport-width).

Cipher

→
In cryptography, a cipher is a digital security algorithm that encrypts and decrypts data.

ALPN

→
ALPN stands for Application-Layer Protocol Negotiation. It’s a Transport Layer Security (TLS) extension that aids client and server identification during secure data transfers.

Margin

→
Margins are an essential spacing element of web design, dictating the amount of whitespace between a box and its surroundings.

Control flow

→
The control flow is the order in which a computer program executes its instructions or statements, guided by control structures.

States dropdown menu

→
The dropdown menu to the right of the Selector field that allows you to access and change the styles of an element when it is hovered, pressed, or focused.

Link

→
A link, short for hyperlink, is a clickable website element that enables navigation between different web resources.

CSS Filters

→
CSS filters apply visual effects to HTML elements and their children using Cascading Style Sheets (CSS).

BiDi

→
BiDi stands for bidirectional. When a document is BiDi, it supports text that reads from right to left and left to right.

Primitive

→
A primitive is the simplest JavaScript data type, representing fundamental values that do not encapsulate any object, method, or property.

Meta keywords

→
Meta keywords are words or phrases you can include in your web page's metadata.

Optimizely

→
A web app that helps you measure how different site designs impact user behavior.

Constant

→
In coding, a constant is a fixed value that can’t change, no matter where it appears or what the program uses it for.

Map

→
A Webflow element that embeds an interactive Google Map in your site.

Tablet breakpoint

→
A Webflow canvas setting for creating styles that affect viewports with a minimum width of 768px and a maximum width of 990px. Also known as the tablet media query.

Component Module

→
A section in the Add Panel that houses pre-built Webflow elements such as sliders, tabs, and lightboxes.

Webflow Editor

→
Webflow's visual content editor. You can access it through the Webflow Dashboard by clicking the “3 disclosure dots” on a site thumbnail, then clicking “Editor.” Guest editors can access it anywhere on their live site by adding ?edit after the page URL (e.g., yoursite.com/page/?edit).

Text link

→
A typography element that is used to link to other pages or sections of a webpage.

Last published

→
The last time your site was published.

Radio button

→
A radio button is a form element for selecting one option from a predefined set of mutually exclusive choices.

Deprecated

→
Deprecated HTML tags are old tags replaced by updated alternatives in modern web design and development.

Borders

→
The CSS border property delineates an HTML element.

Localization

→
Localization (l10n) involves adapting digital content and applications to meet a specific region or culture’s language and conventions.

Domain name forwarding

→
Domain name forwarding is a process that automatically redirects visitors from your domain name to a different web address.

Total asset size

→
The total weight of your site's HTML, CSS, JS, and images.

Top padding

→
The inside spacing between the top border of an element and the elements inside it.

Node title

→
The type of element you're working with, i.e., H1, link, button, etc.

Typography

→
A section in the Add panel that houses typography elements such as headings and paragraphs.

Media query

→
A media query is a CSS technique that applies different styles to a website or an app based on the characteristics of the device displaying it, such as screen size, resolution, and browser viewport.

RGB (Red-Green-Blue)

→
RGB, an acronym for Red, Green, Blue, is a color model that screen displays use to represent various colors.

Image

→
A Webflow element that displays graphical files on your website.

Widget

→
A widget is an interactive element embedded in a user interface that facilitates specific user actions or displays important information at a glance.

Cipher suite

→
A cipher suite is a collection of encryption algorithms that work together to secure a network connection.

Accessibility tree

→
A webpage’s accessibility tree indicates which parts of the page are compatible with assistive technologies such as braille displays, screen readers, and voice commands.
Hmm…we couldn’t find any results. Try a different search term or reset the filter.
Reset the filter
Load more