{"id":160893,"date":"2016-11-28T13:00:40","date_gmt":"2016-11-28T13:00:40","guid":{"rendered":"https:\/\/premium.wpmudev.org\/blog\/?p=160893"},"modified":"2019-04-25T21:02:06","modified_gmt":"2019-04-25T21:02:06","slug":"font-choices-wordpress-web-design","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/font-choices-wordpress-web-design\/","title":{"rendered":"Are Weak Font Choices Harming on Your WordPress Web Designs?"},"content":{"rendered":"<p>If there were such a thing as the Web Developer\u2019s Dictionary, you\u2019d probably find the word <em>typography<\/em> defined as \u201cThe bane of your existence.\u201d It seems silly really. How could something as small and seemingly innocent as a font cause so much turmoil in web design?<\/p>\n<p>Font choices, like everything else in web design, have a significant impact on the overall reception of a website. Tone. Balance. Flow. These are just some of the ways a poor font choice can have a negative effect on your website and throw everything else into disarray.<\/p>\n<p>If you\u2019re tired of relying on default font choices from WordPress themes and want to more effectively design <em>with<\/em> typography, read on for tips and tools that will enable you to do this.<\/p>\n<div  class=\"wpdui-pic-large   \" >\n<figure class=\"wp-caption aligncenter\" data-caption=\"true\"><img loading=\"lazy\" decoding=\"async\" class=\"attachment-1364x1364 size-1364x1364\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/typography-example.png\" alt=\"A great example of typography done right, courtesy of gearoid.io\" width=\"1364\" height=\"821\" \/><figcaption class=\"wp-caption-text\">A great example of typography done right, courtesy of gearoid.io<\/figcaption><\/figure>\n<\/div>\n<h3>Your Guide to More Effectively Using Fonts in Web Design<\/h3>\n<p>Let\u2019s start by addressing the obvious: <strong>there are way too many fonts out there<\/strong>. It seems like it would be more efficient to just use one of the default system fonts, right? While it would definitely be easier, it most likely would not be more effective \u2013 and I\u2019ll explain why.<\/p>\n<p>The words written on a website are the (digital) voice of a company or person.<\/p>\n<ul>\n<li>Rely on a font that looks like everyone else\u2019s and your site will get lost in the shuffle.<\/li>\n<li>Use a default font without giving it a second thought and people will see through it.<\/li>\n<li>Pick the wrong color and the relevant and insightful messaging may be too difficult to read.<\/li>\n<li>Choose a font that implies a fun-loving, carefree lifestyle and people might not take your buttoned-up business seriously.<\/li>\n<\/ul>\n<p>There is a lot at stake in the font choices you make. And because there are thousands of typography options to sift through, it\u2019s easy to feel overwhelmed. Let me assure you, though, once you understand your website\u2019s message, you\u2019ll better be able to answer a number of key questions that will narrow down those choices.<\/p>\n<p>Before you begin shaping and reinforcing your website\u2019s digital identity through the use of typography, keep in mind that this isn\u2019t about finding a single font to use site-wide. As you review the following tips and tools, consider the different types of text \u2013 and purposes \u2013 that you\u2019ll employ throughout your website, like:<\/p>\n<ul>\n<li>Hero image text<\/li>\n<li>Headlines<\/li>\n<li>Sub-headlines<\/li>\n<li>Body text for the internal pages<\/li>\n<li>Functional typography (like for CTAs)<\/li>\n<li>Logo type<\/li>\n<li>Navigation text<\/li>\n<li>Hyperlink text<\/li>\n<li>Form text<\/li>\n<\/ul>\n<p>As you can see, the choices you make in typography have far-reaching effects, so it\u2019s important to take this one at a time. Are you ready?<\/p>\n<h3>Tips for Narrowing Down Font Choices<\/h3>\n<p>Each of the following tips will provide you with guidance on making better, more effective choices in typography.<\/p>\n<h4>Tip 1: Co-mingle Your Fonts<\/h4>\n<p>When using different fonts on your website, think about how they\u2019ll work together. While too much contrast may not work, you do want a little tension to make the differences between text types striking enough to gain attention. Consider pairing fonts that strike a balance. They should be compatible, but not matching. Striking, but not off-putting.Here are some of<\/p>\n<p>Here are some of common pairing suggestions:<\/p>\n<ul>\n<li>Serif + sans serif<\/li>\n<li>Handwritten + script<\/li>\n<li>Thin font + heavy font<\/li>\n<\/ul>\n<div  class=\"wpdui-pic-large   \" >\n<figure class=\"wp-caption aligncenter\" data-caption=\"true\"><img loading=\"lazy\" decoding=\"async\" class=\"attachment-1364x1364 size-1364x1364\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/font-pairing.png\" alt=\"Typewolf is a fantastic resource for typgoraphy inspiration and resources.\" width=\"1364\" height=\"576\" \/><figcaption class=\"wp-caption-text\">Typewolf is a fantastic resource for typgoraphy inspiration and resources.<\/figcaption><\/figure>\n<\/div>\n<p><a href=\"https:\/\/www.typewolf.com\/\" target=\"_blank\">Typewolf<\/a> is my go-to resource for font pairings and design inspiration. I could spend hours flicking through this site!<\/p>\n<h4>Tip 2: Don\u2019t Overdo It<\/h4>\n<p>After going through this exercise, you may find that you\u2019ve got a solid list of 10 or more fonts that will work well for your website. But remember that too much of anything, especially in web design, can end up being bad for the <a href=\"https:\/\/wpmudev.com\/blog\/decluttering-communicating-effectively\/\" target=\"_blank\" rel=\"noopener\">user experience<\/a>.<\/p>\n<p>Keep your ultimate font picks to a minimum. Choose two or three different fonts, and then rely on different stylings to lend variety to different text types around the site.<\/p>\n<h4>Tip 3: Match Your Style<\/h4>\n<p>Font choice, while important, is probably going to be one of the last ones you make in designing a website. Once you\u2019ve created your site\u2019s aesthetics via colors, images, and white space, you\u2019ll need to find fonts that mirror that same styling.<\/p>\n<p>If you\u2019re not already in the habit of doing so, create a comprehensive, single-page style guide that lays out all your branding choices. This will help you better visualize what story your design choices tell about your brand\u2019s personality, too.<\/p>\n<div  class=\"wpdui-pic-large   \" >\n<figure class=\"wp-caption aligncenter\" data-caption=\"true\"><img loading=\"lazy\" decoding=\"async\" class=\"attachment-1364x1364 size-1364x1364\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/wordpress-colors-fonts.png\" alt=\"Wordpress.org features a style guide that sets out how the WordPress logo should look, as well as the colors and font used.\" width=\"860\" height=\"242\" \/><figcaption class=\"wp-caption-text\">WordPress.org features a style guide that sets out how the WordPress logo should look, as well as the colors and font used.<\/figcaption><\/figure>\n<\/div>\n<h4>Tip 4: Match Your Voice<\/h4>\n<p>Style and voice differ slightly when it comes to design. Style is about the overarching identity. This is why a law office would probably avoid using cursive fonts on their website. Voice, however, is more about the tone of your message.<\/p>\n<p>Does your voice convey a straight-forward, no-nonsense tone? Or does it lend itself to bigger, bolder phrasing? Every font has a built-in tone, so you\u2019ll need to make sure it matches your own.<\/p>\n<h4>Tip 5: Treat Your Home Page Fonts Like Images<\/h4>\n<p>Thanks to minimalism and parallax styling, home pages are no longer comprised of bulky paragraphs of text.<\/p>\n<p>Concise. Bold. Attractive.<\/p>\n<div  class=\"wpdui-pic-large   \" >\n<figure class=\"wp-caption aligncenter\" data-caption=\"true\"><img loading=\"lazy\" decoding=\"async\" class=\"attachment-1364x1364 size-1364x1364\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/a-list-apart.png\" alt=\"A List Apart's home page logo features text displayed in an unusual way.\" width=\"1364\" height=\"436\" \/><figcaption class=\"wp-caption-text\">A List Apart&#8217;s home page logo features text displayed in an unusual way.<\/figcaption><\/figure>\n<\/div>\n<p>That\u2019s what we\u2019ve all come to expect from home page copy these days. And, because of this, we can now have more fun with styling home page text. That doesn\u2019t mean the tips above should be ignored, but it does mean you can use larger typography, stylized typography, and typography strong enough to add on depth to an otherwise plain, open space.<\/p>\n<h4>Tip 6: Make size matter<\/h4>\n<p>Font size matters, not just for readability but also in terms of establishing hierarchy. The standard recommendation for the smallest acceptable font size (typically found in body text) is 16 pixels. If you have a font with tight kerning or that\u2019s thinner in style, consider starting with a larger pixel. Then be sure to amplify the header type sizes using that base size for reference.<\/p>\n<p>It\u2019s also important to keep in mind how font size will affect the length of the lines on each page (which can affect readability). Ideally, your font choice should result in between <a href=\"http:\/\/webtypography.net\/2.1.2\" rel=\"noopener\" target=\"_blank\">45 and 75 characters on each line<\/a>.<\/p>\n<h4>Tip 7: Be creative, but not too creative<\/h4>\n<p>Web design is always an exercise in control, isn\u2019t it? You\u2019ve got one idea in your head, you go a little crazy in laying it out (because everything looks so cool!), and then you need to rein it in. I\u2019d suggest you do the same with fonts. Feel free to be creative in the selection of your first batch of fonts. Then, when it comes time to narrow them down, find a nice blend between conservative and creative.<\/p>\n<h3>Tips for Using Fonts in Web Design<\/h3>\n<p>Each of the following tips will provide you with guidance on how to best use typography within your website\u2019s design.<\/p>\n<h4>Tip 8: Make Typography Responsive<\/h4>\n<p>When it comes to responsive design, there are a number of typography-related factors you should keep in mind:<\/p>\n<ul>\n<li>Minimum font size (no less than 16 pixels)<\/li>\n<li>Kerning<\/li>\n<li>Leading<\/li>\n<li>Padding around the page and sections<\/li>\n<li>Number of fonts used in a given space<\/li>\n<li>Number of font sizes used in a given space<\/li>\n<\/ul>\n<p>There\u2019s no need to go searching for \u201cresponsive\u201d fonts. What\u2019s important is that you design your website with cross-platform readability in mind. If you\u2019re interested in learning how to set up your CSS for <a href=\"https:\/\/www.smashingmagazine.com\/2016\/05\/fluid-typography\/&quot;\" rel=\"noopener\" target=\"_blank\">fluid typography<\/a> or <a href=\"https:\/\/www.smashingmagazine.com\/2015\/06\/responsive-typography-with-sass-maps\/\" rel=\"noopener\" target=\"_blank\">responsive typography settings<\/a>, Smashing Magazine has a couple tutorials worth checking out.<\/p>\n<h4>Tip 9: Consider the Color<\/h4>\n<p>Color is just as important for typography as it is in everything else in web design. When deciding which colors to use in your design, think about the following:<\/p>\n<ul>\n<li>Font colors should align with your color palette.<\/li>\n<li>If you look at this <a href=\"https:\/\/www.materialpalette.com\/\" rel=\"noopener\" target=\"_blank\">Material Palette picker<\/a>, you\u2019ll see their recommendations always include text color. These colors will always be a shade of black for easier readability.<\/li>\n<li>Use color consistently throughout your site. If one hyperlink is light blue, they should all be light blue.\u00a0This helps visitors learn your visual cues more easily.<\/li>\n<li>Don\u2019t be afraid to use contrasting colors between fonts as well as to contrast the other colors used on the site. This\u2019ll help hold visitors\u2019 attention better.<\/li>\n<li>Use color to demonstrate relationships, create a hierarchy, or draw the eye to the most important messages.<\/li>\n<li>Darker, bolder colors should be used for header text since those colors naturally draw the eye in.<\/li>\n<li>Lighter text can be used in the body, but it should still be heavy enough to read against the background.<\/li>\n<li>Avoid placing text on top of busy images, even if the \u201cbusy\u201d part is around the text. Unless you\u2019re positive the readability won\u2019t be disrupted on smaller screens, it\u2019s always safer to stay away from text-on-image design.<\/li>\n<\/ul>\n<div  class=\"wpdui-pic-regular  \">\n<figure class=\"wp-caption aligncenter\" data-caption=\"true\"><img loading=\"lazy\" decoding=\"async\" class=\"attachment-670x670 size-670x670\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/material-palette.png\" alt=\"Pick your favourite two colors and Material Palette provides suggestions for matching colors and primary text.\" width=\"670\" height=\"527\" \/><figcaption class=\"wp-caption-text\">Pick your favourite two colors and Material Palette provides suggestions for matching colors and primary text.<\/figcaption><\/figure>\n<\/div>\n<h4>Tip 10: Improve Scannability and Readability<\/h4>\n<p>According to a recent study about eye movements and reading behaviors on the web, only about <a href=\"https:\/\/www.nngroup.com\/articles\/how-little-do-users-read\/\" rel=\"noopener\" target=\"_blank\">20% of a web page gets read<\/a>. So rather than hope your visitors are not the norm, prepare for the worst and improve your copy\u2019s scannability by using &lt;ahref=&#8221;https:\/\/wpmudev.com\/blog\/wordpress-tags&#8221; target=&#8221;_blank&#8221;&gt;header tags (h2, h3, h4, etc.) for sub-headlines. By using bolder font choices in these headers, you\u2019ll make it easier for visitors to skip down to sections they want to read.<\/p>\n<h3>Resources to More Efficiently Find and Use Fonts<\/h3>\n<p>By now, you should have a good idea of the type of fonts that will work best for you. The next step is to identify those fonts and then put them to use in your site\u2019s design. Here are some tools to get you started:<\/p>\n<ul class=\"dev-tutorial-list\"><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">Easy Google Fonts plugin<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"171\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/Easy-Google-Fonts-600x171.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"Easy Google Fonts plugin image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>Google currently has over 800 fonts available for use. While you could go to\u00a0<a href=\"https:\/\/fonts.google.com\/\" target=\"_blank\">their website<\/a>\u00a0and sift through the font choices there, I\u2019d suggest you use the Easy Google Fonts plugin instead. This\u2019ll give you the ability to test out different Google fonts in real time on your website and give you an idea for how they\u2019ll look alongside your design.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in Easy Google Fonts plugin?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/easy-google-fonts\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">Font Squirrel<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"171\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/Font-Squirrel-600x171.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"Font Squirrel image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>If you do want to take some time looking around for the right fonts for your website, I\u2019d recommend you start with Font Squirrel. They may not have as many fonts as some of the other free font providers, but their offerings appear to be more expertly managed. They break out their fonts based on the types that matter most to designers (like serif vs. sans serif), so start here if you want to find your fonts more efficiently.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in Font Squirrel?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/www.fontsquirrel.com\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">FontStruct<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"171\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/FontStruct-600x171.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"FontStruct image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>For some of you, the vision you had for your site\u2019s fonts may not align with what\u2019s readily available online. It may also be that you\u2019d prefer to create a custom font that no one else has. If that\u2019s the case, you can use the free FontStruct font-building tool.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in FontStruct?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"http:\/\/fontstruct.com\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">Font Matcherator<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"171\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/Font-Matcherator-600x171.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"Font Matcherator image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>Let\u2019s say you\u2019ve got a photograph or an image containing cool-looking text in it, and you really want to know what font was used. While there is some design software that can help you identify that font, use the Font Matcherator tool instead. Simply upload the image containing the text and let the tool find the closest matching font for you.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in Font Matcherator?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/www.fontspring.com\/matcherator\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">Font Combinations<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"171\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/Canva-Font-Combos-600x171.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"Font Combinations image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>I\u2019m a big fan of anything Canva does. Most of their design tools are free to use and they\u2019ve done a pretty job at covering all your bases. So, it\u2019s no surprise that they\u2019d come up with this helpful \u201ctypography made easy\u201d font-pairing tool. This is good to use if you\u2019ve found one font that works well for your site, but aren\u2019t sure what to pair alongside it. This also works if you just want to check your fonts\u2019 compatibility.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in Font Combinations?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/www.canva.com\/font-combinations\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">Use Any Font plugin<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"171\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/11\/Use-Any-Font-600x171.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"Use Any Font plugin image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>Once you\u2019ve selected your fonts, the Use Any Font plugin will help you load those fonts into the system and start using them right away. The\u00a0<a href=\"https:\/\/wpmudev.com\/blog\/custom-fonts-css\" target=\"_blank\">alternative option<\/a>\u00a0is to add new fonts to your WordPress website using CSS.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in Use Any Font plugin?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/use-any-font\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><\/ul><!-- end dev-tutorial-list -->\n<h3>Wrapping Up<\/h3>\n<p>So what\u2019s the big lesson to take away from all this? There\u2019s no need to feel intimidated by the thousands of fonts available online. By using best practices and the right tools, it\u2019ll be a lot easier for you to find the perfect fonts and to use them in a way that will impress your visitors.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>If there were such a thing as the Web Developer\u2019s Dictionary, you\u2019d probably find the word typography defined as \u201cThe bane of your existence.\u201d It seems silly really. How could something as small and seemingly innocent as a font cause so much turmoil in web design? Font choices, like everything else in web design, have [&hellip;]<\/p>\n","protected":false},"author":344989,"featured_media":161098,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[263],"tags":[38,973],"tutorials_categories":[],"class_list":["post-160893","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","tag-design","tag-fonts"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/160893","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/344989"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=160893"}],"version-history":[{"count":8,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/160893\/revisions"}],"predecessor-version":[{"id":176173,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/160893\/revisions\/176173"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/161098"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=160893"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=160893"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=160893"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=160893"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}