Content Blocks: Express More Than Only Words
September 16, 2013Although blogs are a fundamental part of the internet, many blogging systems are not very expressive and lack functionality to present content in a flexible, visual manner. Everything besides plain words is often difficult to visualize and cumbersome to maintain. For this website, I implemented a modular blogging system that takes a different approach than traditional blogging software by expressing content in terms of separate, independent blocks.
Blogs are an important part of the internet and to say that a majority of internet users reads one or more blogs on a regular basis is not an overstatement, for sure. Apart from content sharing, blogging is also used as a powerful marketing instrument for companies leading to an increased visibility and higher traction.
Many blogging systems are available today, with Blogger, Wordpress and Tumblr probably known the most. They all have different characteristics and functionality, and setting up a blog has never been easier than today. My favorite is Roon, a recently launched cross-platform blogging system with a very minimal, clean interface.
Platforms like Roon and Medium have a strong focus on the visual representation of your posts. They remove all unnecessary distractions from the screen and maximize the reading experience in order to make words to be central. Although a great reading experience is absolutely essential for the readers of your blog, I found that most blogging system lack functionality to express content in a flexible, visual manner. WYSIWYG-editors are often not really returning what you see or expect, and the overall writing experience is generally not very pleasant.
The thing that frustrates me the most is that most blogging systems are very limited when you want to enter something different rather than just plain words. Showing code, highlighting a quote, or embedding for instance a tweet, these are just a few simple things that are not easy to do, especially if you want to focus on their visual representation. After all, content should be more than simple words, I believe.
Therefore, when I decided to build this website, I wanted to implement a blogging system that offered me the flexibility to include content regardless its nature and representation. The system needed to be easy to use and allow me to express the content exactly like I had in mind. Soon it was clear that a single WYSIWYG-editor –like most blogging systems provide– was not a desirable solution. Since content would just be parsed as HTML tags and stored as a big text object in the database, there would be no clear separation of concerns between the different types of content.
Instead, I took a different road and decided to express a single post in terms of separate content blocks. Blocks behave independently from each other and represent a specific kind of content (e.g. text, quote, code, image). As every block knows internally how to visualize and maintain the data it contains, blog posts are simply constructed by appending all blocks together.
- “Content should be more than only words”
Creating content becomes a very intuitive process because it requires you to think in terms of separate blocks. Each block simply expresses a certain kind of content and by placing them in the right order, you obtain a rich multi-content post. Of course, when a blog post consists of only a single piece of text, this doesn't change much in comparison to traditional blogging systems because only a single text block will be necessary. However, if you want to include more than just words, the true power of this approach becomes clear immediately.
It must be said that the idea of content blocks is not entirely new, though no major blogging platform has adopted this approach despite its powerful and flexible nature. Just recently I discovered that the WordPress community has considered the idea, but not accepted it because it would increase complexity. There is also a content blocks plugin available for Wordpress, but its focus is more on specifying page-specific layouts. Squarespace is one of the few platforms that has adopted content blocks and relies on them as the foundation to organize content on their websites. Squarespace supports many types of blocks and their system definitely looks much more advanced and polished than mine does. Below you find a screenshot of the different types of blocks that can be added to a Squarespace website.
At the moment, my implementation supports the most common block types like text, image, quote, code and video. New block types can be added relatively simple because the blogging system is implemented in a modular fashion. Other types I want to add in the future are tweets, galleries and links (represented by cards). My implementation is currently not available online, but as I am really excited about this, I might release it as an open-source project over time.
In 2013, I believe content should be more than only words. It should be backed by rich, visual data elements in order to make the message clear more effectively. Most traditional blogging software, however, lacks this functionality and does not allow content to be presented in a flexible, visual manner. Content blocks are a great solution for this because each block internally knows how to visualize the data it contains. New types of blocks can easily be added, making this approach to be well suited for expressing the content of the future.