Last Updated: 8th Feb 2017
This is a guest post written by Reid Peifer, Partner and Art Director at Modern Tribe. In this post, Peifer shares his experience, opinions, and things to consider as the content creation experience in WordPress is revamped.
Letâ€™s imagine a world where the tools that we have donâ€™t limit us, but instead enable us to create unique, contextual, and thoughtful content. We donâ€™t fight with them, we donâ€™t quibble over line breaks and margins.
We donâ€™t argue about whether or not two images should line up. Weâ€™re not limited to bold, italic, underline, and bullet points to express our ideas. Weâ€™re not limited to taxonomies for our organization and obtuse relational algorithms to determine complementary content.
This is the reality that we should have. Content management should be more than TinyMCE and meta boxes. While WordPress has continued to grow into a mature platform, the focus on what should be its core mission has taken a second seat.
We (the WordPress community at large) have gotten so excited about making WordPress awesome, we lost sight of our charge â€“ to enable WordPress to make awesome things. To democratize publishing. To get the stories out of peopleâ€™s heads and hearts and out to the world.
We forgot about content. Without content, WordPress and all its bits and bobs amount to much ado about nothing. While itâ€™s true that WordPress has grown to an almost unimaginable scale, the content it creates today isnâ€™t going to support the needs of tomorrowâ€™s web.
I couldnâ€™t make it to WordCamp US, but Iâ€™ll admit that I sat slack-jawed with joy listening to the video calling for a focus on the editor in 2017.
The initial discussions happening on make.wordpress.org and within slack are incredibly encouraging. The community has taken this charge and is moving forward with a passion that reflects the importance of the task at hand.
While I absolutely applaud their effort, and think the conversation thus far has been valuable â€“ it immediately went to the editor itself. What makes a good editor? The discussion is focused on the UI, what format the data should be stored in, should shortcodes be used etc. All good questions, but if we answer them first â€“ we limit the scope of our inquiry.
The first question should be â€˜what makes good contentâ€™? What is â€˜contentâ€™? Does content only live on the post or the page? What are its essential elements? How do those elements interact and relate to each other? Whatâ€™s the life cycle of content? Where and how does it surface throughout the site? Does content behave differently in different scenarios or positions?
If we start with these questions, their answers become our objectives for the UI. The question â€˜what makes a good editorâ€™ has a clear answer â€“ one that makes achieving these goals delightful and effortless.
The Need for a More Robust Content Creation Tool Is Not New
Years ago, when â€˜magazine layoutâ€™ was the new hot thing, we had the privilege of working with some large publications. In our design discovery, we learned how they thought about the presentation of their content, how layouts would change based on the content they were presenting that day.
The rigid templates of the web that we were used to building couldnâ€™t possibly meet the strategy that they had employed for ages in print. The sports, business, and lifestyle sections all needed to be able to leverage different layouts and presentation depending on their immediate needs.
They needed to change day after day. We were going to toss out what we knew about building sites in WordPress. We were going to have to ditch the template hierarchy and start from scratch. The taxonomy term page in the admin wasnâ€™t going to cut it.
Meanwhile, â€˜art directedâ€™ or â€˜editorial postsâ€™ became a thing. Folks like Jason Santa Maria and Trent Walton were pumping out beautiful, bespoke articles rich in editorial design. Iâ€™ve never been more excited about the webâ€™s potential than when I saw those first Jason Santa Maria articles â€“ Iâ€™m a sucker for good content design.
At some point shortly thereafter the NY Times published Snowfall, and everyone we talked to needed â€˜long formâ€™ (even if they had no idea why or what that could mean). I ran my own experiments trying to recreate that functionality in WordPress â€“ at the time that meant full markup and a reams of custom CSS all cooked into the WYSIWYG. Beautiful output, crappy experience.
These are two really common (and old) examples of how the content needs more than the tool can offer.
We toiled away at these challenges over the years and have solved them for our particular use cases. Every project pushes our own solutions forward. Hereâ€™s some of what we learned.
(So weâ€™re all talking in the same terms, below when I reference Content Creation I mean the act of creating a new piece of content. When I reference content management, I mean both the content model, and the organization and presentation of content throughout the site.)
We Should Learn From Modular Development & Atomic Design
We should be applying modular development and atomic design principles to both content creation and content management.
Weâ€™ve adopted a modular and systematic thinking to our coding practices, breaking once monolithic templates into smaller reusable parts. Weâ€™ve applied design systems thinking and atomic approaches to our UI/UX and visual design work.
Small pieces come together to create components, which come together to create pages which come together to create full experiences. Itâ€™s the LEGO blocks school of design and build. This is a refrain that many of us know well.
Extending That Philosophy to Content Creation and Management
While weâ€™ve embraced this idea of systemic thinking in how we design and the infrastructure of what we build â€“ we havenâ€™t gotten to thinking about how to approach content creation and content management (content strategy) in a similarly modular fashion.
This is primarily because our tools wonâ€™t let us apply modular thinking to content creation and management. CMSs, including WordPress, are generally limited to predefined structures and organizational models.
The role of templating in the overall CMS architecture limits the flexibility of our content creators. Today, content strategy occurs before, and then is at the mercy of development. In a better world, our content strategy could use design and development to grow, adapt, and change over time gracefully. Our publishing tools could become the method by which our ongoing content strategy evolves.
Modular Content Creation
Letâ€™s think about the idea of content on the web. Much of what we see on the web today is a logical baby step forward from print. Titles and headlines, paragraphs of copy, images, pull quotes. Those pieces are a 1:1 analog. Because itâ€™s a digital medium, and weâ€™re oh so clever, weâ€™ve included videos, image galleries, those dang carousels, and whatnots as well.
For most of you, those elements are plopped onto a webpage using a WYSIWYG editor. You fight with TinyMCE for supremacy. Perhaps your theme or plugin has dedicated meta boxes for special elements. There may be a slide show or gallery at the top of the page.
When we look at most executions of content on the web, they are in fact less interesting, less engaging, and less beautiful than what our print counterparts have been doing for ages (and I mean literal ages).
We have all of the advantages but fail at creating anything more interesting than a preformatted spew of content. Our insistence that content and presentation need to be separate is an overstep â€“ they are related at their very core. Was there an earth shattering news story yesterday? Too bad, you get the same 400px featured image slot that every other story gets.
I refuse to believe this is the best we can do.
TinyMCE is not the pinnacle of content creation tools.
The platform that can figure out how to make content creation engaging and powerful is the platform that is going to continue to grow. While Calypso is an interesting engineering feat and is a helpful model for future development, it did little to push forward what it actually means to create content within the WordPress framework.
Trying to fight this out in a single WYSIWYG sucks
Our content creation tools should allow us to approach content creation the same way that we think about design. What are the atomic elements of my content strategy? How can I remix, reassemble, and work with those elements to create interesting content?
It must be systemic. All of the elements and components must work as part of an overall structure and strategy to form a coherent whole. Just like our design work, and our development work. Our strategy, design, and development process is focused on identifying and creating patterns.
Throughout the content strategy and design portion of the project, weâ€™re focused on identifying what those patterns are at their very core; how do we break them down into their smallest parts? Then, through design and development, we start putting those pieces together in a way that supports internal objectives and end-user objectives.
- Elements â€“ the simplest unit. Strings of text, single images, videos, a form input field or button
- Components or blocks â€“ groupings of elements that form a cohesive unit
- Modules â€“ groupings of complementary components to for a larger whole
- Pages (or posts, or CPTS or whatever) â€“ groupings of modules to form a complete piece of content
To push WordPressâ€™ content creation tools forward, we must look at what those elements, components, and modules could be, how they relate to each other. Are they created on the fly, are they opinionated or flexible. Then how do we create them. How do they relate to themes and data sanctity. And on and on.
Modular Content Management (modular content strategy)
While there are enough visual references to start to imagine what a modular content creation tool looks like, modular content management is a bit tougher to visualize so hang with me.
Within modern CMSs weâ€™ve got a couple of tools at our disposal. Tags and categories, coupled with parent / child relationships, are the primary organization structures cooked into WordPress. Of course those can be extended to include any number of taxonomical structures imaginable.
Tools like Post to Posts (P2P) provide and create an interesting peer-to-peer layer allowing you to create 1:1, 1:many, or many:many relationships.
Thatâ€™s pretty much it. The mechanics of relationships are defined and subject to code. I can assign content into those defined buckets. I have fixed templates that display those buckets in predetermined ways. If I want to vary from that, if I want to create relationships and remix content as a content manager or a content creator, Iâ€™m outta luck.
Think about the category term screen within WordPress. What sort of content management tools do you have at your disposal there? What can you do? What can you manage? Not much at all. Look back over the history of WordPress releases â€“ when has that screen changed?
We are not living up to our potential if we stop at a taxonomical organization as the be-all-end-all of content management.
The Loop is one of the central concepts of WordPress content management. While it is incredibly powerful and key to understanding how to think about your content, itâ€™s the beginning, not the end, of content management. We cannot stop at the â€˜listâ€™ as the pinnacle of our content strategy.
Needs Change Over Time
We do a lot of work for universities and schools. Each and every one has a category landing page dedicated to current students. Throughout the year, they want to gather and surface all kinds of different elements, pieces of content, and tools for those students.
In WordPress terms, weâ€™ve got pages, blog posts, events, tools, resources, key dates, applications and files, on top of video galleries and who knows what other CPTs your content strategy has formed.
The needs of those students change through the year â€“ welcome materials in the fall, midterm information in the winter, job support and internship programs in the spring. If our university friends were tied to templates where those needs were articulated in code, theyâ€™d need to go back under the hood to update their content strategy and approach it at least quarterly.
Relationships Should Be Richer Than Taxonomy Terms
Real content management would enable content creators to package and present the things theyâ€™ve made in thoughtful and unique waysâ€“where the relationships and connections have value beyond each individual piece. Together they become a cohesive whole. Thatâ€™s a content strategy thatâ€™s worth a damn. If you canâ€™t do that, your content strategy is really just a thoughtful list of categories and tags.
Our content management tools should enable and empower you to gather your content and present it how you need to. You shouldnâ€™t be limited solely by lists and algorithms. We want our clients to be able to create unique cross-sections of content where they need, not where they happen to have pre-baked templates that allow them do so.
An example to help visualize: Sticking with our college student, imagine the registrar publishes a deadline for financial aid application. The residential life department has updated forms for getting a spot in the dorms.
The student life department publishes a list of events for new students to meet each other. Each piece of content lives in its own silo in disparate places on the university website. Now imagine youâ€™re in the communications department, and youâ€™ve been charged with ensuring that new students get the information they need.
Do you A: manually type excerpts to those pieces of content in a sidebar widget, hardcode some links trying to apply a specific class that makes the links look like buttons but you canâ€™t remember if itâ€™s .btn_round or .btnround or .round_btn_blue_large, and pray it stays in the same place OR B: create a â€˜Key Info for New Studentsâ€™ module by referencing each piece of content dynamically and dragging it at the top of the homepage displacing the out of date commencement gallery that you forgot to take down last spring?
Old school is option A. New School option B (and itâ€™s not the cool old school, itâ€™s the lame frustrating old school).
The Way Forward Is Modular
If youâ€™re new the concept of atomic design, read this piece by Brad Frost first. If you want to see how we solved some of these problems specifically â€“ thereâ€™s a couple of WordPress.TV talks where I harp on this stuff here and here.
Weâ€™ve got to strive for more than just an updated WYSIWYG editor. Weâ€™ve got to aspire to a bigger and broader understanding of what content is and could be. When weâ€™ve got that vision, weâ€™ll be able to build tools to help realize it.