{"id":24804,"date":"2021-05-27T23:18:36","date_gmt":"2021-05-27T15:18:36","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=24804"},"modified":"2021-11-23T22:29:24","modified_gmt":"2021-11-23T14:29:24","slug":"high-contrast-color-design","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/","title":{"rendered":"Using High Colour Contrast For More Accessible Design"},"content":{"rendered":"

A high bounce rate is frequently caused by the poor visual accessibility of a website<\/a>. When fonts are too small, or they are hardly legible, when there are too many distractions or not enough whitespace, many people just leave the site without a second thought<\/strong>.<\/p>\n

One of the most frequent reasons for early abandonment is the poorly selected colour schemes that decrease the readability<\/strong> of the content.<\/p>\n

According to the statistics of WHO<\/a>, there are about 285 million visually impaired people around the world, many of whom are partially or fully colour blind.<\/p>\n

Visual disabled people see colours differently, so avoiding low colour contrast<\/strong> in our designs is inevitable if we want to provide our customers with an accessible and user-friendly website.<\/p>\n

\"How<\/figure>\n

Web Standards For Colour Contrast<\/h3>\n

Colour contrast ratio<\/strong> measures the difference in contrast between two colours. The higher the value is, the easier it is to distinguish the object (text, image, graphic) in the foreground from the background.<\/p>\n

Colours can contrast in many different ways, such as in hue<\/strong>, value<\/strong> and saturation. <\/strong>Colour contrast ratio is calculated by a formula<\/a> provided by W3C, the main international standards organization for the World Wide Web.<\/p>\n

It can take a value between 1:1<\/strong> (no contrast at all<\/strong>, the foreground and the background have the same colour) and 21:1 <\/strong>(the maximum contrast<\/strong> that only exists between black and white).<\/p>\n

W3C\u2019s lastest Web Content Accessibility Guidelines (WCAG<\/a>) 2.0 provides web developers and content creators with benchmarks for the minimum (Level AA)<\/a> and the enhanced (Level AAA)<\/a> value of acceptable colour contrast ratio.<\/p>\n

Level AA requires at least 4.5:1 ratio for regular text<\/strong>, and 3:1 for large text<\/strong>. It\u2019s much easier to read large text like subtitles, that\u2019s why it needs a lower colour contrast.<\/p>\n

If you want to reach Level AAA which is the enhanced level, you need to design your colour scheme with a greater care, as it requires at least 7:1 contrast ratio for normal text<\/strong>, and 4.5:1 for large<\/strong>. If a text is part of a logo or a brand name, there\u2019s no minimum colour contrast requirement at either WCAG level.<\/p>\n

We can only call a website visually accessible if the colour contrast ratio between every foreground object and its background reaches at least Level AA.<\/strong><\/p>\n

\"Colours<\/figure>\n

Benefits of High Colour Contrast Ratio<\/h3>\n

By ensuring better readability you don\u2019t only engage visually impaired users, but also people who read your content on small screens<\/strong> such as on a smartphone or a smartwatch, among bad lighting conditions<\/strong>, and on lower quality monitors<\/strong>.<\/p>\n

People also read faster when there\u2019s higher contrast between the text and the background, so it will most likely take more time for them to get bored with the content of the site.<\/p>\n

If you worry that applying higher contrast ratio will have a negative impact on the aesthetics of your design, you need to check out the Contrast Rebellion<\/a> web project which proves, with real-life examples, that sticking to the high contrast ratio rules can still result in attractive and cool designs.<\/p>\n

\"Example<\/figure>\n
\"Example<\/figure>\n

Apps For Checking Colour Contrast<\/h2>\n

There are many great free tools all over the web that can help designers check the colour contrast ratio of their website.<\/p>\n

The easiest way of testing your design for colour contrast is to pick the main colours with either Photoshop or a suitable browser extension like this one<\/a> for Firefox, and copy the values into one of the apps below.<\/p>\n

The most important thing to remember is that you always need to compare the foreground colour such as text colour to its surrounding area<\/strong> (background colour).<\/p>\n

1. WebAim Colour Contrast Checker<\/h3>\n

WebAim (Web Accessibility In Mind) is an organization promoting web accessibility that offers developers a simple but reliable colour contrast checker<\/a> among many other great accessibility tools<\/a> such as Wave<\/a>, a general accessibility evaluation app that can help you quickly assess your site\u2019s accessibility issues<\/strong>.<\/p>\n

WebAim\u2019s Colour Contrast Checker tells you if your colours pass the WCAG AA and AAA tests<\/strong>, both for normal and large texts.<\/p>\n

\"WebAim<\/figure>\n

2. Snook Colour Contrast Check<\/h3>\n

Jonathan Snook, currently working as lead front-end developer at Shopify, has been hosting his handy colour contrast check tool<\/a> for over a decade. Snook\u2019s app allows you to change the HSL and RGB values<\/strong> of the foreground and background colour one by one by using convenient range sliders<\/strong> until you reach a result that is compliant with the WCAG 2.0 benchmarks.<\/p>\n

\"Snook<\/figure>\n

CheckMyColours<\/h3>\n

CheckMyColours created by Giovanni Scala allows you to check the colour contrast ratio of all foreground-background colour combinations on a live website<\/strong>.<\/p>\n

It calculates luminosity contrast ratio, brightness difference<\/strong>, and colour difference<\/strong>, and provides you with a full report about the results. CheckMyColours\u2019 report can significantly facilitate your understanding of how you can improve the visual accessibility of your site.<\/p>\n

\"CheckMyColours<\/figure>\n

Color Scheme Designer<\/h3>\n

Color Scheme Designer<\/a> is not particularly a colour contrast checker, but a tool for designing complete colour schemes<\/strong>.<\/p>\n

We include it in this collection, because it has a feature that allows you to see how your colour scheme is perceived by people with different types of visual disabilities.<\/p>\n

You can test your colours for full colour blindness, protanopy, deuteranopy, and many other visual impairments. The app has a newer version called Paletton<\/a> that makes even a more sophisticated vision simulation possible (you can also test for things like lousy LED display or weak CRT display).<\/p>\n

\"Color<\/figure>\n

W3C also provides you with a huge Web Accessibility Evaluation Tools List<\/a> where you can find many other colour contrast tools such as this helpful Accessibility Color Wheel<\/a>.<\/p>\n

Tips For Creating Visually Accessible Websites<\/h2>\n

If you want to create a visually accessible website<\/a>, it\u2019s always a good idea to avoid using colour alone to convey functionality or meaning<\/strong>. Icons that change their colour based on their current state are typical examples for this.<\/p>\n

If it\u2019s possible, always design additional visual cues<\/strong> that assist people who see colours differently in understanding functionality.<\/p>\n

Never forget to pay extra attention to the colour contrast of buttons, links and menus<\/strong>, as they are the means of navigation on your site. If users can\u2019t navigate easily on your site, you\u2019ll quickly lose them. Accessible colours for call-to-action buttons <\/strong>are also crucial for good conversion rates<\/strong>.<\/p>\n

It\u2019s a good workflow practice to test colour contrast ratio as early as possible in the design process as it will be hard to persuade your client to change the colour scheme of the site later on down the design process.<\/p>\n

Now Read:\n Practical Approach To Choosing Website Color Scheme<\/a><\/h3>\n
<\/a><\/figure>","protected":false},"excerpt":{"rendered":"

A high bounce rate is frequently caused by the poor visual accessibility of a website. When fonts are too small, or they are hardly legible, when there are too many distractions or not enough whitespace, many people just leave the site without a second thought. One of the most frequent reasons for early abandonment is…<\/p>\n","protected":false},"author":146,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[352],"tags":[3665],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"\nUsing High Colour Contrast For More Accessible Design - Hongkiat<\/title>\n<meta name=\"description\" content=\"A high bounce rate is frequently caused by the poor visual accessibility of a website. When fonts are too small, or they are hardly legible, when there\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Using High Colour Contrast For More Accessible Design\" \/>\n<meta property=\"og:description\" content=\"A high bounce rate is frequently caused by the poor visual accessibility of a website. When fonts are too small, or they are hardly legible, when there\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2021-05-27T15:18:36+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-11-23T14:29:24+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/high-contrast-color-design\/how-the-colourblind-see.jpg?newedit\" \/>\n<meta name=\"author\" content=\"Anna Monus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Anna Monus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/\"},\"author\":{\"name\":\"Anna Monus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/a601053a0ab457901e00cdc83bd5359e\"},\"headline\":\"Using High Colour Contrast For More Accessible Design\",\"datePublished\":\"2021-05-27T15:18:36+00:00\",\"dateModified\":\"2021-11-23T14:29:24+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/\"},\"wordCount\":1082,\"commentCount\":20,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/high-contrast-color-design\\\/how-the-colourblind-see.jpg?newedit\",\"keywords\":[\"Accessibility Design\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/\",\"name\":\"Using High Colour Contrast For More Accessible Design - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/high-contrast-color-design\\\/how-the-colourblind-see.jpg?newedit\",\"datePublished\":\"2021-05-27T15:18:36+00:00\",\"dateModified\":\"2021-11-23T14:29:24+00:00\",\"description\":\"A high bounce rate is frequently caused by the poor visual accessibility of a website. When fonts are too small, or they are hardly legible, when there\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/high-contrast-color-design\\\/how-the-colourblind-see.jpg?newedit\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/high-contrast-color-design\\\/how-the-colourblind-see.jpg?newedit\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/high-contrast-color-design\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Using High Colour Contrast For More Accessible Design\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/a601053a0ab457901e00cdc83bd5359e\",\"name\":\"Anna Monus\",\"description\":\"Anna is Technical Editor and Writer for Hongkiat.com. She mainly covers front-end frameworks, web standards, accessibility, WordPress development, and UX design.\",\"sameAs\":[\"https:\\\/\\\/www.annalytic.com\\\/\"],\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/anna_monus\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Using High Colour Contrast For More Accessible Design - Hongkiat","description":"A high bounce rate is frequently caused by the poor visual accessibility of a website. When fonts are too small, or they are hardly legible, when there","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:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/","og_locale":"en_US","og_type":"article","og_title":"Using High Colour Contrast For More Accessible Design","og_description":"A high bounce rate is frequently caused by the poor visual accessibility of a website. When fonts are too small, or they are hardly legible, when there","og_url":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2021-05-27T15:18:36+00:00","article_modified_time":"2021-11-23T14:29:24+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/high-contrast-color-design\/how-the-colourblind-see.jpg?newedit","type":"","width":"","height":""}],"author":"Anna Monus","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Anna Monus","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/"},"author":{"name":"Anna Monus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/a601053a0ab457901e00cdc83bd5359e"},"headline":"Using High Colour Contrast For More Accessible Design","datePublished":"2021-05-27T15:18:36+00:00","dateModified":"2021-11-23T14:29:24+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/"},"wordCount":1082,"commentCount":20,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/high-contrast-color-design\/how-the-colourblind-see.jpg?newedit","keywords":["Accessibility Design"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/","url":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/","name":"Using High Colour Contrast For More Accessible Design - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/high-contrast-color-design\/how-the-colourblind-see.jpg?newedit","datePublished":"2021-05-27T15:18:36+00:00","dateModified":"2021-11-23T14:29:24+00:00","description":"A high bounce rate is frequently caused by the poor visual accessibility of a website. When fonts are too small, or they are hardly legible, when there","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/high-contrast-color-design\/how-the-colourblind-see.jpg?newedit","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/high-contrast-color-design\/how-the-colourblind-see.jpg?newedit"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/high-contrast-color-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Using High Colour Contrast For More Accessible Design"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/a601053a0ab457901e00cdc83bd5359e","name":"Anna Monus","description":"Anna is Technical Editor and Writer for Hongkiat.com. She mainly covers front-end frameworks, web standards, accessibility, WordPress development, and UX design.","sameAs":["https:\/\/www.annalytic.com\/"],"url":"https:\/\/www.hongkiat.com\/blog\/author\/anna_monus\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-6s4","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/24804","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/146"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=24804"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/24804\/revisions"}],"predecessor-version":[{"id":58165,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/24804\/revisions\/58165"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=24804"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=24804"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=24804"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=24804"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}