Close Menu

Columns

One of our favorite and most versatile blocks. Almost all of our content is wrapped inside a columns block.

Most of your site is alignwide. Columns are the shortcut to making your site look neat and tidy along the edges of your site while maintaining optimal character-per-line legibility. This block is similar to the core Columns block that Gutenberg provides, but with added functionality to ensure it looks good on both mobile and desktop. 


Media and text.

You take it for granted but its at the heart of so many forms of content. You can alternate it which side appears first on mobile, and choose column widths.

You can put anything inside of your columns. Galleries? Videos? Dreams?


Got a headline followed by a lot of content? We highly recommend setting it apart by setting them apart.

Laying out text in columns is a highly effective design strategy that can significantly enhance the visual appeal and readability of content, making it as engaging and accessible as the sophisticated layouts seen in magazines. This approach not only breaks down the text into more digestible segments, but it also organizes the content in a way that guides the reader’s eye across the page in a natural, flowing manner.

The use of columns helps in creating a structured hierarchy of information, where headlines, subheadings, and blocks of text are arranged in a balanced and aesthetically pleasing way. This spatial distribution of content can facilitate faster reading and comprehension, as shorter line lengths reduce the eye’s horizontal movement and make it easier for readers to track to the next line.

Moreover, columnar layouts allow for a more creative use of white space, which can be strategically employed to separate different topics, highlight key points, or simply give the eye a rest, contributing to a better overall reading experience. Such layouts also provide opportunities to integrate images, sidebars, pull quotes, and graphics alongside text in a cohesive manner, enriching the content and making it more appealing.

By mimicking the style of magazine layouts, which are designed to capture and hold the reader’s attention, text laid out in columns can significantly enhance the visual impact of the content, making it not only rich in information but also enticing to explore.

This technique is especially valuable in print and digital media where the goal is to engage readers and encourage them to spend more time with the content, whether it be in brochures, reports, newsletters, or online articles.

We believe that mastering the use of columns is the most important part of learning how to layout your website in an engaging way.

With longform content…

Laying out text in columns is a highly effective design strategy that can significantly enhance the visual appeal and readability of content, making it as engaging and accessible as the sophisticated layouts seen in magazines. This approach not only breaks down the text into more digestible segments, but it also organizes the content in a way that guides the reader’s eye across the page in a natural, flowing manner.

The use of columns helps in creating a structured hierarchy of information, where headlines, subheadings, and blocks of text are arranged in a balanced and aesthetically pleasing way. This spatial distribution of content can facilitate faster reading and comprehension, as shorter line lengths reduce the eye’s horizontal movement and make it easier for readers to track to the next line.

…you can string them together to create rich layouts that call out content.

Moreover, columnar layouts allow for a more creative use of white space, which can be strategically employed to separate different topics, highlight key points, or simply give the eye a rest, contributing to a better overall reading experience. Such layouts also provide opportunities to integrate images, sidebars, pull quotes, and graphics alongside text in a cohesive manner, enriching the content and making it more appealing.

By mimicking the style of magazine layouts, which are designed to capture and hold the reader’s attention, text laid out in columns can significantly enhance the visual impact of the content, making it not only rich in information but also enticing to explore.

This technique is especially valuable in print and digital media where the goal is to engage readers and encourage them to spend more time with the content, whether it be in brochures, reports, newsletters, or online articles.


Oh and you can split scroll too.

Moreover, columnar layouts allow for a more creative use of white space, which can be strategically employed to separate different topics, highlight key points, or simply give the eye a rest, contributing to a better overall reading experience. Such layouts also provide opportunities to integrate images, sidebars, pull quotes, and graphics alongside text in a cohesive manner, enriching the content and making it more appealing.

By mimicking the style of magazine layouts, which are designed to capture and hold the reader’s attention, text laid out in columns can significantly enhance the visual impact of the content, making it not only rich in information but also enticing to explore.

This technique is especially valuable in print and digital media where the goal is to engage readers and encourage them to spend more time with the content, whether it be in brochures, reports, newsletters, or online articles.


