This document compares Drupal's page-building tools, Paragraphs and Layout Builder, discussing their pros and cons to help site builders choose the best option. It provides insights into the history of layout building in Drupal and highlights the features, strengths, and weaknesses of each tool. The session aims to guide users on when to use each tool for optimal website design and functionality.

1. Paragraphs
July 16, 2020
Page Building Showdown
Layout Builder
vs

2. Site builders have heard the story
a hundred times: “Our website is
too inflexible.”
As Drupal developers, we proudly
proclaim, “We have a module for
that!” (and it’s true).
| 2
This session will present an
honest comparison of the current
champ in Drupal 8 contrib,
Paragraphs (117k+ D8 usage),
against the relatively new
challenger: Layout builder.

3. Site builders wanting to
understand which page building
tool offers the best advantages
for their project and organization
| 3
Learn about the pros and cons
Layout builder vs Paragraphs and
learn more about the history
behind page-building tools
This Session is For Learning Objectives

4. 1. About the speaker
2. History of Layout building in Drupal
3. Paragraphs
4. Layout Builder
5. Other Layout / editor tools
6. What should I use?
7. Q&A
Today’s
Agenda

5. Jay is an engineer and leader with a passion for
creating technical solutions that solve real-world
problems. As a long-time advocate for Drupal and
Open Source, he has spent over a decade
speaking, writing, and developing enterprise
solutions that advance Open Source worldwide.
Jay’s primary responsibilities are working with the
revenue team to acquire and retain customers,
overseeing Security, DevOps, and IT roles, and
leading Mediacurrent’s technology vision. He also
helps lead the development of tools and solutions,
including the Rain distribution, which won Acquia’s
“Open Source Giants” award in 2019.
Jay Callicott
VP of Technical Operations

6. Open Source
Expansion Partner

7. Who We Are
We are Drupal pioneers, digital strategy experts,
open source advocates, researchers, designers,
and innovators who solve technology challenges.

8. Our Mission
To bring together the most talented team members
to provide world-class solutions for the web.

9. History of Layout
Building in Drupal

10. ● Blocks
● Context
● Display Suite
● Panels
● Panelizer
● Panopoly
The History
| 10
Layout Building

17. Paragraphs

18. | 18
Paragraphs
● Nesting
● Revision bloat
● No inline preview
● No layout controls
● Paragraph “add” UX can be
confusing for editors
The Bad
● Structured
● Consistent interface
● Flexible
● API-friendly
● Fields are translatable
The Good

19. ● Limit nesting
● Paragraphs browser improves “add”
experience
● Adding icons
● Enabling page preview
● Node revision autoclean
● Improvements I’d like to see
Making it Better
| 19
Paragraphs

25. Layout Builder

26. ● In Core
● Preview
● Layout UX
● Translatable
● Can still use Paragraphs
The Good
| 26
Layout Builder
● Inline blocks UX
● “Choose block” UX
● Separate Tab
● Disconnected content
● Doesn’t fit decoupled
The Bad

27. ● Layout Builder Modal module
● Layout Builder Restrictions module
● Improvements I’d like to see
Making it Better
| 27
Layout Builder

31. | 31
Other Layout Tools
Let’s examine a few other layout tools including Acquia Cohesion,
Gutenberg and HAX.

36. | 36
What should I use?
We have reviewed the history of Drupal site building, pros and
cons of Layout Builder, Paragraphs, and looked at other new
tools.
Let’s talk about what you should use and when.

37. | 37
When layouts are relatively
straightforward, inline preview is
not paramount.
Also better the solution is
decoupled with a React frontend.
The case for
Paragraphs

38. | 38
Layout and inline preview are
absolutely critical to the desired
editing experience.
A better option when the
alternative would be messy
nesting of Paragraphs.
The case for
Layout
Builder

39. Questions & Feedback
Does something resonate with you today?
Get in touch with me.
twitter.com/drupalninja
mediacurrent.com/contact-us

40. | 40| 40
Your Feedback is
Valuable!

41. Thank you!
@Mediacurrent
Mediacurrent @Mediacurrent
MediacurrentDrupal
Mediacurrent.com
@Mediacurrent