{"id":65091,"date":"2021-05-05T12:36:00","date_gmt":"2021-05-05T19:36:00","guid":{"rendered":"https:\/\/blog.mozilla.org\/foxtail\/?p=65091"},"modified":"2021-08-06T14:37:06","modified_gmt":"2021-08-06T21:37:06","slug":"deceptive-design-patterns","status":"publish","type":"post","link":"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/","title":{"rendered":"What are deceptive design patterns?"},"content":{"rendered":"\n<p>Deceptive design patterns are tricks used by websites and apps to get you to do things you might not otherwise do, like buy things, sign up for services or switch your settings. Another phrase used to describe deceptive design patterns is <a href=\"https:\/\/www.darkpatterns.org\/\"><i>dark patterns<\/i><\/a>*, which was originally coined in 2010 by user experience specialist Harry Brignall, drawing attention to this practice and building momentum around calling it out. Brignall regularly <a href=\"https:\/\/twitter.com\/darkpatterns\">tweets<\/a> some of the worst examples of deceptive designs online and hands out kudos for honest user experiences.<\/p>\n\n\n\n<p>Deceptive design patterns show up as tricky color schemes, frustrating mazes, sneaky designs and confusing language. Websites use these techniques to influence your behavior into a direction that benefits them more than it benefits you. Here are examples of deceptive or manipulative designs you might run into.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Confusing design and language<\/h2>\n\n\n\n<p>You won\u2019t find deceptive designs on every website, but we\u2019ve all experienced confusing situations like:<\/p>\n\n\n\n<ul><li aria-level=\"1\">A \u201cNo thanks\u201d button that is pale grey but the \u201cSign me up\u201d button is enticingly bright blue.<\/li><li aria-level=\"1\">A box that is pre-checked, making it unclear if you are opting in or opting out if you uncheck it.<\/li><li aria-level=\"1\">A graphic that has an X-out box as part of the design rather than being functional. When you click the X, you are redirected to a webpage.<\/li><li aria-level=\"1\">A site that\u2019s swimming with so many buttons, you\u2019re almost bound to click one of them.<\/li><\/ul>\n\n\n\n<p>They may also appear in text taking the form of:<\/p>\n\n\n\n<ul><li aria-level=\"1\">Double negatives like <i>Do not uncheck this box if you want to keep receiving emails from us<\/i>.<\/li><li aria-level=\"1\">Buried opt-out explanations in the terms and conditions fine print.<\/li><li aria-level=\"1\">Hurdles for closing an account, like listing reasons you shouldn\u2019t instead of simply respecting your wishes.<\/li><li aria-level=\"1\">Word choices that make it unclear what you\u2019re choosing.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Sales pressure<\/h2>\n\n\n\n<p>Visiting an ecommerce site means you\u2019re going to be sold items, which everyone expects. There\u2019s a fine line, however, between straight-forward product recommendations and slimy sales techniques. Deceptive design patterns abound on shopping sites to manipulate you into buying or signing up for things. Tactics that might include:<\/p>\n\n\n\n<p><b>Cart sneaking<\/b>: Just like kids try to slip cookies into a grocery cart, some sites also sneak items to your shopping cart. It might be a warranty or protection policy that is easy to miss during check out.<\/p>\n\n\n\n<p><b>Fake customers<\/b>: Some sites try to boost sales by <a href=\"https:\/\/www.nytimes.com\/2019\/06\/24\/technology\/e-commerce-dark-patterns-psychology.html\">creating fake customers<\/a> to give the appearance that people are actively shopping there. Personally, I am deeply embarrassed about buying what looked like a stylish flowing duster jacket that <i>Tara from Nashville received and gave five stars one week ago<\/i>. The jacket had also been relentlessly promoted to me on social media, and I finally gave in only to receive an ill-fitting poncho that was neither flowy, nor a jacket, nor stylish in any way.<\/p>\n\n\n\n<p><b>Confirmshaming<\/b>: This is when a site tries to guilt or shame you into opting in. When you decline, they show you messages like: <i>You must be part of the \u201cI\u2019ll pay more club\u201d<\/i> or <i>No thanks, I already know everything there is to know.<\/i><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Software installation obstacle course<\/h2>\n\n\n\n<p>During a software installation process, sometimes you need to click through a series of windows that don\u2019t do anything in terms of installing the software. They give you the feeling of progress, but they\u2019re actually designed to get you to install extra \u201ctoolbars\u201d or trials of other software, but they\u2019re really disguised ads. The prompts are confusing, making the bonus software sound essential, but in general these design patterns lure people into adding \u2014 and even buying \u2014 services they don\u2019t want. Once they\u2019re installed they look like they\u2019re part of the system and are hard to remove.<\/p>\n\n\n\n<a class=\"ft-c-inline-cta\" href=\" https:\/\/blog.mozilla.org\/foxtail\/en\/products\/firefox\/your-browser-is-hijacked-now-what\/\">\n  <div class=\"ft-c-inline-cta__media\">\n  <img loading=\"lazy\" width=\"800\" height=\"800\" src=\"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2021\/05\/moz_explains_name_blog_header_1200x800-800x800.jpg\" class=\"attachment-1x1 size-1x1\" alt=\"\" decoding=\"async\" srcset=\"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2021\/05\/moz_explains_name_blog_header_1200x800-800x800.jpg 800w, https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2021\/05\/moz_explains_name_blog_header_1200x800-150x150.jpg 150w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>  <\/div>\n  <div class=\"ft-c-inline-cta__content\">\n     <h3>Related article<\/h3>      <span>Your browser is hijacked. Now what?<\/span>   <\/div>\n<\/a>\n\n\n\n<h2 class=\"wp-block-heading\">Forced continuity<\/h2>\n\n\n\n<p>Some subscription services offer a limited trial basis, which can be ideal for trying something new. But when they force you to hand over your credit card information to start the trial, their goal is to get you to pay automatically when the trial ends. That\u2019s a deceptive design pattern called forced continuity. A better customer experience would be to remind you and invite you to enroll after the trial period ends.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Opting in\u2026 forever<\/h2>\n\n\n\n<p>The \u201croach motel\u201d is another opt-in tactic dubbed as such because it opts you in and makes it nearly impossible to leave. If you\u2019ve ever gone round and round trying to downgrade from a premium-level account or found it took a lot of effort to close or cancel an account because the options were buried or you had to chat, verify and verify yet again, you\u2019ve clearly visited a roach motel.<\/p>\n\n\n\n<p>Most people expect that clicking a box opts them into a service or subscription. Some sites use that box as an opt-out, taking the approach that if a person should be opted in automatically. This trick is annoying, but mostly benign when it comes to an email newsletter; one can usually unsubscribe from newsletters fairly quickly.<\/p>\n\n\n\n<p>But opt-in tactics have also been used for election campaign fundraising at the cost of millions of dollars from the bank accounts of people who can\u2019t afford it.<\/p>\n\n\n\n<p>A <a href=\"https:\/\/www.zdnet.com\/article\/political-campaign-emails-contain-dark-patterns-to-manipulate-donors-voters\/\">Princeton research project<\/a> <a href=\"https:\/\/electionemails2020.org\/\">looked at thousands of emails<\/a> sent by political campaigns of both major parties and found that \u201cmanipulative tactics are the norm, not the exception.\u201d Asking donors to make regular gifts is reasonable; making that the default is not. For example, during the 2020 U.S. election cycle, the <a href=\"https:\/\/www.nytimes.com\/2021\/04\/03\/us\/politics\/trump-donations.html\">Trump campaign deployed deceptive design patterns<\/a> of pre-checked boxes to get recurring donations from many unsuspecting supporters.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Are deceptive design patterns illegal?<\/h2>\n\n\n\n<p>If manipulative and deceptive designs are so bad, why do we keep seeing them? The short answer is that they often work. Web and app designers who use these tricks knowingly capitalize on the fact that people have a tendency to skim webpages, click on appealing colors and not read the fine print. Their focus is on their bottom line, not yours.<\/p>\n\n\n\n<p>But, there is hope. Designers are learning and sharing more about <a href=\"https:\/\/digital.gov\/resources\/deceptive-design-how-to-identify-and-combat-consequence-design\/?dg\">spotting and combatting deceptive design<\/a>. State governments are also beginning to enact legislation to protect consumers. California recently <a href=\"https:\/\/oag.ca.gov\/news\/press-releases\/attorney-general-becerra-announces-approval-additional-regulations-empower-data\">expanded the California Consumer Privacy Act<\/a> to address the use of misleading practices when getting individuals\u2019 consent for data collection and processing.<\/p>\n\n\n\n<p><i>The newly-approved regulations ban so-called \u201cdark patterns\u201d that delay or obscure the process for opting out of the sale of personal information. Specifically, it prohibits companies from burdening consumers with confusing language or unnecessary steps such as forcing them to click through multiple screens or listen to reasons why they shouldn\u2019t opt out. [<\/i><a href=\"https:\/\/oag.ca.gov\/news\/press-releases\/attorney-general-becerra-announces-approval-additional-regulations-empower-data\"><i>Source<\/i><\/a><i>: California Attorney General]<\/i><\/p>\n\n\n\n<p><a href=\"https:\/\/iapp.org\/news\/a\/ongoing-dark-pattern-regulation\/\">More policy work to address deception in design<\/a> is happening on the U.S. federal level, with the <a href=\"https:\/\/www.ftc.gov\/news-events\/blogs\/business-blog\/2021\/02\/bringing-dark-patterns-light\">Federal Trade Commission<\/a> signaling that it\u2019s a priority for the agency.<\/p>\n\n\n\n<p>At the end of the day, the use of manipulation in web design erodes consumer trust and confidence in the internet ecosystem and is patently bad for people and the web. And it needs to go. Mozilla <a href=\"https:\/\/www.warner.senate.gov\/public\/index.cfm\/2019\/4\/senators-introduce-bipartisan-legislation-to-ban-manipulative-dark-patterns\">supports<\/a> federal legislation that has been introduced focused on banning such practices.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Firefox brings more clarity<\/h2>\n\n\n\n<p>Often the line between messages coming from a website or coming from the browser is blurred. The Firefox team designs experiences that are clear in their messaging and respectful of your time and attention. In our <a href=\"https:\/\/blog.mozilla.org\/en\/products\/firefox\/new-firefox-coming-june-1\/\">latest June release<\/a>, the user interface has been updated so that there is no mistaking when <a href=\"https:\/\/www.mozilla.org\/firefox\/?utm_source=blog.mozilla.org&amp;utm_campaign=firefox_frontier&amp;utm_medium=referral&amp;utm_content=mozilla-explains\">Firefox<\/a> is \u201ctalking to you\u201d vs the site you\u2019re on. Similarly, our notifications and messages make it clear that you have a choice to engage with them, and that using features should be a considered decision you make, not something we slip past you. Our products are designed to meet your needs and help you enjoy everything the web offers without trickery to get in your way.<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-subtle-light-gray-background-color has-background\"><tbody><tr><td><strong>*A note on words<\/strong> <br>You may notice we use &#8220;deceptive design patterns&#8221; rather than \u201cdark patterns\u201d throughout this article. While the latter is commonly used and has been for years, the phrase also reinforces the idea that being &#8220;dark&#8221; is &#8220;bad,&#8221; which is directly tied to white supremacy. In line with our <a href=\"https:\/\/blog.mozilla.org\/en\/mozilla\/first-steps-toward-lasting-change\/\">anti-racist commitments<\/a>, we are <a href=\"https:\/\/bugzilla.mozilla.org\/show_bug.cgi?id=1643142#c4\">moving away from using exclusionary language<\/a>, including metaphorical language that ties to white supremacy. We are instead choosing more factual terminology as other companies are <a href=\"https:\/\/contentdesign.intuit.com\/accessibility-and-inclusion\/abolish-racist-language\/\">doing as well<\/a>.<\/td><\/tr><\/tbody><\/table><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Deceptive design patterns are tricks used by websites and apps to get you to do things you might not otherwise do, like buy things, sign up for services or switch your settings. Another phrase used to describe deceptive design patterns is dark patterns*, which was originally coined in 2010 by user experience specialist Harry Brignall, [&hellip;]<\/p>\n","protected":false},"author":727,"featured_media":65092,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[461998],"tags":[],"coauthors":[311664],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>What are deceptive design patterns and how can you spot them?<\/title>\n<meta name=\"description\" content=\"Websites sometimes use deceptive design patterns, sometimes called dark patterns, to influence your behavior. Here&#039;s what to watch out for.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/\",\"url\":\"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/\",\"name\":\"What are deceptive design patterns and how can you spot them?\",\"isPartOf\":{\"@id\":\"https:\/\/blog.mozilla.org\/en\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2021\/05\/moz_explains_name_blog_header_1200x800.jpg\",\"datePublished\":\"2021-05-05T19:36:00+00:00\",\"dateModified\":\"2021-08-06T21:37:06+00:00\",\"author\":{\"@id\":\"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/5c987afc4f606be73692d2acfdd1316c\"},\"description\":\"Websites sometimes use deceptive design patterns, sometimes called dark patterns, to influence your behavior. Here's what to watch out for.\",\"breadcrumb\":{\"@id\":\"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/#primaryimage\",\"url\":\"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2021\/05\/moz_explains_name_blog_header_1200x800.jpg\",\"contentUrl\":\"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2021\/05\/moz_explains_name_blog_header_1200x800.jpg\",\"width\":1200,\"height\":800},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/blog.mozilla.org\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"What are deceptive design patterns?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/#website\",\"url\":\"https:\/\/blog.mozilla.org\/en\/\",\"name\":\"The Mozilla Blog\",\"description\":\"News and Updates about Mozilla\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/blog.mozilla.org\/en\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/5c987afc4f606be73692d2acfdd1316c\",\"name\":\"M.J. Kelly\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/image\/70718b02fa9f11d88288b937f1da2ac1\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/d61ff6a9eb6dd324df20cb773e6c416e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/d61ff6a9eb6dd324df20cb773e6c416e?s=96&d=mm&r=g\",\"caption\":\"M.J. Kelly\"},\"description\":\"Mozilla Communications\",\"url\":\"https:\/\/blog.mozilla.org\/en\/author\/mjkellymozilla-com\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"What are deceptive design patterns and how can you spot them?","description":"Websites sometimes use deceptive design patterns, sometimes called dark patterns, to influence your behavior. Here's what to watch out for.","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:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/","url":"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/","name":"What are deceptive design patterns and how can you spot them?","isPartOf":{"@id":"https:\/\/blog.mozilla.org\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/#primaryimage"},"image":{"@id":"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/#primaryimage"},"thumbnailUrl":"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2021\/05\/moz_explains_name_blog_header_1200x800.jpg","datePublished":"2021-05-05T19:36:00+00:00","dateModified":"2021-08-06T21:37:06+00:00","author":{"@id":"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/5c987afc4f606be73692d2acfdd1316c"},"description":"Websites sometimes use deceptive design patterns, sometimes called dark patterns, to influence your behavior. Here's what to watch out for.","breadcrumb":{"@id":"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/#primaryimage","url":"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2021\/05\/moz_explains_name_blog_header_1200x800.jpg","contentUrl":"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2021\/05\/moz_explains_name_blog_header_1200x800.jpg","width":1200,"height":800},{"@type":"BreadcrumbList","@id":"https:\/\/blog.mozilla.org\/en\/internet-culture\/deceptive-design-patterns\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/blog.mozilla.org\/en\/"},{"@type":"ListItem","position":2,"name":"What are deceptive design patterns?"}]},{"@type":"WebSite","@id":"https:\/\/blog.mozilla.org\/en\/#website","url":"https:\/\/blog.mozilla.org\/en\/","name":"The Mozilla Blog","description":"News and Updates about Mozilla","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blog.mozilla.org\/en\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/5c987afc4f606be73692d2acfdd1316c","name":"M.J. Kelly","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/image\/70718b02fa9f11d88288b937f1da2ac1","url":"https:\/\/secure.gravatar.com\/avatar\/d61ff6a9eb6dd324df20cb773e6c416e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d61ff6a9eb6dd324df20cb773e6c416e?s=96&d=mm&r=g","caption":"M.J. Kelly"},"description":"Mozilla Communications","url":"https:\/\/blog.mozilla.org\/en\/author\/mjkellymozilla-com\/"}]}},"_links":{"self":[{"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/posts\/65091"}],"collection":[{"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/users\/727"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/comments?post=65091"}],"version-history":[{"count":0,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/posts\/65091\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/media\/65092"}],"wp:attachment":[{"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/media?parent=65091"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/categories?post=65091"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/tags?post=65091"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/coauthors?post=65091"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}