What is Fully-Fluid™ Format?

Formats are standard sizes for ad displays (or other types of visual displays, like web pages) in different types of websites, or on different screens.

Fully-Fluid™ is a format, a type of Creative (ad unit) whose layouts are infinitely adaptable to a range of sizes and formats.

Fully-Fluid™ ads can also adapt to infinite layout arrangements; that is, the responsive nature of the ad allows it to automatically choose from an array of layouts composed of different elements that you created.

Design Without Breakpoints

Previous iterations of responsive ad design relied on breakpoints to tell the ad server which preset ad layout to choose.

Breakpoints are exact points, width and height, that must be set up in advance, to trigger the correct layout choice from an ad server.

However, a Fully-Fluid™ design doesn’t require breakpoints.

How it works

• Fully-Fluid™ format bundles a group of layouts in a range of sizes and deploys them as a unit.  
• Bundles include a minimum of 3 layouts (horizontal, square and vertical shapes).
• ResponsiveAds has set, by default, five key shapes: a max size horizontal (10x1), square (1x1), vertical (1x4), landscape (16x9), and portrait (10x16) shape.

• This range of sizes and styles can be deployed selectively into different ad slots using a single tag.

• Once deployed, the ad slot from the first-party ad server will be called upon to indicate which size from the packaged group should be delivered.

Layouts in Fully-Fluid™

Layouts are the precise arrangement of images, text elements, logos, and other elements in a given ad unit (Creative), related to a given size (width x height).

Responsive ad displays choose which layout of a Creative is appropriate for a given context.

Key design concepts

To design effectively in the Fully-Fluid™ format, elements must be anchored, contained, locked, and grouped effectively.

Anchoring Elements

Anchoring elements pins an element to the canvas at one of nine fixed points.

To see a demonstration of element anchoring, watch this RAD Academy video.

Containing Elements

Containing an element sets that image or icon within a container, which lets you manipulate that element in a way that prevents the element from skewing when the fluid format shifts.

A continued element can fill or cover its container. For more detailed information, see: Elements - Containing (coming soon).

Locking Elements

Locking an element maintains its proportion within its container.

For more detailed information, see: Elements - Locking (coming soon).

Grouping Elements

Grouping elements lets you to manipulate diverse elements as a single set, which lets you standardize applied actions across all elements in the group.

For more detailed information, see: Elements - Grouping (coming soon).

Fully-Fluid Templates

You can also use a pre-loaded Templates, whose ratios are set using the best practices for Fully-Fluid design.

To better understand Templates, see Templates Overview (coming soon).

Applying Fully-Fluid™ format

The range of sizes and styles can be deployed selectively into different ad slots using a single tag.

Once deployed, the ad slot from the first-party ad server will be called upon to indicate which size from the packaged group should be delivered.

Due to the infinite range of variants available, the exact, clean, correctly sized layout will be the one seen by the user at any given time.