{"id":9431,"date":"2021-06-25T12:06:13","date_gmt":"2021-06-25T12:06:13","guid":{"rendered":"https:\/\/uxwritinghub.com\/?p=9431"},"modified":"2022-01-08T15:57:23","modified_gmt":"2022-01-08T15:57:23","slug":"content-design-systems","status":"publish","type":"post","link":"https:\/\/uxwritinghub.com\/content-design-systems\/","title":{"rendered":"Everything you need to know about content design systems (and how they differ from content style guides)"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"9431\" class=\"elementor elementor-9431\">\n\t\t\t\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-7e9361e elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"7e9361e\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-418a5a2\" data-id=\"418a5a2\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-ce0435e elementor-widget elementor-widget-text-editor\" data-id=\"ce0435e\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p><strong>If you write for a living, you\u2019re most likely familiar with <a href=\"https:\/\/uxwritinghub.com\/content-style-guides\/\" target=\"_blank\" rel=\"noopener\">content style guides<\/a>. If you\u2019re a <a href=\"https:\/\/uxwritinghub.com\/what-is-ux-writing\/\" target=\"_blank\" rel=\"noopener\">UX writer<\/a> or <a href=\"https:\/\/uxwritinghub.com\/the-rise-of-content-design\/\" target=\"_blank\" rel=\"noopener\">content designer<\/a>, you may also come across a full-blown content design system. What\u2019s the difference between the two, what are the benefits of each, and which one is right for you? Let\u2019s find out!<\/strong><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-928fb35 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"928fb35\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-25983cf\" data-id=\"25983cf\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-6a6fd1b elementor-toc--minimized-on-tablet elementor-widget elementor-widget-table-of-contents\" data-id=\"6a6fd1b\" data-element_type=\"widget\" data-settings=\"{&quot;headings_by_tags&quot;:[&quot;h2&quot;],&quot;marker_view&quot;:&quot;bullets&quot;,&quot;icon&quot;:{&quot;value&quot;:&quot;fas fa-circle&quot;,&quot;library&quot;:&quot;fa-solid&quot;,&quot;rendered_tag&quot;:&quot;&lt;svg class=\\&quot;e-font-icon-svg e-fas-circle\\&quot; viewBox=\\&quot;0 0 512 512\\&quot; xmlns=\\&quot;http:\\\/\\\/www.w3.org\\\/2000\\\/svg\\&quot;&gt;&lt;path d=\\&quot;M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8z\\&quot;&gt;&lt;\\\/path&gt;&lt;\\\/svg&gt;&quot;},&quot;minimize_box&quot;:&quot;yes&quot;,&quot;minimized_on&quot;:&quot;tablet&quot;,&quot;hierarchical_view&quot;:&quot;yes&quot;,&quot;min_height&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;min_height_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;min_height_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"table-of-contents.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-toc__header\">\n\t\t\t<h2 class=\"elementor-toc__header-title\">\n\t\t\t\tShortcuts \u2013 jump straight to:\t\t\t<\/h2>\n\t\t\t\t\t\t\t<div class=\"elementor-toc__toggle-button elementor-toc__toggle-button--expand\"><svg class=\"e-font-icon-svg e-fas-chevron-down\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z\"><\/path><\/svg><\/div>\n\t\t\t\t<div class=\"elementor-toc__toggle-button elementor-toc__toggle-button--collapse\"><svg class=\"e-font-icon-svg e-fas-chevron-up\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M240.971 130.524l194.343 194.343c9.373 9.373 9.373 24.569 0 33.941l-22.667 22.667c-9.357 9.357-24.522 9.375-33.901.04L224 227.495 69.255 381.516c-9.379 9.335-24.544 9.317-33.901-.04l-22.667-22.667c-9.373-9.373-9.373-24.569 0-33.941L207.03 130.525c9.372-9.373 24.568-9.373 33.941-.001z\"><\/path><\/svg><\/div>\n\t\t\t\t\t<\/div>\n\t\t<div class=\"elementor-toc__body\">\n\t\t\t<div class=\"elementor-toc__spinner-container\">\n\t\t\t\t<svg class=\"elementor-toc__spinner eicon-animation-spin e-font-icon-svg e-eicon-loading\" aria-hidden=\"true\" viewBox=\"0 0 1000 1000\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M500 975V858C696 858 858 696 858 500S696 142 500 142 142 304 142 500H25C25 237 238 25 500 25S975 237 975 500 763 975 500 975Z\"><\/path><\/svg>\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-63be3927 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"63be3927\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-41bb5985\" data-id=\"41bb5985\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-71cb1df5 elementor-widget elementor-widget-text-editor\" data-id=\"71cb1df5\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<h2><b>What is a content style guide?<\/b><\/h2><p><span style=\"font-weight: 400;\">A content style guide is a document or site with <\/span><b>guidelines, recommendations and best practices<\/b><span style=\"font-weight: 400;\"> for everyone who creates content for a company, project or product.<\/span><\/p><p><span style=\"font-weight: 400;\">The idea is to give all contributors <\/span><b>a common reference guide<\/b><span style=\"font-weight: 400;\"> to help them create consistent content that speaks the preferred language of the product and meets the intended business goals.<\/span><\/p><p><a href=\"https:\/\/uxwritinghub.com\/content-style-guides\/\">Check out this article for examples of 16 great content style guides<\/a>.<\/p><h2>What does a content style guide contain?<\/h2><p><span style=\"font-weight: 400;\">A content style guide can grow into a pretty hefty document to include things like<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Business, product and project goals<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Target audience analysis and\/or personas<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Voice and tone<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Style guidelines with details like date formats, numbers, punctuation, British\/American\/other English, abbreviations, title or sentence case<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">A glossary with preferred and banned terms and phrases<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Accessibility and inclusion: advice about how to create inclusive, accessible content, how to deal with jargon<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">SEO guidelines and recommendations for keyword research<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Guidelines for writing for different channels (for example newsletters, SoMe, blogs, editorial web content, microcopy)<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Resources with links for more information<\/span><\/li><\/ul><figure id=\"attachment_9445\" aria-describedby=\"caption-attachment-9445\" style=\"width: 431px\" class=\"wp-caption alignnone\"><img class=\"size-full wp-image-9445\" src=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/small-changes-can-make-a-big-difference-snapshot-from-webinar-with-clara-from-atlassian.jpg\" alt=\"Two illustrations of Lisa Simpson's facial expressions, showing how small differences can make a big difference\" width=\"431\" height=\"276\" srcset=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/small-changes-can-make-a-big-difference-snapshot-from-webinar-with-clara-from-atlassian.jpg 431w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/small-changes-can-make-a-big-difference-snapshot-from-webinar-with-clara-from-atlassian-300x192.jpg 300w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/small-changes-can-make-a-big-difference-snapshot-from-webinar-with-clara-from-atlassian-400x256.jpg 400w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/small-changes-can-make-a-big-difference-snapshot-from-webinar-with-clara-from-atlassian-150x96.jpg 150w\" sizes=\"(max-width: 431px) 100vw, 431px\" \/><figcaption id=\"caption-attachment-9445\" class=\"wp-caption-text\">Image from a webinar about content style guides with Atlassian\u2019s Lead UX Writer Clara Sherley Appel, illustrating how small differences can make a big difference \u2013 and that\u2019s exactly why it\u2019s a good idea to document writing preferences in a style guide.<\/figcaption><\/figure><h2>Examples of content style guides<\/h2><p><span style=\"font-weight: 400;\">There are tons of top-notch, publicly available content style guides out there. These for example:<\/span><span style=\"font-weight: 400;\"><br \/><\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><a href=\"https:\/\/styleguide.mailchimp.com\/\"><span style=\"font-weight: 400;\">Mailchimp<\/span><\/a><span style=\"font-weight: 400;\"> \u2013 possibly the most celebrated style guide in the world<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><a href=\"https:\/\/www.gov.uk\/government\/content-publishing\"><span style=\"font-weight: 400;\">UK government <\/span><\/a><span style=\"font-weight: 400;\">\u2013 comprehensive guide that rose to fame after Sarah Winters coined the term content design and set out to transform the user experience on the site<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><a href=\"https:\/\/help.apple.com\/applestyleguide\/\"><span style=\"font-weight: 400;\">Apple<\/span><\/a><span style=\"font-weight: 400;\"> \u2013 Apple\u2019s writing guidelines include an A-Z with style details, useful recommendations for accessible, inclusive writing and handy tips for writing copy that will be localized<\/span><span style=\"font-weight: 400;\"><br \/><\/span><\/li><\/ul><p><span style=\"font-weight: 400;\">You can see a full list of inspiring <\/span><a href=\"https:\/\/uxwritinghub.com\/content-style-guides\/\"><span style=\"font-weight: 400;\">content style guide examples in this separate blog article<\/span><\/a><span style=\"font-weight: 400;\">.<\/span><\/p><h2>Potential issues with content style guides<\/h2><p><span style=\"font-weight: 400;\">As great as content style guides may be, there are still a few potential challenges.\u00a0<\/span><\/p><ol><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Have you ever tried introducing one to non-writers? I have, with minimal success. Style guides are often created <\/span><b>by writers for writers<\/b><span style=\"font-weight: 400;\">. They don\u2019t always resonate with other stakeholders.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">If they are created as a stand-alone document, they are <\/span><b>not integrated<\/b><span style=\"font-weight: 400;\"> in the company\u2019s design system. This doesn\u2019t help to encourage non-writers to use them.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Even though they are full of detailed instructions and advice, they typically lack a components and\/or pattern library with <\/span><b>reusable content elements<\/b><span style=\"font-weight: 400;\">. This means that those who do use the style guide don\u2019t necessarily save time.<\/span><\/li><\/ol><p><span style=\"font-weight: 400;\">Also, the term \u201ccontent style guide\u201d comes from <\/span><b>the world of content marketing and copywriting<\/b><span style=\"font-weight: 400;\">. Adopted by UX writers and content designers, the traditional \u201ctone of voice\u201d swiftly became \u201cvoice and tone\u201d. This better reflects copy written for a user journey that goes through different emotional states. Apart from that, they\u2019re pretty similar to what you\u2019ll find in a content marketing style guide.<\/span><\/p><p><span style=\"font-weight: 400;\">But if UX writing and content design are really part of design, shouldn\u2019t the style guide also be fully integrated in the design system? Yes please, that makes total sense! And this is exactly why many product teams now focus on developing a <\/span><b>content design system,<\/b><span style=\"font-weight: 400;\"> ideally integrated in the company design system.<\/span><\/p><h2>What is a design system?<\/h2><p><span style=\"font-weight: 400;\">Before we dive into content design systems, let\u2019s clarify what a design system is. Here\u2019s the definition provided by <\/span><a href=\"https:\/\/www.nngroup.com\/articles\/design-systems-101\/\"><span style=\"font-weight: 400;\">Norman Nielsen group<\/span><\/a><span style=\"font-weight: 400;\">:\u00a0<\/span><\/p><blockquote><p><span style=\"font-weight: 400;\">\u201cA design system is a complete set of standards intended to manage design at scale using reusable components and patterns.\u201d\u00a0<\/span><\/p><\/blockquote><p><span style=\"font-weight: 400;\">For many of us, the first thing that springs to mind when thinking of design systems is specs for color, typography, spacing and grids. But a design system can be much more systematic and methodical. Brad Frost for example has developed the chemistry-influenced <\/span><a href=\"https:\/\/bradfrost.com\/blog\/post\/atomic-web-design\/\"><span style=\"font-weight: 400;\">atomic design approach<\/span><\/a><span style=\"font-weight: 400;\">, which is a way to move away from creating simple web pages to actual systems of components.<\/span><\/p><p><span style=\"font-weight: 400;\">Atomic design includes five levels or stages:<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Atoms (examples form a web interface would be a form label, input or button)<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Molecules (groups of atoms)<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Organisms (combinations of molecules)<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Templates (wireframes with placeholder content)<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Pages (wireframes with real content)<\/span><\/li><\/ul><p><span style=\"font-weight: 400;\">Perhaps the most obvious advantage of a design system is that both designers and non-designers have access to corporate design elements, making company <\/span><b>communication more consistent<\/b><span style=\"font-weight: 400;\">.<\/span><\/p><p><span style=\"font-weight: 400;\">Another benefit of a design system is that you don\u2019t have to reinvent the wheel with every design. Instead you have a library of existing designs that you can reuse for your purpose. This is most definitely <\/span><b>a welcome time-saver.<\/b><span style=\"font-weight: 400;\"> And a positive side-effect of having more time is that the team can<\/span><b> focus on more pressing tasks<\/b><span style=\"font-weight: 400;\">.<\/span><\/p><p><span style=\"font-weight: 400;\">Far from every company has a design system, and not everyone needs one. Small teams may find other ways to synchronize their work, or use a mini version of a full-blown design system. But a company set on growth would be wise to keep a future design system in mind.<\/span><\/p><h2>What is a content design system?<\/h2><p><span style=\"font-weight: 400;\">If we apply the main points of a design system to content, we get something <\/span><b>a bit different than a regular style guide<\/b><span style=\"font-weight: 400;\">. To qualify as a content design system, it should:<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Be more than a voice and tone, glossary and style recommendations<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Include reusable content elements that can be used by writers and non-writers alike<\/span><\/li><\/ul><p><span style=\"font-weight: 400;\">Ryan Cordell hits the nail on the head in his <\/span><a href=\"https:\/\/medium.com\/deliveroo-design\/content-design-systems-need-you-82836afb4fe6\"><span style=\"font-weight: 400;\">article about the Deliveroo content design system<\/span><\/a><span style=\"font-weight: 400;\">:\u00a0<\/span><\/p><blockquote><p><span style=\"font-weight: 400;\">\u201cWhen we say Content design system we mean a set of scenario-specific components, backed by research and agreed upon by the team, fully integrated into the design system our Product designers and Engineers use right now. Something that allows them to make solid content decisions without us.\u201d\u00a0<\/span><\/p><\/blockquote><p><span style=\"font-weight: 400;\">So ideally, a content design system is<strong> included in<\/strong> <\/span><b>the design system<\/b><span style=\"font-weight: 400;\"> &#8211; not a separate, lonely document that only writers are familiar with.<\/span><\/p><h2>Benefits of a content design system<\/h2><p><span style=\"font-weight: 400;\">The benefits of a content design system are the same as a regular design system. It aids consistency, saves times and frees up capacity for more complex problem solving. There\u2019s also the added bonus of cementing content as a natural part of the design process \ud83d\ude0d<\/span><\/p><h2>Examples of content design systems<\/h2><p><span style=\"font-weight: 400;\">There are plenty of existing design systems that have started to integrate content out there. Here are a few you can check out:<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><a href=\"https:\/\/www.lightningdesignsystem.com\/\"><span style=\"font-weight: 400;\">Lightning (Salesforce)<\/span><\/a><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><a href=\"https:\/\/canvas.hubspot.com\/\"><span style=\"font-weight: 400;\">Canvas (Hubspot)<\/span><\/a><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><a href=\"https:\/\/material.io\"><span style=\"font-weight: 400;\">Google Material design<\/span><\/a><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><a href=\"https:\/\/polaris.shopify.com\/\"><span style=\"font-weight: 400;\">Polaris (Shopify)<\/span><\/a><\/li><\/ul><p>Others fall somewhere right in between a content style guide and a content design system. Like the brilliant <a href=\"https:\/\/designsystem.quickbooks.com\/\"><span style=\"font-weight: 400;\">Intuit Quickbooks<\/span><\/a>. It has a fab content section, but it&#8217;s separated from the design part, and the content pattern section doesn&#8217;t include any reusable components, as far as I can see. Still, definitely worth a look!<\/p><h2>Content design systems in action<\/h2><p><span style=\"font-weight: 400;\">So what does it look like when design systems incorporate content? Let\u2019s check out a few of our faves:<\/span><\/p><h3>1. Hubspot&#8217;s Canvas<\/h3><p><span style=\"font-weight: 400;\">Hubspot\u2019s Canvas design system has a wonderful mix of UI components, illustrations, guidelines and copy best practices and examples. Here\u2019s a snapshot of a page about empty states in their pattern library:<\/span><\/p><p><img class=\"alignnone size-full wp-image-9439\" src=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-empty-state-I.jpg\" alt=\"A snapshot of Hubspot's empty state guidelines, including image and copy recommendations as well as links to visual component examples \" width=\"1113\" height=\"610\" srcset=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-empty-state-I.jpg 1113w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-empty-state-I-300x164.jpg 300w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-empty-state-I-1024x561.jpg 1024w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-empty-state-I-768x421.jpg 768w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-empty-state-I-400x219.jpg 400w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-empty-state-I-150x82.jpg 150w\" sizes=\"(max-width: 1113px) 100vw, 1113px\" \/><\/p><p><span style=\"font-weight: 400;\">The component links in the image go to visual\/copy examples like this one:<\/span><\/p><figure id=\"attachment_9438\" aria-describedby=\"caption-attachment-9438\" style=\"width: 663px\" class=\"wp-caption alignnone\"><img class=\"size-full wp-image-9438\" src=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-component-example.jpg\" alt=\"A component example of an empty state in Hubspot\u2019s Canvas design system, showing an illustration, a heading, and an explanatory piece of microcopy\" width=\"663\" height=\"538\" srcset=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-component-example.jpg 663w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-component-example-300x243.jpg 300w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-component-example-400x325.jpg 400w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/hubspot-component-example-150x122.jpg 150w\" sizes=\"(max-width: 663px) 100vw, 663px\" \/><figcaption id=\"caption-attachment-9438\" class=\"wp-caption-text\">A component example of an empty state in Hubspot\u2019s Canvas design system, showing an illustration, a heading, and an explanatory piece of microcopy<\/figcaption><\/figure><h3>2. Salesforce&#8217;s Lightning<\/h3><p><span style=\"font-weight: 400;\">Salesforce\u2019s Lightning design system also provides copy recommendations. As you can see in the examples below, the illustrations themselves often lack copy examples, but they do provide thorough copy guidelines:<\/span><\/p><figure id=\"attachment_9440\" aria-describedby=\"caption-attachment-9440\" style=\"width: 948px\" class=\"wp-caption alignnone\"><img class=\"wp-image-9440 size-full\" src=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-illustrations.jpg\" alt=\"Visual examples of empty states in Salesforce\u2019s Lightning design system, showing available options for illustrations, body text, headlines and a call to action\" width=\"948\" height=\"765\" srcset=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-illustrations.jpg 948w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-illustrations-300x242.jpg 300w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-illustrations-768x620.jpg 768w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-illustrations-400x323.jpg 400w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-illustrations-150x121.jpg 150w\" sizes=\"(max-width: 948px) 100vw, 948px\" \/><figcaption id=\"caption-attachment-9440\" class=\"wp-caption-text\">Visual examples of empty states in Salesforce\u2019s Lightning design system, showing available options for illustrations, body text, headlines and a call to action.<\/figcaption><\/figure><p><span style=\"font-weight: 400;\">Here are the accompanying copy guidelines:<\/span><\/p><figure id=\"attachment_9442\" aria-describedby=\"caption-attachment-9442\" style=\"width: 946px\" class=\"wp-caption alignnone\"><img class=\"wp-image-9442 size-full\" src=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-overview.jpg\" alt=\"Copy guidelines for empty states in Salesforce\u2019s Lightning design system, including specific recommendations like \u201cThe headline should start with a verb\u201d\" width=\"946\" height=\"513\" srcset=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-overview.jpg 946w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-overview-300x163.jpg 300w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-overview-768x416.jpg 768w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-overview-400x217.jpg 400w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/salesforce-empty-state-overview-150x81.jpg 150w\" sizes=\"(max-width: 946px) 100vw, 946px\" \/><figcaption id=\"caption-attachment-9442\" class=\"wp-caption-text\">Copy guidelines for empty states in Salesforce\u2019s Lightning design system, including specific recommendations like \u201cThe headline should start with a verb\u201d.<\/figcaption><\/figure><p><span style=\"font-weight: 400;\">I love how specific these guidelines are, but it would be even better if the illustrations had real, best practice examples of copy.<\/span><\/p><h3>3. Shopify&#8217;s Polaris<\/h3><p><span style=\"font-weight: 400;\">Shopify\u2019s stellar design system Polaris<\/span> <span style=\"font-weight: 400;\">has separate sections for content and design, but they also have a components section with info for developers, designers and content designers. Here\u2019s a snapshot of the component library\u2019s content guidelines for banner titles:<\/span><\/p><figure id=\"attachment_9443\" aria-describedby=\"caption-attachment-9443\" style=\"width: 879px\" class=\"wp-caption alignnone\"><img class=\"size-full wp-image-9443\" src=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/polaris-shopify-banner-title-content-guidelines.jpg\" alt=\"Content guidelines for banner titles in Shopify\u2019s Polaris design system, including specific copy recommendations and a best practice example\" width=\"879\" height=\"597\" srcset=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/polaris-shopify-banner-title-content-guidelines.jpg 879w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/polaris-shopify-banner-title-content-guidelines-300x204.jpg 300w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/polaris-shopify-banner-title-content-guidelines-768x522.jpg 768w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/polaris-shopify-banner-title-content-guidelines-400x272.jpg 400w, https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/polaris-shopify-banner-title-content-guidelines-150x102.jpg 150w\" sizes=\"(max-width: 879px) 100vw, 879px\" \/><figcaption id=\"caption-attachment-9443\" class=\"wp-caption-text\">Content guidelines for banner titles in Shopify\u2019s Polaris design system, including specific copy recommendations and a best practice example.<\/figcaption><\/figure><p><span style=\"font-weight: 400;\">Nice \ud83d\udc4f\ud83d\udc4f\ud83d\udc4f<\/span><\/p><h3>Potential issues with a content design system<\/h3><p><span style=\"font-weight: 400;\">Setting up and maintaining a fully integrated content design system is a mega effort for sure. It needs constant attention to stay relevant and useful.\u00a0<\/span><\/p><h2>Do you need a content design system?<\/h2><p><span style=\"font-weight: 400;\">The short answer is that it depends. It may be overkill for smaller businesses. Some companies may be happy with a regular content style guide. Large corporations most definitely have a lot to gain from a content design system, especially one that\u2019s a part of a wider design system.<\/span><\/p><p><span style=\"font-weight: 400;\">Tips:<\/span><span style=\"font-weight: 400;\"><br \/><\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Start small! Building a style guide or system is a process. It will never be finished and that\u2019s not the point either \ud83d\ude42<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">If it feels like a mammoth task to start from scratch, you don\u2019t have to. Start with an existing style guide or system you like and use that as your base, adapting it as needed.<\/span><\/li><\/ul><p>Need more design system inspiration? Y<span style=\"font-weight: 400;\">ou\u2019ll find a few zillion in the <\/span><a href=\"https:\/\/designsystemsrepo.com\/design-systems\/\"><span style=\"font-weight: 400;\">Design systems gallery<\/span><\/a><span style=\"font-weight: 400;\"> and <\/span><a href=\"https:\/\/adele.uxpin.com\/\"><span style=\"font-weight: 400;\">UXPin\u2019s design system repository Adele<\/span><\/a><span style=\"font-weight: 400;\">.<\/span><\/p><h2>Keep learning<\/h2><p><a href=\"https:\/\/uxwritinghub.com\/content-style-guides\/\">16 examples of great content style guides<\/a> (article)<\/p><p><a href=\"https:\/\/uxwritinghub.com\/building-a-content-design-system-with-stephen-curran-intuit\/\">Building a content design system with Stephen Curran at Intuit<\/a> (podcast episode)<\/p><p><a href=\"https:\/\/uxwritinghub.com\/ditch-the-voice-and-tone-with-nicole-michaelis-spotify\/\">Ditch the voice and tone with Nicole Michaelis at Spotify<\/a> (podcast episode)<\/p><h2>Take a UX writing course<\/h2><p>Planning to transition to UX writing or content design? <a href=\"https:\/\/uxwritinghub.com\/ux-writing-courses\/\">Check out our UX writing courses!<\/a><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>A content design system is much more than a regular style guide. It should include reusable content elements that can be used by both writers and non-writers on a project.<\/p>\n","protected":false},"author":25,"featured_media":9432,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"tpgb_global_settings":"","_eb_attr":"","content-type":"","_mi_skip_tracking":false},"categories":[59,61,56,57],"tags":[22,267,91,266,16],"acf":{"descriptions":false},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v19.2 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>All you need to know about content design systems - UX WRITING HUB<\/title>\n<meta name=\"description\" content=\"What is a content design system and how does it differ from a regular content style guide? You&#039;ll find out in this article.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/uxwritinghub.com\/content-design-systems\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"All you need to know about content design systems - UX WRITING HUB\" \/>\n<meta property=\"og:description\" content=\"What is a content design system and how does it differ from a regular content style guide? You&#039;ll find out in this article.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/uxwritinghub.com\/content-design-systems\/\" \/>\n<meta property=\"og:site_name\" content=\"UX WRITING HUB\" \/>\n<meta property=\"article:published_time\" content=\"2021-06-25T12:06:13+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-01-08T15:57:23+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1500\" \/>\n\t<meta property=\"og:image:height\" content=\"1000\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Anja Wedberg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Anja Wedberg\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/uxwritinghub.com\/#website\",\"url\":\"https:\/\/uxwritinghub.com\/\",\"name\":\"UX WRITING HUB\",\"description\":\"Learn to write user experience\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/uxwritinghub.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/uxwritinghub.com\/content-design-systems\/#primaryimage\",\"url\":\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008.png\",\"contentUrl\":\"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008.png\",\"width\":1500,\"height\":1000,\"caption\":\"Illustration of a person adding content to a web interface\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/uxwritinghub.com\/content-design-systems\/#webpage\",\"url\":\"https:\/\/uxwritinghub.com\/content-design-systems\/\",\"name\":\"All you need to know about content design systems - UX WRITING HUB\",\"isPartOf\":{\"@id\":\"https:\/\/uxwritinghub.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/uxwritinghub.com\/content-design-systems\/#primaryimage\"},\"datePublished\":\"2021-06-25T12:06:13+00:00\",\"dateModified\":\"2022-01-08T15:57:23+00:00\",\"author\":{\"@id\":\"https:\/\/uxwritinghub.com\/#\/schema\/person\/09a8153c81f51a3ea050f4b3d5e122b2\"},\"description\":\"What is a content design system and how does it differ from a regular content style guide? You'll find out in this article.\",\"breadcrumb\":{\"@id\":\"https:\/\/uxwritinghub.com\/content-design-systems\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/uxwritinghub.com\/content-design-systems\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/uxwritinghub.com\/content-design-systems\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/uxwritinghub.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Everything you need to know about content design systems (and how they differ from content style guides)\"}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/uxwritinghub.com\/#\/schema\/person\/09a8153c81f51a3ea050f4b3d5e122b2\",\"name\":\"Anja Wedberg\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/uxwritinghub.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/d4778be412a7978a4206e045a45416a6?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/d4778be412a7978a4206e045a45416a6?s=96&d=mm&r=g\",\"caption\":\"Anja Wedberg\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"All you need to know about content design systems - UX WRITING HUB","description":"What is a content design system and how does it differ from a regular content style guide? You'll find out in this article.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/uxwritinghub.com\/content-design-systems\/","og_locale":"en_US","og_type":"article","og_title":"All you need to know about content design systems - UX WRITING HUB","og_description":"What is a content design system and how does it differ from a regular content style guide? You'll find out in this article.","og_url":"https:\/\/uxwritinghub.com\/content-design-systems\/","og_site_name":"UX WRITING HUB","article_published_time":"2021-06-25T12:06:13+00:00","article_modified_time":"2022-01-08T15:57:23+00:00","og_image":[{"width":1500,"height":1000,"url":"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008.png","type":"image\/png"}],"author":"Anja Wedberg","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Anja Wedberg","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/uxwritinghub.com\/#website","url":"https:\/\/uxwritinghub.com\/","name":"UX WRITING HUB","description":"Learn to write user experience","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/uxwritinghub.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/uxwritinghub.com\/content-design-systems\/#primaryimage","url":"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008.png","contentUrl":"https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008.png","width":1500,"height":1000,"caption":"Illustration of a person adding content to a web interface"},{"@type":"WebPage","@id":"https:\/\/uxwritinghub.com\/content-design-systems\/#webpage","url":"https:\/\/uxwritinghub.com\/content-design-systems\/","name":"All you need to know about content design systems - UX WRITING HUB","isPartOf":{"@id":"https:\/\/uxwritinghub.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/uxwritinghub.com\/content-design-systems\/#primaryimage"},"datePublished":"2021-06-25T12:06:13+00:00","dateModified":"2022-01-08T15:57:23+00:00","author":{"@id":"https:\/\/uxwritinghub.com\/#\/schema\/person\/09a8153c81f51a3ea050f4b3d5e122b2"},"description":"What is a content design system and how does it differ from a regular content style guide? You'll find out in this article.","breadcrumb":{"@id":"https:\/\/uxwritinghub.com\/content-design-systems\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/uxwritinghub.com\/content-design-systems\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/uxwritinghub.com\/content-design-systems\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/uxwritinghub.com\/"},{"@type":"ListItem","position":2,"name":"Everything you need to know about content design systems (and how they differ from content style guides)"}]},{"@type":"Person","@id":"https:\/\/uxwritinghub.com\/#\/schema\/person\/09a8153c81f51a3ea050f4b3d5e122b2","name":"Anja Wedberg","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/uxwritinghub.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/d4778be412a7978a4206e045a45416a6?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d4778be412a7978a4206e045a45416a6?s=96&d=mm&r=g","caption":"Anja Wedberg"}}]}},"tpgb_featured_images":{"full":["https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008.png",1500,1000,false],"tp-image-grid":["https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008.png",700,467,false],"thumbnail":["https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008-150x150.png",150,150,true],"medium":["https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008-300x200.png",300,200,true],"medium_large":["https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008-768x512.png",768,512,true],"large":["https:\/\/uxwritinghub.com\/wp-content\/uploads\/2021\/06\/Web-interfaces-and-design-systems-need-content-AdobeStock_166251008-1024x683.png",800,534,true],"default":"https:\/\/uxwritinghub.com\/wp-content\/plugins\/the-plus-addons-for-block-editor\/assets\/images\/tpgb-placeholder.jpg"},"tpgb_post_meta_info":{"get_date":"June 25, 2021","category_list":{"category":[{"term_id":59,"name":"Best practices","slug":"content-strategy","term_group":0,"term_taxonomy_id":59,"taxonomy":"category","description":"","parent":0,"count":122,"filter":"raw"},{"term_id":61,"name":"Content design","slug":"content-design","term_group":0,"term_taxonomy_id":61,"taxonomy":"category","description":"","parent":0,"count":19,"filter":"raw"},{"term_id":56,"name":"Resources","slug":"resources","term_group":0,"term_taxonomy_id":56,"taxonomy":"category","description":"","parent":0,"count":61,"filter":"raw"},{"term_id":57,"name":"Strategy","slug":"strategy","term_group":0,"term_taxonomy_id":57,"taxonomy":"category","description":"","parent":0,"count":9,"filter":"raw"}],"post_tag":[{"term_id":22,"name":"content design","slug":"content-design","term_group":0,"term_taxonomy_id":22,"taxonomy":"post_tag","description":"","parent":0,"count":10,"filter":"raw"},{"term_id":267,"name":"content design systems","slug":"content-design-systems","term_group":0,"term_taxonomy_id":267,"taxonomy":"post_tag","description":"","parent":0,"count":1,"filter":"raw"},{"term_id":91,"name":"content style guides","slug":"content-style-guides","term_group":0,"term_taxonomy_id":91,"taxonomy":"post_tag","description":"","parent":0,"count":3,"filter":"raw"},{"term_id":266,"name":"design systems","slug":"design-systems","term_group":0,"term_taxonomy_id":266,"taxonomy":"post_tag","description":"","parent":0,"count":1,"filter":"raw"},{"term_id":16,"name":"ux writing","slug":"ux-writing","term_group":0,"term_taxonomy_id":16,"taxonomy":"post_tag","description":"","parent":0,"count":13,"filter":"raw"}]},"author_name":"Anja Wedberg","author_url":"https:\/\/uxwritinghub.com\/author\/anja\/","author_email":"anjawedberg@gmail.com","author_website":"","author_description":"","author_facebook":"","author_twitter":"","author_instagram":"","author_role":["administrator"],"author_firstname":"Anja","author_lastname":"Wedberg","user_login":"Anja","author_avatar":"<img alt='' src='https:\/\/secure.gravatar.com\/avatar\/d4778be412a7978a4206e045a45416a6?s=200&#038;d=mm&#038;r=g' srcset='https:\/\/secure.gravatar.com\/avatar\/d4778be412a7978a4206e045a45416a6?s=400&#038;d=mm&#038;r=g 2x' class='avatar avatar-200 photo' height='200' width='200' \/>","author_avatar_url":"https:\/\/secure.gravatar.com\/avatar\/d4778be412a7978a4206e045a45416a6?s=96&d=mm&r=g","comment_count":2,"post_likes":0,"post_views":0},"tpgb_post_category":{"category":"<a href=\"https:\/\/uxwritinghub.com\/category\/content-strategy\/\" alt=\"Best practices\" class=\"category-content-strategy\">Best practices<\/a> <a href=\"https:\/\/uxwritinghub.com\/category\/content-design\/\" alt=\"Content design\" class=\"category-content-design\">Content design<\/a> <a href=\"https:\/\/uxwritinghub.com\/category\/resources\/\" alt=\"Resources\" class=\"category-resources\">Resources<\/a> <a href=\"https:\/\/uxwritinghub.com\/category\/strategy\/\" alt=\"Strategy\" class=\"category-strategy\">Strategy<\/a> ","post_tag":"<a href=\"https:\/\/uxwritinghub.com\/tag\/content-design\/\" alt=\"content design\" class=\"post_tag-content-design\">content design<\/a> <a href=\"https:\/\/uxwritinghub.com\/tag\/content-design-systems\/\" alt=\"content design systems\" class=\"post_tag-content-design-systems\">content design systems<\/a> <a href=\"https:\/\/uxwritinghub.com\/tag\/content-style-guides\/\" alt=\"content style guides\" class=\"post_tag-content-style-guides\">content style guides<\/a> <a href=\"https:\/\/uxwritinghub.com\/tag\/design-systems\/\" alt=\"design systems\" class=\"post_tag-design-systems\">design systems<\/a> <a href=\"https:\/\/uxwritinghub.com\/tag\/ux-writing\/\" alt=\"ux writing\" class=\"post_tag-ux-writing\">ux writing<\/a> "},"_links":{"self":[{"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/posts\/9431"}],"collection":[{"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/users\/25"}],"replies":[{"embeddable":true,"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/comments?post=9431"}],"version-history":[{"count":2,"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/posts\/9431\/revisions"}],"predecessor-version":[{"id":14275,"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/posts\/9431\/revisions\/14275"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/media\/9432"}],"wp:attachment":[{"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/media?parent=9431"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/categories?post=9431"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/uxwritinghub.com\/wp-json\/wp\/v2\/tags?post=9431"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}