Cookie Permissions and Design Guidelines to Respect Privacy Laws and User Experience

Cookie Permissions and Design Guidelines to Respect Privacy Laws and User Experience

What Are Cookies?

Cookies are small data files that a website sends to your browser and stores there. They keep track of your preferences, browsing history, and other interactions. Cookies help websites identify users over time.
Here’s why companies use cookies:

  • Personalized Experiences: Track user behavior and preferences to tailor experiences.
  • Analytics: Gather data on pages visited, time spent on each page, and user return frequency.
  • Convenience: Save login credentials or shopping cart items.
  • Marketing: Generate relevant ads and marketing content.
  • Integrations: Facilitate connections with third-party services used by websites.
  • User Profiling: Track user behavior across the web to create profiles based on demographics, behaviors, and interests.
  • What Are Cookie Permissions?

    Laws like GDPR, CCPA, and VCDPA give users control over how websites collect their data. Websites must get users' consent before storing, retrieving, or using data on their devices. Cookie permissions involve obtaining this consent.

    If your company operates in regions where cookie regulations apply, you must seek cookie permissions. These laws allow users to choose whether to accept cookies from categories like analytics, marketing, and third-party services.
    Reference: https://gdpr.eu/cookies/

    GDPR also requires users to actively opt-in to these cookies. This means cookies other than those strictly necessary can't be used until the user agrees. If a user ignores the cookie-permission request, it counts as opting out, and only essential cookies can be used.

    discover-content

    What Do Cookie Permissions Mean for Your Business?

    Although cookies can be beneficial to users, many are skeptical about the data collected and its use. Users often feel uneasy about being tracked by websites, and the unclear options provided don't help ease their concerns.

    Can you blame them? Often, cookie-permission designs don't respect users' choices. They can be confusing, difficult to navigate, or use manipulative tactics to encourage users to accept cookies. These practices do not build trust. Companies must balance collecting data for personalized user experiences with ethical practices. Simply having a cookie-permission box isn't enough.

    How Are Cookie Permissions Displayed?

    Cookie permissions can be shown in two main formats:

    1. Cookie-Permission Boxes: Large overlays that appear in the center or bottom of a page.
    2. Banners: Horizontal bars typically placed at the top or bottom of a page.

    Some websites allow users to accept different types of cookies, while others simply inform users that cookies are being used without offering options. Local laws will determine how detailed the cookie-permission request needs to be.

    accept-all

    Our Research

    To understand user experiences with cookie-permission interfaces, we conducted a qualitative usability study on both mobile and desktop platforms. This study involved 10 participants from various parts of the world. We examined a variety of cookie-permission designs from live websites, including some powered by third-party cookie-permission vendors. These vendors provide customizable templates that comply with regulations like GDPR.

    Common User Behaviors with Cookie Permissions

    Our study revealed that users' willingness to share data and their interactions with cookie permission options vary significantly. These behaviors often depend on the situation.

    For instance, some users choose the "Accept all" option only when they are in a hurry, but in other cases, they review the options more thoroughly. Here are the common user types we identified:

  • The Denier: Adjusts cookie settings every time to share as little data as possible, ideally denying all permissions
  • The Skeptic: Shares data only with familiar or trustworthy sites.
  • The Tech-Savvy: Selects "Accept all" but clears cookies later.
  • The Impatient: Selects "Accept all" to quickly remove the cookie overlay from the screen.
  • The Enthusiast Open to sharing data and prefers personalized ads.
  • Design Guidelines for Cookie-Permission Requests

    Our study found that people generally find cookie-permission requests annoying, regardless of how willing they are to share their data. The level of annoyance varies based on the size, placement, options presented, and other UI elements of the cookie-permission design.

    Based on our research, here are five key considerations for designing cookie-permission requests:

    1. Cookie-Permission Options
    2. UI Design Elements
    3. Scannability of Cookie Descriptions
    4. Placement of the Cookie Overlay
    5. Size of the Cookie Overlay

    Cookie-Permission Options

    1. Offer users clearly marked, easy-to-understand options for cookie selection, such as:
      • Accept all
      • Deny all / Select strictly necessary only
      • Manage settings

      Providing users with these options gives them control over their data. If companies fail to offer these choices, they risk losing users' trust, leading them to either leave the site or clear cookies immediately after use.

      wordpress-real-experts

      Users are becoming more aware of cookie permissions, and they notice when options are lacking. In our study, one participant encountered a cookie-permission box that only had an "Accept all" option, which can negatively impact user trust and experience

    2. Make cookie options easily accessible without requiring users to navigate through extra pages.
    3. On the Harper’s Bazaar website, users can't deny cookies until they click "Learn more." This button doesn't clearly indicate that additional options are available, making users think "Accept all" is their only choice and "Learn more" just explains the cookies used. Users prefer having options like "Accept all," "Manage settings," and "Deny" or "Strictly necessary only" immediately visible. This design builds trust by showing that the site isn't trying to force "Accept all" and allows quick access to site content.

      accept-bazaar

      Making cookie options immediately accessible is especially helpful on mobile devices, where screen space is limited, and users don't have to scroll or click extensively.

    4. Avoid using deceptive UI patterns that trick users into accepting cookies.
    5. Some companies use misleading UI designs to get users to accept all cookies. Here are some deceptive elements to avoid:

      • Unclear Toggle Switches: Labels like "Do not sell my information" that use double negatives and confuse users.
      • High-Contrast Buttons: Bright "Accept all" buttons designed to capture attention.
      • Ambiguous Close Buttons: An "X" or "Close" button that users may not understand whether it means "Accept all," "Deny all," or "Accept only necessary cookies".
      skill-here-days

      To avoid these issues, it's best to stay away from these confusing design patterns. If you include a "Close" button in your cookie-permissions overlay, ensure it only means "Accept only strictly necessary cookies."

      Making Cookie Descriptions Easy to Scan

    6. Use plain language
    7. Websites often have vague cookie options. Users should be able to quickly scan the different options and choose the one that suits them best.

      cricut

      Many users review cookie settings each time they visit a website to decide which ones to allow. To make this process easier, consider using bullet points with short descriptions instead of long paragraphs. This approach makes information more scannable.

      • Essential Cookies: Necessary for website functionality.
      • Performance Cookies: Collect data on site usage to improve performance.
      • Functionality Cookies: Remember user preferences to enhance the experience
      • Targeting Cookies: Track browsing habits to show relevant ads.
      • Social Media Cookies: Enable sharing on social platforms.
      welcome-cookies
    8. Placement and Size
    9. Minimize cookie overlay size to avoid covering page content.

      Participants in our study preferred small cookie-permission overlays that didn't block page access. Large cookie overlays were seen as intrusive and annoying. Some users wanted more information about the site before deciding on cookies. Companies sometimes place overlays in the center or make them large to ensure users make an informed decision. Others, using third-party cookie services, might not control overlay placement or size.

      dhl

      If your overlay is large and intrusive, provide clear and multiple options immediately so users can quickly decide on permissions and move on. A large overlay is especially frustrating when options are unclear.

    10. Avoid using multiple overlays that pop up as soon as a user lands on your site
    11. When different overlays like cookie permissions, newsletter signups, coupons, or chat features appear at the same time, it can overwhelm users. While users are becoming used to cookie-permission overlays, having multiple popups can be very annoying and may drive them away. Instead, think about placing some overlays in less intrusive spots, like the footer for newsletter signups, or delay showing certain overlays until after the user has accepted the cookies.

      As designers, we have a legal duty to clearly explain what happens to a user’s data and how it will be stored, based on business requirements. Geoffrey Keating, in his article "The Cookie Law and UX," highlights the regulations in Ireland. According to the Office of the Data Protection Commissioner, we must clearly communicate to users what they are consenting to regarding cookie usage, and provide a way for them to give or refuse consent.

      Consent must be "unambiguous" and "freely given," meaning it should clearly show the user's intentions. It must be an active choice by the user, and valid only if they have a real option to choose. Therefore, silent or pre-ticked checkboxes, or inactivity, do not count as consent.

      This might seem obvious, but some solutions take advantage of unclear legal areas. For example, sometimes a website visitor "automatically gives cookie consent by clicking a link on the website." Other times, certain actions are deemed "obvious enough" to be considered silent consent. Clearly, this is not an informed decision. Such techniques are misleading and should be avoided at all costs.

    Guidelines and Strategies for Better Design

    According to EU regulations, a privacy policy must clearly explain each cookie, including its provider, purpose, expiry date, and type. Many services, such as Trust Arc, IAB Consent Framework, Cookiebot, OneTrust, and Cookie Consent, offer this feature by default. These services also allow customization of which groups of cookies are presented to the user. While the default settings are generally user-friendly, they can sometimes make it unnecessarily difficult for users to adjust their cookie preferences.

    sourceforge
    sourceforge1
    sourceforge2

    At the end of the day, we need to create good experiences while also meeting our business goals. Here's how we can do that:

    1. Audit and categorize all cookies used on the site.
    2. Label each group, identifying which cookies are required and which are optional.
    3. Understand the impact of disabling each group on site functionality, and clearly communicate this to the user.
    4. Decide on the default settings and the customization options we want to offer users.

    The simplest design pattern is obvious. If you need user consent, display a narrow notification at the top or bottom of the screen. There's no need to blur or darken the content; just make sure the notification stands out. Include two clear buttons: "Okay" and "No, thanks" for accepting or rejecting cookies. If needed, offer an option to adjust settings, with a clear overview of cookie categories and their impact on the website. Allow users to "Approve all" or "Reject all" cookies for the entire site and each category.

    Where to place the notification? The position doesn't seem to matter much — it doesn’t affect user decisions. However, an overlay covering half the page is the most annoying option, as it blocks a large portion of the content. Users generally know what they’re dealing with and what action to take, so lengthy explanations are often ignored or dismissed quickly.

    How We Solved It: Blue IT Systems' Approach

    At Blue IT Systems, we specialize in creating seamless and intuitive user experiences. Our approach to privacy and cookie consent exemplifies our commitment to balancing user convenience with compliance. We believe in clear, straightforward solutions that respect user preferences while maintaining site functionality. Partner with us to enhance your website’s privacy UX. We bring expertise, innovation, and a user-centric approach to every project, ensuring your visitors have the best possible experience.

    Blue IT Systems, we recognized the need for a more user-friendly approach. Our team developed a streamlined cookie consent system that prioritizes clarity and ease of use. Here’s what sets our solution apart:

    • User-Centric Design
    • We put users first. Our cookie consent interface is designed to be intuitive, allowing users to easily understand their choices. Clear language and simple options ensure that users can make informed decisions without feeling overwhelmed.

    • Transparency and Control
    • Transparency is key to building trust. We provide detailed information on how cookies are used and give users control over their data. Users can opt in or out of different cookie categories with just a few clicks, enhancing their privacy without compromising their online experience.

    • Compliance with Regulations
    • Our solution is fully compliant with major privacy regulations, including GDPR and CCPA. This compliance not only protects users but also ensures that businesses avoid hefty fines and legal complications

      We’re proud of our achievements and the positive impact they’ve had on user privacy. Our commitment to innovation and excellence sets us apart in the tech industry. By choosing Blue IT Systems, you’re opting for a partner who values transparency, user experience, and compliance. Our solutions are designed to adapt to the ever-evolving digital landscape, ensuring that your business remains at the forefront of privacy protection. Join us in creating safer, more user-friendly internet.

    Conclusion

    Cookie-permission overlays should not only be about compliance. They offer a chance to build trust and create a positive experience for users. Blue IT Systems’ goal is to respect users’ privacy while also enhancing their experience on your website. By following these design guidelines, you can build lasting relationships with your users and boost brand loyalty. You can contact us for the cookie design, and we can help you from development, design to execution.

    Enhance your website's compliance and user experience today with Blue IT Systems' cookie consent solutions. Ready to improve your website’s cookie consent experience? Get in touch with Blue IT Systems for solutions that put your users first.

    Reference Links:

    https://www.termsfeed.com/blog/cookie-consent-examples/
    https://medium.com/@geoffreykeating/cookies-9f1270110597
    https://www.google.com/about/company/user-consent-policy-help/
    https://www.smashingmagazine.com/2019/04/privacy-ux-better-cookie-consent-experiences/