Separating form and content is difficult if editors are used to having control over both. Try incorporating a taxonomy to help them shape the look and feel of the content. This way, you don’t need to allow too many disruptive changes, yet enable authors to choose what they need.
The usual mistake is to push visual settings into semantic content types. For example, if you have an Article content type, do not model content types such as Block Image-Left and Block Image-Right to be used as components. When you display it via another channel (or even the responsive design), left and right will lose their meanings.
Use semantics for formatting
Instead, semantically, think about what the alignment means. Create a Block Image type and either decide on your front end what happens with the attached image or add a meaningful taxonomy group to the Article content type directly to determine the order.For example, include a taxonomy called Voice & Tone, which can have options such as Playful, Professional, or Inspiring. Selecting an option will then render a different appearance on the front end.You can go even further with the design differences. For example, the Professional option would create a layout of a list view, while choosing Playful would display the content with a big hero image at the top. In all cases, content creators choose the semantics while the front end chooses the appropriate appearance.
Other channels benefit from semantics too
The same taxonomy is still valid for responsive design and can be later reused in other channels to adjust the actual tone of your assistant.Imagine the need to create a home assistant chatbot or an automated hotline later. You can adjust how the robot says the content with voice and tone settings. You can’t achieve that with left and right alignment.
How others do it
Google uses advanced content models on their Think with Google website. They reuse interesting facts, graphics, charts, and other shareable information across articles. Not only is it highly reusable, but it’s also easy to add CTAs to that content. In the following example, they allow you to share or download the given piece of content.
Sign in with your Kontent.ai credentials or sign up for free to unlock the full lesson, track your progress, and access exclusive expert insights and tips!
Semantic relationships that influence page layouts
website. They reuse interesting facts, graphics, charts, and other shareable information across articles. Not only is it highly reusable, but it’s also easy to add CTAs to that content. In the following example, they allow you to share or download the given piece of content.