Or stick to the tried and true.

A small river named Duden flows by their place and supplies it with the necessary regelialia.

Alternating images.

A small river named Duden flows by their place and supplies it with the necessary regelialia.

That even out uniformly on mobile.

A small river named Duden flows by their place and supplies it with the necessary regelialia.


Same thing.

A small river named Duden flows by their place and supplies it with the necessary regelialia.

But…

A small river named Duden flows by their place and supplies it with the necessary regelialia.

Big!

A small river named Duden flows by their place and supplies it with the necessary regelialia.

Great for video? Of course it is.

Think of the possibilities.

Laying out text in columns is a sophisticated design strategy that has a profound impact on the readability and aesthetic appeal of content. By mirroring the engaging layouts found in magazines, columnar text organization transforms the presentation of information, making it not only accessible but also visually captivating.

This method effectively segments dense text into manageable portions, allowing readers to navigate through the content with ease. Columns facilitate a guided reading experience, directing the eye in a smooth, horizontal motion before dropping down to the next line. This natural flow significantly reduces the effort required to read large volumes of text, making the content more approachable and less intimidating to the audience.

Furthermore, the strategic use of columns in layout design introduces a clear hierarchy of information, which is crucial for capturing and sustaining the reader’s interest. Titles, subtitles, and body text can be arranged in a manner that emphasizes their relative importance, guiding the reader’s attention to key points first. This method of organization not only makes the content more digestible but also allows for a seamless integration of visual elements.

Images, charts, and sidebars can be positioned in close proximity to related text, enhancing the reader’s understanding and retention of information. The balance between text and visuals in columnar layouts ensures that the content is not only rich in information but also visually stimulating, encouraging deeper engagement with the material.

Columnar text layouts are particularly adept at utilizing white space, or negative space, to their advantage. White space acts as a breathing room for the content, preventing the page from appearing overcrowded and overwhelming. It can be strategically placed to delineate sections, highlight key information, or create visual relief, all of which contribute to a more pleasant reading experience.

The thoughtful allocation of white space in a columnar design not only enhances readability but also imbues the content with a sense of sophistication and professionalism, akin to high-quality magazine publications.

Jane Doe

Author

The adaptability of columnar layouts across different mediums is another testament to their utility. Whether in print or digital form, columns can be adjusted to fit various formats, from newsletters and brochures to web pages and e-magazines. This flexibility ensures that the content remains effective and engaging across all platforms, reaching a wider audience.

In digital environments, especially, columnar layouts can be dynamically reconfigured to suit different screen sizes and orientations, making the content equally accessible on desktops, tablets, and smartphones. This responsiveness is essential in today’s multi-device world, where content consumption patterns are increasingly diverse.

In conclusion, the utilization of columnar layouts in text presentation offers a multitude of benefits, from improved readability and hierarchical structuring to enhanced visual appeal and cross-platform adaptability. By drawing inspiration from magazine layouts, designers can create content that is not only information-rich but also enticing and accessible.

This approach to layout design not only captivates the reader’s attention but also enriches their reading experience, making the exploration of content both enjoyable and rewarding. The strategic implementation of columns in content layout is a testament to the power of thoughtful design in shaping how information is consumed and appreciated.

You can put most anything inside these things.

I’m a card.

With a little description under it. You name it, you can do it.

I’m a card.

With a little description under it. You name it, you can do it.

I’m a card.

With a little description under it. You name it, you can do it.

I’m a card.

With a little description under it. You name it, you can do it.

Another version of a grid.

I’m a card.

With a little description under it. You name it, you can do it.

I’m a card.

With a little description under it. You name it, you can do it.

I’m a card.

With a little description under it. You name it, you can do it.

I’m a card.

With a little description under it. You name it, you can do it.

I’m a card.

With a little description under it. You name it, you can do it.

I’m a card.

With a little description under it. You name it, you can do it.



It doesn’t stop there.
Get creative.