The world of digital accessibility can be daunting. There are many regulations and ways in which a website can be accessible or inaccessible. Many of us don’t understand what a good or bad experience looks like, and we think we can’t possibly understand people who rely solely on assistive technology to use the web.
It doesn’t have to be daunting, though. And with anything, the key is to start small. To those who create websites or own/manage one, the first step to understanding accessibility is empathy. If more people used assistive technology, more people would understand the difference between a terrible experience and a great one. Don’t be scared of learning about accessibility tools, because you might already be more familiar with them than you realize.
Have you ever broken your dominant hand and been forced to use a keyboard instead of a mouse or trackpad? Have you tried to complete a payment form really quickly to snag concert tickets, and figured out that using the keyboard can be much faster?
Have you been in loud surroundings and tried to watch a video? How great are captions? Have you realized that captions are assistive technology? There are alternate modes of consuming content and using a digital product that are beneficial to a much wider audience than the audience it was created for.
With some instruction, we hope more people feel comfortable using a keyboard to navigate a website. We also hope that more of you are brave enough to try a screen reader as well, or at least watch our video to experience what that experience can be like.
Our video is 37 minutes and we provide a break-down of the different minute-marks below if you’d like to jump to a certain area. (All cookies must be accepted for the video to play. You may also view on YouTube directly.)
Table of Contents
- 00:00 — Using a Keyboard
- 02:00 — The tab key
- 02:20 — A “Skip to Content” link and why that is so useful
- 03:40 — “Focus ring” style
- 04:20 — An example of an inaccessible drop-down menu
- 05:40 — An example of an inaccessible link (no focus ring)
- 07:40 — Common article card patterns and how they work with a keyboard
- 10:45 — The Screen Reader Experience
- 11:10 — Invoking VoiceOver with Command F5
- 12:35 — Tabbing through interactive elements
- 12:54 — Skip to Content link
- 13:07 — Company logo
- 13:55 — Projects link
- 14:31 — Topics
- 15:55 — About Us link, inaccessible to keyboard users
- 16:16 — Reading of non-interactive elements with Control Option arrows
- 16:50 — Reading content, Headings, links
- 18:50 — Visually hidden heading but screen reader accessible
- 19:55 — Alt text image examples
- 20:06 — Kittens, no alt tag present
- 21:06 — Doggos, empty alt tag
- 23:00 — Squirrels, descriptive alt text
- 23:48 — Article content examples
- 23:53 — Article 1 example, too many links
- 25:37 — Article 2 example, too much content
- 26:32 — Article 3 example, hidden content
- 27:44 — Article 4 example, alternate pattern
- 30:02 — Voiceover’s Rotor Feature, control option U
- 30:15 — Headings menu
- 30:55 — Empty heading element
- 31:50 — Other Rotor menus
- 32:18 — Non-visited Links menu
- 33:01 — All Links menu
- 33:40 — “Click here” and “Read more” link text
- 35:09 — Landmarks menu
- 35:25 — Form Controls menu
- 36:06 VoiceOver off and wrap up
For those who want to learn a little more, below we collect a few keyboard command cheatsheets for navigating a webpage or using VoiceOver on a Mac. Links to additional resources for setting up and getting started with VoiceOver are also included.
Keyboard User Cheatsheet
- Tab key — Navigate from link to link
- For sighted users who can still use a mouse: Getting started on a page might mean clicking into the top left corner to get the keyboard focus to be within the browser window and not on the desktop or in the browser (URL bar)
- In a Checkbox list in a form, the tab key will move from one element to another
- Return key (Enter) — “Presses” a link to open the destination or perform the one page action (for buttons)
- When over an interactive element in a navigation, spacebar opens the element. Arrow keys may move up and down through the open list, or the tab key can be used. Spacebar again should toggle the element closed.
- In a Checkbox list in a form, the spacebar chooses the element currently in focus
- Escape key — Close most items that have been opened, like pop-up modal windows
- Arrows Up/Down — Generally, scrolls the page
- In a Radio Button group in a form, Tab will select the group of options while arrow keys will traverse the list
- With a Select list in a form, Tab makes the list active. Arrow keys traverses the list. Enter key selects the option in focus.
- Any letter key — With a Select list in a form, Tab makes the list active. When active and open, a letter key will jump to that letter in the list. Useful for long lists, like States or Countries.
These key commands reflect the default set-up for Mac OSX — I have not made any modifications. Of course, power users will modify these commands to fit their needs.
The default VoiceOver key command combination is ^Control ⌥Option. This combination is used to ensure key combinations do not conflict with other quick key commands through the OS and Apps.
Many key commands for navigating a webpage are the same as a Keyboard user. Return, Spacebar, and Arrow keys all work the same.
- ⌘Command F5 — Open and start Voiceover
- ^Control ⌥Option Arrow Right — Read next string of text
- ^Control ⌥Option Arrow Left — Read previous string of text
- ^Control ⌥Option Space — “Presses” a link or button
- For some elements, VoiceOver will announce that there are “Actions available.” Access the Actions menu with ^Control ⌥Option Space, and navigate the menu with the up and down arrow keys; press VO-Space to select a custom action.
- ^Control ⌥Option M — Access the Apple Menu (File, Edit, View, etc.). Escape Key returns to the web page content.
- ^Control ⌥Option H twice quickly — Commands Help menu
- While inside, arrow keys move up and down in lists. Left and Right arrows move from one list to another. Return key chooses an element from a list
- ^Control ⌥Option K — Keyboard Help. Similar to Command Help, but here, keys can be pressed without having any effect on the system (like a practice session). Escape key exits the Keyboard Help session
- ^Control ⌥Option U — Open the Rotor
- While inside, arrow keys move up and down in Rotor lists. Left and Right arrows move from one list to another. Return key chooses an element from a list, closes the Rotor, and moves focus to the selected element. Escape key exits the Rotor
- Traversing the page by Element Type:
- ^Control ⌥Option H — Find next heading
- ^Control ⌥Option L — Find next link (different from the Tab key as it will look for Links only, not buttons that perform on-page actions)
- ^Control ⌥Option J — Find next form control
- ^Control ⌥Option T — Find next table
- ^Control ⌥Option X — Find next list
- ^Control ⌥Option F — Find next frame
Additional Resources to Start Using VoiceOver
- Welcome to VoiceOver, Apple website
- Deep dive into using VoiceOver and customizing the system to work the way you prefer
With some practice, we hope you might find that using a keyboard to navigate can be your superpower. When filling out forms, for example, I use the keyboard almost exclusively to quickly move from one field to another and to find my state in a long drop-down list. Unless, of course, I run into another poorly coded form that is not accessible. Lucky for me, I can go back to using a mouse. But some do not have that option, and for them, our empathy should turn into empowerment and we shall demand better from our design and development practices.
For questions or to discuss how to make your next project more accessible, please contact us anytime.
More in Our Accessibility Series
Notable articles from the Accessibility category:
- Supporting Personal Safety: Best Practices with a Quick Exit Button
- Equity by Design with a new Inclusive Language Tool
- Redesign & Relaunch: Oomph’s Color Accessibility Tool for Designers gets a Redesign
- There is no Magic Wand: Plugins won’t fix accessibility
- Evolve your Best Practices: More Accessible HTML Forms
- Accessibility: Images, “Alt” tags, and the “Out Loud” Experience
- Accessibility is not only for Disabilities
There’s a new acronym on the block: MACH (pronounced “mock”) architecture.
But like X is to Twitter, MACH is more a rebrand than a reinvention. In fact, you’re probably already familiar with the M, A, C, and H and may even use them across your digital properties. While we’ve been helping our clients implement aspects of MACH architecture for years, organizations like the MACH Alliance have recently formed in an attempt to provide clearer definition around the approach, as well as to align their service offerings with the technologies at hand.
One thing we’ve learned at Oomph after years of working with these technologies? It isn’t an all-or-nothing proposition. There are many degrees of MACH adoption, and how far you go depends on your organization and its unique needs.
But first, you need to know what MACH architecture is, why it’s great (and when it’s not), and how to get started.
What Is MACH?
MACH is an approach to designing, building, and testing agile digital systems — particularly websites. It stands for microservices, APIs, cloud-native, and headless.
Like a composable business, MACH unites a few tried-and-true components into a single, seamless framework for building modern digital systems.
The components of MACH architecture are:
- Microservices: Many online features and functions can be separated into more specific tasks, or microservices. Modern web apps often rely on specialized vendors to offer individual services, like sending emails, authenticating users, or completing transactions, rather than a single provider to rule them all.
- APIs: Microservices interact with a website through APIs, or application programming interfaces. This allows developers to change the site’s architecture without impacting the applications that use APIs and easily offer those APIs to their customers.
- Cloud-Native: A cloud-based environment hosts websites and applications via the Internet, ensuring scalability and performance. Modern cloud technology like Kubernetes, containers, and virtual machines keep applications consistent while meeting the demands of your users.
Are You Already MACHing?
Even if the term MACH is new to you, chances are good that you’re already doing some version of it. Here are some telltale signs:
- You have one vendor for single sign-on (SSO), one vendor to capture payment information, another to handle email payment confirmations, and so on.
- You use APIs to integrate with tech solutions like Hubspot, Salesforce, PayPal, and more.
- Your website — or any website feature or application — is deployed within a cloud environment.
- Your website’s front end is managed by a different vendor than its back end.
If you’re doing any of the above, you’re MACHing. But the magic of MACH is in bringing them all together, and there are plenty of reasons why companies are taking the leap.
5 Benefits of MACH Architecture
If you make the transition to MACH, you can expect:
- Choice: Organizations that use MACH don’t have to settle for one provider that’s “good enough” for the countless services websites need. Instead, they can choose the best vendor for the job. For example, when Oomph worked with One Percent for America to build a platform offering low-interest loans to immigrants pursuing citizenship, that meant leveraging the Salesforce CRM for loan approvals, while choosing “Click and Pledge” for donations and credit card transactions.
- Flexibility: MACH architecture’s modular nature allows you to select and integrate individual components more easily and seamlessly update or replace those components. Our client Leica, for example, was able to update its order fulfillment application with minimal impact to the rest of its Drupal site.
- Performance: Headless applications often run faster and are easier to test, so you can deploy knowing you’ve created an optimal user experience. For example, we used a decoupled architecture for our client Wingspans to create a stable, flexible, and scalable site with lightning-fast performance for its audience of young career-seekers.
- Security: Breaches are generally limited to individual features or components, keeping your entire system more secure.
- Future-Proofing: A MACH system scales easily because each service is individually configured, making it easier to keep up with technologies and trends and avoid becoming out-of-date.
5 Drawbacks of MACH Architecture
As beneficial as MACH architecture can be, making the switch isn’t always smooth sailing. Before deciding to adopt MACH, consider these potential pitfalls.
- Complexity: With MACH architecture, you’ll have more vendors — sometimes a lot more — than if you run everything on one enterprise system. That’s more relationships to manage and more training needed for your employees, which can complicate development, testing, deployment, and overall system understanding.
- Challenges With Data Parity: Following data and transactions across multiple microservices can be tricky. You may encounter synchronization issues as you get your system dialed in, which can frustrate your customers and the team maintaining your website.
- Security: You read that right — security is a potential pro and a con with MACH, depending on your risk tolerance. While your whole site is less likely to go down with MACH, working with more vendors leaves you more vulnerable to breaches for specific services.
- Technological Mishaps: As you explore new solutions for specific services, you’ll often start to use newer and less proven technologies. While some solutions will be a home run, you may also have a few misses.
- Complicated Pricing: Instead of paying one price tag for an enterprise system, MACH means buying multiple subscriptions that can fluctuate more in price. This, coupled with the increased overhead of operating a MACH-based website, can burden your budget.
Is MACH Architecture Right for You?
In our experience, most brands could benefit from at least a little bit of MACH. Some of our clients are taking a MACH-lite approach with a few services or apps, while others have adopted a more comprehensive MACH architecture.
Whether MACH is the right move for you depends on your:
- Platform Size and Complexity: Smaller brands with tight budgets and simple websites may not need a full-on MACH approach. But if you’re managing content across multiple sites and apps, managing a high volume of communications and transactions, and need to iterate quickly to keep up with rapid growth, MACH is often the way to go.
- Level of Security: If you’re in a highly regulated industry and need things locked down, you may be better off with a single enterprise system than a multi-vendor MACH solution.
- ROI Needs: If it’s time to replace your system anyway, or you’re struggling with internal costs and the diminishing value of your current setup, it may be time to consider MACH.
- Organizational Structure: If different teams are responsible for distinct business functions, MACH may be a good fit.
How To Implement MACH Architecture
If any of the above scenarios apply to your organization, you’re probably anxious to give MACH a go. But a solid MACH architecture doesn’t happen overnight. We recommend starting with a technology audit: a systematic, data-driven review of your current system and its limitations.
We recently partnered with career platform Wingspans to modernize its website. Below is an example of the audit and the output: a seamless and responsive MACH architecture.
- Surveys/Questionnaires: We started with some simple questions about Wingspan’s website, including what was working, what wasn’t, and the team’s reasons for updating. They shared that they wanted to offer their users a more modern experience.
- Stakeholder Interviews: We used insights from the surveys to spark more in-depth discussions with team members close to the website. Through conversation, we uncovered that website performance and speed were their users’ primary pain points.
- Systems Access and Audit: Then, we took a peek under the hood. Wingspans had already shared its poor experiences with previous vendors and applications, so we wanted to uncover simpler ways to improve site speed and performance.
- Organizational Structure: Understanding how the organization functions helps design a system to meet those needs. The Wingspans team was excited about modern technology and relatively savvy, but they also needed a system that could accommodate thousands of authenticated community members.
- Marketing Plan Review: We also wanted to understand how Wingspans would talk about their website. They sought an “app-like” experience with super-fast search, which gave us insight into how their MACH system needed to function.
- Roadmap: Wingspans had a rapid go-to-market timeline. We simplified our typical roadmap to meet that goal, knowing that MACH architecture would be easy to update down the road.
- Delivery: We recommended Wingspans deploy as a headless site (a site we later developed for them), with documentation we could hand off to their design partner.
We later deployed Wingspans.com as a headless site using the following components of MACH architecture:
- Microservices: Wingspans leverages microservices like Algolia Search for site search, Amazon AWS for email sends and static site hosting, and Stripe for managing transactions.
- APIs: Wingspans.com communicates with the above microservices through simple APIs.
- Cloud-Native: The new website uses cloud-computing services like Google Firebase, which supports user authentication and data storage.
- Headless: Gatsby powers the front-end design, while Cosmic JS is the back-end content management system (CMS).
Let’s Talk MACH
As MACH evolves, the conversation around it will, too. Wondering which components may revolutionize your site and which to skip (for now)? Get in touch to set up your own technology audit.
You may call your site audience your “users,” but ultimately, they’re just people. Imperfect people with imperfect lives — sometimes to an extreme degree.
During the COVID-19 pandemic, there was a massive rise in domestic violence. This type of violence can take many forms, including technical abuse, where technology is used to control, harass, or intimidate someone. It can look different in various situations, from an abuser constantly sending phone or text messages to controlling the sites or devices their partner can access. Even sharing a store rewards phone number can have unintended consequences. The range of opportunities for abuse is endless.
In the book Design for Safety,” author Eva PenzeyMoog cites an NPR survey that found “85 percent of shelters they surveyed were helping survivors whose abusers were monitoring their activity and location through technology.” This is an alarming statistic. Domestic violence prevention isn’t something that is taught in schools — how would people know how to protect themselves before it’s too late?
As professionals creating digital products, it’s our responsibility to create “for good.” How can we be advocates for safety in design? According to Design for Safety, as an advocate, you must “support vulnerable users to reclaim power and control.” A website could have an easy-to-use interface but still provide pathways for users to experience abuse from domestic perpetrators. Ultimately, this leaves victims vulnerable while giving them a false sense that they have more control than they genuinely do.
During the website creation process, you should aim to design for safety. A key step is to identify “ways your product can be abused, then ways to prevent that abuse.” For example, to help address any abuse or harassment captured while on a call, Google Meet has the function to “report abuse.” You can attach a video clip when you report, and they will investigate and then take action on their end. By proactively planning around safety, your organization can deepen trust with users while doing your part to prevent domestic violence.
This past year, Oomph worked with a nonprofit website, which helps the general public understand their legal issues, to perform a user experience discovery and redesign. The site provides individuals with low incomes and limited English with local laws written in plain English. Users visit the site for legal information on various topics, including evictions, government benefits, domestic violence restraining orders and family law. A subsection of the audience uses the website to look for resources dealing with domestic violence.
When designing for this audience, we needed a way to support users who may need to exit a page quickly if they are interrupted by a potential abuser while scrolling through sensitive information, such as divorce or domestic violence resources. The site had previously utilized an “Escape” button on pages that dealt with those sorts of topics. When approaching the redesign, we wanted to ensure this button would always appear but wouldn’t interfere with other audiences, such as someone looking for information about traffic tickets. It had to walk a fine line between in-your-face and too subtle to be helpful to ensure users could see and interact with it.
When dealing with “trauma-informed” design, designers must “prioritize comfort over technological trends” (Design for Safety). Our challenge was amplified by a lack of standards for a quick exit button’s function, especially for a site with multiple audiences. Since these buttons are a relatively new best practice and little research on them exists, we were careful in our strategic approach. A quick exit button is not ingrained in a user’s mental model, making its intended action new to most people. Those who feel they might need it have to recognize its function as soon as possible.
Approach to the Quick Exit Button
While designing the quick exit button, we considered its placement, colors, and typographic style to ensure that:
- The button was easy to understand and used by people who needed it,
- The language was not retraumatizing,
- The button wasn’t so big and distracting that it took away from the overall experience of the site for those who didn’t need it, and
- The button’s position was easily accessible on a range of device sizes and types.
Our first wireframe called the button “Quick Exit.” When we tested the prototype, all five participants did not understand what the exit button meant. This emphasized how important the language on the button is. For those who have dealt with domestic violence, even the word “escape” could be harmful to hear. Additionally, since audiences view the website in different languages, we wanted to ensure that the button’s translation would not adversely affect the layout.
On our next iteration, we tried using the term “Exit” with the icon globally known for “external link.” But this still wasn’t clear enough for our users: Where would the exit bring you? To a page called “Exit”?
We needed to explain exactly what the button did, so we opted to use the universal external link icon with “Exit Site” as a label to best communicate what the button would do. Although it does not describe where you will end up, it clearly explains that you will leave the website.
To further help users understand what the button was for, we then created a pop-up at the start of the user’s journey that educates people on the button’s purpose:
Overall, there was a delicate balance we had to achieve in managing all audiences that typically view the site. We wanted to ensure that we were educating all users but not preventing users from getting help for other topics, such as information about the right to an education or disability. The pop-up, however, had additional considerations we needed to weigh as well: What if their abuser sees it upon landing? What if the user who needs it ignores it?
Additionally, when the user clicks the escape button (or uses the keyboard short-cut “Delete”), they are brought to a new tab that displays ABC News. The 1800victims site is changed to Netflix — with all traces of the CVRC gone. According to Columbia Health, this follows best practice because “a blank history can raise suspicion from your abuser.” This would be the safest approach for users.
Designing for Safety
We must consider how users dealing with domestic violence may feel when they are visiting a site with sensitive content. By including information to educate users upon landing, we can help more people understand how to use a quick exit button if they find themselves in a situation where they need to swiftly leave a website. As an advocate for user safety and domestic violence prevention, you can proactively create a safety net for others by starting to review your work through the lens of how it may be abused prior to releasing it into the world.
This article is just one look at how organizations can design for safety using a quick exit button. By talking about these issues and advocating to protect users in your own design process, we can all take a step toward helping prevent domestic violence. Even if one person is helped or informed by Oomph’s quick exit button design on the website, it will be a success in our eyes.
Need help incorporating safety-focused design into your website or mobile apps? Let’s chat about your needs.
Feel like you’re seeing a lot more website pop-up banners these days asking about your cookie preferences? Those cookie banners are here to stay, and they’re a vital part of compliance for websites of all sizes.
As global standards for consumer privacy and data protection continue to climb, businesses are burning more time and resources to keep up. One VentureBeat article pegged the cost for a business of maintaining data privacy compliance at an eye-popping $31 million — and the costs of non-compliance can be even higher. Failing to stay on top of this complex patchwork of regulations can trigger real consequences, from steep fines and penalties to the indirect costs of reputational harm and lost business.
Cookie consent is one part of a holistic data privacy strategy — and an increasingly important one. Global privacy laws, such as the General Data Protection Regulation (GDPR), California Consumer Privacy Act (CCPA), and Brazil’s General Data Protection Law (LGPD), require companies to inform visitors about the data collected on their website via cookies and provide them with granular choices about what they’re willing to share. Cookie consent management solutions help users manage cookie preferences when they enter your site, presenting a banner that informs users about how cookies are used and letting them decide which information (if any) they want cookies to collect.
Cookie consent management solutions are rapidly evolving to keep up with changing data privacy standards. CookiePro is a solution from OneTrust designed specifically for small to medium businesses, offering a more automated way to ensure website and mobile applications stay compliant with cookie consent and global privacy regulations. At Oomph, we’ve helped several clients integrate CookiePro into their sites in recent months and think it’s on track to become an industry standard for cookie consent management.
For organizations that are already juggling multiple site integrations, does it make sense to add another? To answer that, let’s take a look at why cookie consent matters, how a tool like CookiePro can help, and if it’s right for you.
Why Do I Need a Cookie Consent Solution?
To comply with privacy laws and provide a transparent experience that builds trust, many website owners are rethinking how they manage compliance. Adding a cookie consent tool to your website can improve the experience for you and your users.
Not taking data privacy seriously can cost you. In December 2022, Meta (the parent company of Facebook) agreed to pay $725 million to settle several class-action lawsuits that found Facebook had let third-parties access users’ private data and their friends’ data without user permission. Oracle has been sued for collecting 4.5 billion personal records from consumers who have specifically opted out of sharing, and Starbucks is potentially facing a lawsuit for continuing to “track customers ‘after they’ve declined all but required cookies.’”
While big-name companies get most of the bad press around data privacy, you don’t have to be a global enterprise to face similar consequences. In 2022, the total value of settlements for class-action lawsuits set a new record at $63 billion — and data breach and privacy class action settlements were among the top 10 settlement categories. Instead of risking a costly settlement, a much less expensive approach is to invest in a solution to help manage the work of compliance.
Beyond protecting your organization from legal action, demonstrating that you care about compliance helps your business build trust and long-term relationships with users. Data privacy is becoming more important to consumers of all ages, with 74% of people ranking data privacy as one of their top values.
A cookie consent solution lets users know that they’re in charge of their own data. It clearly discloses which information your business collects and uses, putting the power in their hands to control the data they share. If users want to change what they’re comfortable sharing later, they can easily update their settings. That level of transparency helps set the tone for your customer interactions, turning users into loyal brand advocates.
If your website serves users in multiple states or countries, keeping up with the patchwork of state, federal, and international laws is virtually impossible without software. Eleven states have unique data privacy laws in place right now, and 16 states introduced privacy bills during the 2022 to 2023 legislative cycle.
Factor in international regulations like GDPR, and it would take more hours than there are in a day to curate the individual preferences of your customer base. Plus, which of your team members is watching in case any regulations change? The most efficient approach is to use an automated cookie solution to curate consent requirements based on the user’s location and more.
What Is CookiePro?
Developed by OneTrust, which offers more robust data privacy solutions for enterprises, CookiePro started as a product in the OneTrust platform. After recognizing the need among small and medium businesses for a turnkey consent tool, OneTrust spun off CookiePro as a standalone solution.
CookiePro offers plans starting at around $40 per month, making it a budget-friendly alternative to enterprise solutions like OneTrust (or the cost of a lawsuit settlement). CookiePro comes with core compliance features like user-level consent management, acceptance customization, data mapping and recordkeeping, support for over 250 user languages, and additional security features.
After helping several of our clients implement CookiePro, there are a few key features that stand out for us:
- Easy installation: It just takes a few minutes to add a snippet of code to your website to enable CookiePro. It’s compatible with Drupal, WordPress, and other major site platforms.
- Automated cookie blocking: CookiePro’s auto-blocking tool scans your website to identify third-party tracking technologies, categorizes the cookies, and automatically blocks all cookies until users have given consent.
- Robust customizations: You can tailor your CookiePro banner to match your branding by customizing colors, content, and consent language. CookiePro also allows you to customize the user experience by choosing your consent approach and giving users granular control over their cookie settings.
- Upgrade path: Whether you have a small site or one with hundreds of thousands of visitors, CookiePro can support growing business needs. If you find that you need more support or functionality, you can upgrade to OneTrust’s Trust Intelligence Platform to unify all your data privacy management activities.
- Tag management system integrations: You can integrate tag management systems with your cookie consent solution if you use analytics and other platform tags on your website. CookiePro has integrations with many major tag management systems, including Google Tag Manager and Tealium, so you don’t have to change your current setup.
Beyond CookiePro, there are a growing number of other cookie consent solutions on the market, such as Termly and Cookiebot by Usercentrics. The right choice for you will depend on your existing tech stack, budget, and goals — the most important step is to put something in place to protect yourself and your users.
Where Should I Start?
Taking a proactive approach is key to ensuring data privacy for your users and avoiding costly consequences. Educate yourself on the different regulations and requirements, figure out the gaps in your compliance approach, and invest in tools that can help reduce risk and manual effort for your team.
Feeling overwhelmed or need a fresh perspective? Oomph’s accessibility and compliance audit is a great place to start. We can help you go beyond cookie consent to meet Web Content Accessibility Guidelines (WCAG), Americans With Disabilities Act (ADA), and other regulatory standards, helping you mitigate risk and deliver on user expectations. Reach out to us to schedule your site audit.
What’s been holding you back from migrating your website off of Drupal 7?
Maybe your brand is juggling other digital projects that have pushed your migration to the back burner. Maybe the platform has been working well enough that migration isn’t really on the radar. Or maybe (no shame here) you’ve been overwhelmed by such a massive undertaking and you’re feeling a little like Michael Scott:
We get it. Whether you’re migrating to a new version of Drupal or a different platform, it’s a time-consuming process — which means now is definitely the time to get started.
While the Drupal Security Team recently announced it would extend security coverage for Drupal 7 from November 2023 to January 2025, those extra 14 months are ideally the time to plan and execute a thoughtful migration. Giving yourself ample time to plan for life after Drupal 7 is something Oomph has been recommending for a while now, and we’re here to help you through it.
3 Reasons To Start Your Drupal 7 Migration Now
1. Because Migration Takes Time
Migrating your site isn’t as simple as flipping a switch — and the more complex your site is, the more time it can take. Imagine two boats changing course in the water: It takes a massive container ship longer to turn than a small fishing boat. If your site is highly complex or has a lot of pages, it could easily take a year to fully migrate (not including the time it takes to select a partner to manage the process and kick off the work).
Even if your site isn’t so robust, you’ll do yourself a favor by building in a time buffer. Otherwise, you could risk facing a security gap if you run into complications that slow the process down. Some of the major factors that can impact timeline include:
- Developing a new site theme. The switch from the PHP Template Engine in Drupal 7 to Twig in Drupal 8 and above means you’ll need to rewrite your custom theme if you’re planning to upgrade to Drupal 10 — even if you’re not planning to redesign your site.
- Navigating custom code. If your current site relies on custom code, those modules will need special attention during the migration process.
- Migrating community-contributed modules. One of the best things about Drupal is the fact that it’s open-source, which means community members are constantly contributing new modules and features that anyone can use. While many Drupal 7 modules have a simple migration path to Drupal 10, not all do. Certain modules, including Organic Groups, Field Collections, and Panels, will need to be reviewed and migrated manually. Even if a module has a set migration path, it can be quicker to migrate them by hand (Webforms and Views are two good examples).
- Making other upgrades. You know the old saying, “Never let a good migration go to waste?” (OK, we made that up.) Still, a migration is a smart time to tackle other changes to your site, from updating your information architecture to modernizing your design. If you’re planning on a more holistic site update, there’s even more reason to start now to make sure your project is wrapped before the end of 2024.
2. Your Site Performance Is Less Than Ideal
Yes, Drupal 7 sites technically have security coverage until 2025. But if you’re still on Drupal 7, you’re missing out on the best that Drupal currently has to offer.
First, Drupal 7 is not fully compatible with PHP 8, a new and improved version of PHP that many websites are built on today. While Drupal 7’s core supports PHP 8, some contributed modules or themes on your site might not, which could create hiccups in your site performance.
In addition, the Drupal community is constantly putting out new features that aren’t available on Drupal 7. Some of the most exciting ones include:
- Layout builder, a visual design tool that makes it easier for content editors to build web pages and gives designers more room to flex their creative muscles.
- Workspaces, an experimental feature that allows users to stage content or preview a full site by using multiple workspaces on a single site.
- Better accessibility and responsive design to create genuinely useful experiences for all site users.
- API-first architecture and decoupled options to make it easier to integrate your site with any other tools or functionality you need.
- Twig, a templating language from Symfony that lets you write concise, readable templates that are more friendly to web designers.
- SaaS offerings like Acquia’s Site Studio to build beautiful pages more easily.
Sticking with Drupal 7 means not only missing out on this new functionality, but also on support from the Drupal community. Interest and activity from web devs on Drupal 7 continues to wane, which means your team may find it harder to get help from others to deal with bugs or other issues. You’re also likely to see fewer new features that are compatible with the older version – so while other sites can keep up with the evolving digital landscape, a Drupal 7 site is increasingly stuck in the past.
3. To Save Your Team’s Sanity
Odds are good that if your site is still running on Drupal 7, your team is already having trouble trying to make it work for your needs. Starting your migration now is key to getting your site running as smoothly as soon as possible — and sparing your team from unnecessary misery.
Consider these pain points and how your team can address them in your migration:
- Is your team frustrated with aspects of Drupal 7 that limit your site’s functionality?
- Is technical debt making your site maintenance more complicated, expensive, or both? Could it be affecting your hosting or vendor costs?
- Is your team struggling to find support or third-party integrations that work with the platform?
- Are they holding off on major new initiatives because the site can’t support them?
Options for Life After Drupal 7
Now that Drupal 7 is officially winding down, what’s next for your website? Deciding whether to go Drupal-to-Drupal, Drupal to another CMS, or a different route entirely depends on your technical needs and resources.
If Drupal 7 has served your team well in the past, then Drupal 10 is the logical choice. The newest version of Drupal is ideal for more complex sites with extensive content modeling, varying user roles, and workflow requirements. To make things easier, you can leapfrog over Drupal 8 and 9 and migrate your Drupal 7 site directly to the latest and greatest version.
Many of our clients at Oomph are going this route, since Drupal 10 offers both a range of new features and familiarity for Drupal-versed teams to cut down on the post-migration learning curve.
WordPress or Another CMS
Not sure if Drupal 10 is the best fit? If your site is on the small side or if you don’t require lots of functionality, then Drupal may be more than you really require.
In that case, moving off of Drupal altogether might be in your best interests, helping you streamline your ongoing development needs and reduce maintenance and hosting costs. Here are a few alternatives for Drupal 7 users looking for a less robust platform without sacrificing a great web presence:
- Consider a headless CMS, supported by a decoupled framework such as Gatsby or Next.js.
An Internal Stopgap
Depending on your organization, now might not be a good time to migrate or rebuild your site. This is especially true if you’re already invested in an ongoing site redesign or rebuild. If you’re still trying to figure out your digital future, consider temporary measures you can take to stay protected once Drupal 7’s security coverage ends.
One possibility to consider is rolling up your site under another digital property in your organization. Even if it’s only an interim solution, it can help you buy time to make the best long-term plan for your website. Another option would be to develop a smaller static website with a refreshed design that would eventually be replaced with the upgraded CMS.
Tips for a Successful Migration
As your site’s technical foundation, Drupal delivers plenty of horsepower. However, the digital home you build on that foundation is what really counts. It’s crucially important to make sure all the pieces of your site work together as one — and a migration is a perfect opportunity to assess and optimize.
Over time, websites tend to accumulate “cruft” — the digital equivalent of dust and cobwebs. Cruft can take many forms: outdated, unnecessary, or poorly written code; deprecated site features; or obsolete or outdated content, files, and data. Whatever cruft exists on your site, migration is a chance to do some digital spring cleaning that can improve site performance and reduce maintenance time.
Beyond digital hygiene, evaluating each element of your site strategically can help you get the greatest business value from your migration.
- Information architecture: How easy is it to navigate around your site? Do your sitemap and information architecture still reflect your offerings and user needs accurately?
- Content: Does your site’s content still engage your audience and support business goals? Think about the impact of any changes to your information architecture: Would they require you to add, change, or remove content?
- Design: Will your existing site design work with the CMS you’ve chosen? Does it need updates to meet current standards for UX, accessibility, and responsiveness?
- Integrations: Should you add or remove any APIs or integrations? Keep in mind that many features not available in Drupal 7 are now built into the core of Drupal 10 or are available as contributed modules, so you may be able to optimize some of your site’s key features.
No matter what you plan to tackle alongside your migration, it’s a big project. An experienced guide can make all the difference. Our team of die-hard Drupal enthusiasts has led many Drupal-to-Drupal and replatforming projects for clients, including complex e-commerce and intranet sites. For us, a successful migration is one that’s grounded in strategy, follows technical best practices, and — most importantly — can support and evolve with your brand over time.
Need a hand deciding which route to take for your Drupal 7 migration? We’d love to talk.
Finding yourself bogged down with digital analytics? Spending hours just collecting and organizing information from your websites and apps? Looker Studio could be the answer to all your problems (well, maybe not all of them, but at least where data analytics are concerned).
This business intelligence tool from Google is designed to solve one of the biggest headaches out there for marketers: turning mountains of website data into actionable insights. Anyone who’s ever gone down the proverbial rabbit hole scouring Google Analytics for the right metrics or manually inputting numbers from a spreadsheet into their business intelligence platform knows that organizing this data is no small task. With Looker Studio, you can consolidate and simplify complicated data, freeing up more time for actual analysis.
With so many customizable features and templates, it does take time to set up a Looker Studio report that works for you. Since Google’s recent switch from Universal Analytics to Google Analytics 4, you might also find that certain Looker Studio reports aren’t working the way they used to.
Not to worry: Our Oomph engineers help clients configure and analyze data with Looker Studio every day, and we’ve learned a few tips along the way. Here’s what to know to make Looker Studio work for your business.
The benefits of using Looker Studio for data visualization and analysis
Formerly known as Google Data Studio, Looker Studio pulls, organizes, and visualizes data in one unified reporting experience. For marketers who rely heavily on data to make informed decisions, Looker Studio can save precious time and energy, which you can then invest in analyzing and interpreting data.
Key benefits of using Looker Studio include:
- Connecting data from multiple sources: The platform can unify data from a mind-boggling 800+ sources and 600+ data connectors, which means you can upload and integrate multiple data sets into one comprehensive report. This not only saves time, but also provides more accurate insights into business performance for organizations with complex digital environments.
- User-friendly insights: Looker Studio’s visual dashboards are easy to interpret, customize, and share – even with executives who might not be as digitally fluent as you. You can choose from a variety of drag-and-drop data visualization options, such as charts, graphs, and tables, or use Looker Studio’s pre-designed visualizations.
- Powerful customization: Want to be informed the minute your form conversion rate changes? With Looker Studio, you can set up alerts to notify you of significant changes in your data, enabling you to adjust your marketing strategy and optimize ROI in real time. You can also generate reports to track your progress and share them with your clients or team members.
How Oomph uses Looker Studio
As a digital-first company in the business of helping other digital-first companies, we’re big fans of Looker Studio. We think the platform is a great way to share trends on your websites and apps in an easy-to-digest way, making monthly or quarterly reporting much more efficient.
Whether you’re looking for basic insights or need sophisticated analysis, Looker Studio’s visualization capabilities can support smarter, more informed digital decision-making. Here’s a peek at some of the metrics we monitor for our own business, including:
- Number of users
- New users versus returning users
- Average time spent on site and on page
- Top pages viewed
- Traffic sources
- Traffic by device
- Event tracking and conversion rates
We also use the platform to drill deeper, comparing trends over time, identifying seasonal fluctuations and assessing the performance of specific campaigns. We leverage features like dashboards and filters in Looker Studio to give our clients an interactive view of their data.
How Looker Studio Works With GA4
Google Analytics, now known as GA4, is one of the primary tools we connect to Looker Studio. GA4 is the latest version of Google’s popular analytics platform and offers new features and functionality compared with its predecessor, Universal Analytics (UA), including new data visualization capabilities.
As many companies migrate over to GA4, they may be wondering if reporting will be similar between GA4 and Looker Studio – and if you need both.
While GA4 reports may challenge Looker Studio’s capabilities, Looker Studio provides a variety of features that go beyond what GA4 can do on its own. While GA4 dashboards and reports just include GA4 data, Looker Studio can import data from other sources as well. This means you can use Looker Studio to track trends in your site’s performance, regardless of the data source.
Looker Studio also has a unique feature called “LookML,” which allows users to create custom data models and transformations. This means you can tailor your data to your specific needs, rather than being limited by GA4’s built-in reporting. Finally, Looker Studio’s robust sharing and collaboration features allow teams to share data and insights easily and efficiently.
If your company set up Looker Studio before switching to GA4, you may notice a few metrics are now out of sync. Here are a few adjustments to get everything working correctly:
- Average time on page: This was previously a standard feature in UA that’s no longer available in GA4. To configure, you’ll need to track the “user engagement” metric divided by “number of sessions.”
- Bounce rate: Tracking bounce rate with GA4 now takes an additional step as well. To configure, subtract the “engagement rate” metric from 1 to arrive at your bounce rate.
- Events: Simply update your Looker Studio connection settings to use the new GA4 event schema and ensure that you’re using the correct event names and parameters in your LookML code.
How To Set Up a Looker Studio Report
- Choose a template for your dashboard or create one from scratch. If you’re not sure, you can browse through templates to get an idea of what Looker can do.
- Connect your data source. Looker supports a long list of sources, including Google, MySQL, AWS Redshift, and more. Don’t worry if your data isn’t in Google – Looker will likely be able to connect to it regardless.
- Choose your metrics. These are the specific data points you want to track and analyze in your report. You can customize your metrics to fit your specific needs.
- Build your dashboard. You can add charts, tables, and other visualizations to help you understand your data. Looker makes it easy to drag and drop these elements into place.
- Share it with others. You can either create a share link so that others can access the dashboard directly or you can set up automatic updates to be sent on a regular basis. This makes it easy for others to stay up-to-date on changes and progress.
A Powerful Path To Data Insights
The digital landscape is growing more fragmented and complex by the day, but tools like Looker Studio make it infinitely easier to find your path forward. Taking the time to configure and customize the platform can deliver major ROI by helping you understand user needs, pinpoint website strengths and challenges, and craft the right digital strategy.
Crunched for time or not sure where to start? Oomph can help take the hassle out of data analysis by setting up and monitoring your Looker Studio dashboards. Get in touch to chat about your needs.
It’s been over a year since we joined 1% for the Planet, becoming part of a global network of businesses committed to putting the planet and people over profit. Joining the community was a longtime dream for Oomph, and it’s honestly been a blast so far.
We spent Year 1 building bridges, flexing our strategy skills, and investing in sustainable businesses to meet our commitment as a whole company — donating 1% of our gross annual sales to environmental causes. We learned a ton, and we pinpointed a few things we could do better. Now that Year 2 is in full swing, here’s how we’re making our membership even more impactful.
Keeping Our Dollars Local
As a 1% for the Planet member, at least half of our 1% donation must come through monetary donations. During our first year, we put our dollars toward Planet Impact Fund, a donor advised fund that invests in promising for-profit climate solutions and makes grants to nonprofit environmental partners.
While we loved working with Planet Impact Fund (which also just celebrated its first year!), we’re expanding our approach in Year 2. Making our work personal is one of our core values as a company, and we wanted to bring that value into our giving by distributing some of our funds directly in the communities where our teammates live. We asked our team to nominate local organizations doing environmental work, and the ideas are already pouring in. Here are a few worthy causes we’re proud to support this year (all links are to the 1% for the Planet directory):
- Audubon Society of Rhode Island: A local chapter of the National Audubon Society focused on protecting birds and other wildlife through conservation, education, and advocacy.
- Ausable River Association: An organization located in Wilmington, New York, in the northern Adirondack mountains, which focuses on engaging the community to protect the Ausable watershed to maintain clean water, healthy streams, and biodiverse habitats, while supporting responsible low impact public enjoyment of the area.
- Buzzards Bay Coalition: An organization in New Bedford, Massachusetts, focused on protecting clean water in Buzzards Bay and the surrounding land.
- Explore Ecology: An environmental education and arts nonprofit located in Santa Barbara, California, that focuses on inspiring children to engage with the natural world and experience the value of environmental stewardship.
- Maine Needs: A grassroots organization in Portland, Maine focused on providing for the material needs of people in their community through donated goods.
- New England Mountain Biking Association (NEMBA): A mountain biking community in New England focused on creating responsible trail stewards to preserve open space while providing epic riding experiences.
- Southside Community Land Trust: An organization located in Providence, Rhode Island, whose gardens, farms, and programs enable all Rhode Islanders to grow and enjoy healthy food.
- Surfrider Foundation Cape Fear: A local chapter of the national Surfrider Foundation focused on the protection and enjoyment of the world’s oceans, waves, and beaches for all people.
- Urban Harvest STL: An urban farming organization located in Saint Louis, Missouri, that is helping to provide equitable access to healthy food and the ability for people to grow it themselves if they want to.
- Westport River Watershed Alliance: An organization located in Westport, Massachusetts, focused on protecting the local watershed through science, advocacy, education, and community outreach.
Focusing on Deeper Impact With In-Kind Partnerships
Collaborating with the Nature Conservancy’s Rhode Island chapter on a full-day strategy sprint was so much fun for our team. Without an ongoing partnership, though, it can be tough for an organization like the Nature Conservancy to translate this type of strategy into a full-fledged digital build solo.
That’s why we’re shifting our focus in Year 2 to a longer-term project for a partner doing environmental work. We believe that by delivering a tangible end result, like a refreshed website or app, we can more fully live out our commitment to elevate our clients and make a meaningful difference for our planet. Our team is currently evaluating project opportunities with our environmental clients – let us know if you have one in mind!
Continuing Our Commitment Through Community
Since we joined 1% for the Planet, we’ve been amazed by the passion and expertise across the member community. Not only are these organizations invested in growing their own impact for the environment, they’re dedicated to challenging and encouraging one another to do the same – from working with more B Corp service providers to finding ways to reduce their carbon footprint.
Being surrounded by this kind of unflagging enthusiasm has been one of the biggest and most unexpected benefits of becoming a member. We’re all in on advancing environmental justice with everything we do, and we can’t wait to see what our collective efforts can accomplish for our planet and all its people.
Want to join a team that shares your commitment to creating a sustainable world?
Humans encounter thousands of words every day. As a website owner, that means your site content is vying for your user’s attention alongside emails from their colleagues, the novel on their nightstand, and even the permission slip scrunched at the bottom of their kid’s backpack.
How do you cut through the clutter to create site content that people actually want to read?
While you may already be choosing topics that are the most interesting and relevant for your audience, the structure of your writing may not be optimized for how people read. By understanding your audience’s reading behaviors following best practices for readability and accessibility, you can make sure your content works with people’s natural tendencies – not against them – to create a more engaging digital experience. An added bonus: Google shares many of those same tendencies, so content that’s designed well for humans is also more likely to perform well for organic SEO.
As a digital platform partner to many clients with content-rich sites, Oomph often works with brands to redesign their content for digital success. Here’s a look at the basic principles we apply to any site design – and how you can use them to your advantage.
How People Read Online
When we dive into a book, we typically settle in for a long haul, ready to soak up each chapter one by one. But when we open up a website, it’s more like scanning a newspaper or the entire bookshelf – we’re looking for something specific to catch our eye. We quickly scan, looking for anything that jumps out at us. If we see something interesting, then we’ll slow down and start reading in more detail.
Think of it like an animal following an information “scent,” identifying a mixture of clues that are likely to lead to the content you’re looking for. Most people will decide which pages to visit based on how likely the page will have the answer they’re looking for and how long it’s going to take to get the answer.
Users need to be hooked within a few moments of looking at a website or they’ll move on. They need to be able to identify and understand key factors like:
- The point of the information and why they should keep reading
- Whether they can trust the information and the source
- The type of content provided and any action expected from them, like signing up for an event
- How visually engaging and readable the content is
The takeaway for brands? Writing with your readers’ needs in mind is a way to show them you care and want to help them solve their problem. It’s also the key to achieving your site goals.
Your site content does more than just convey information – it’s about building trust, establishing rapport, and creating a connection that goes beyond the page. Whether you’re trying to sell a product or promote a cause, crafting content around your audience’s needs, desires, and preferences is the most effective way to compel them to take action. Here are four ways to set your website content up for success.
1. Put your data to work.
If you’re looking to refresh your current site, data can help you make informed choices about everything from your content strategy to your layout and design. Use digital reporting tools to answer questions like:
- Is our target audience visiting our site – and are other audiences visiting that we don’t know about yet?
- Which content do visitors download or engage with most frequently?
- What does a typical site visit look like? Are there places where users are getting stuck or bouncing off?
Google Analytics is a go-to tool for understanding the basics of who is visiting your site and how they’re engaging with your content. You can track metrics like session duration, traffic sources, and top-performing pages, all of which can help you better understand what your audience is looking for and what you want to tell them. (If you haven’t made the switch to Google Analytics’ latest platform, GA4, jump-start the process with our 12-step migration guide.)
Additional tools like Screaming Frog and Hotjar can give you even deeper insights, helping you track content structure and real-time user interactions.
2. Create a simple and consistent content structure.
When it comes to site content, consistency is like the foundation of a house (minus the power tools and hard hats).
A well-structured site not only helps users navigate and understand your content more easily, but also enhances the visual appeal and flow of the site. Think of it like a dance floor – you want your users to be able to move smoothly from one section to the next, without any awkward missteps.
That means focusing on shorter sentences, bullet points, and clear subheadings, all backed up by engaging visuals that serve as resting points for the eye. And while you’re at it, don’t forget to declutter your content — users don’t want to wade through a sea of unnecessary words just to find the nuggets of gold.
Ask yourself: Does this content flow smoothly, is it easy to scan, and does it make my key messages stand out? If the answer is yes, then you’re on your way to successful content.
3. Make sure visuals and content play nicely together.
When it comes to enhancing your content with visuals, the key is to strike a balance between style and substance. Your design should complement your content, not compete or distract from it.
Beyond their aesthetic appeal, well-designed visuals are important for creating a sense of credibility with users. Think back to the concept of information scent: If your design looks sloppy or inconsistent, users are less likely to trust the information you’re presenting. So make sure you’re using design elements wisely, creating ample white space, and avoiding anything that makes your content feel like a sales pitch.
4. Focus on accessibility.
When it comes to site content, accessibility can’t be ignored. Content should be engaging and informative and also conform to the , Website Content Accessibility Guidelines (WCAG). Tools like SortSite can help identify these issues and guide you toward accessibility success.
There are a number of things all sites need to consider:
- Using consistent text stylings, including text color, leading, kerning, and tracking.
- Design to support individuals with visual impairments, assistive technology like screen readers, and those that require navigation via the keyboard only
- Following heading orders and grouping content together to make it easier to scan. For example: Following a heading level 2 with a heading level 3 when the ideas are related, but starting with a new heading 2 if changing to a new section of thought.
- Using multiple methods to indicate action items and descriptive text for buttons and alternative text.
- PDFs can be useful, but are also big accessibility red flags, so it’s best to avoid using them when possible. If a PDF is a must, make sure it follows accessibility best practices.
Designing Engaging Content Doesn’t Need To Be a Full-Time Job
If you already have a library of content, auditing the content that already exists can be daunting. And sometimes, you need a little help from your friends. That’s where third-party experts (like us!) come in.
During our website discovery process, we use strategies like content and analytics audits, UX heuristics, and user journey mapping to help position client sites for success. We’ll help you identify areas for improvement, highlight opportunities for growth, and guide you toward achieving content greatness.
Ready for a fresh perspective on your content? We’d love to talk about it.
On the hunt for the right vendor to help with your website refresh or app launch? Creating a request for proposal (RFP) is often an essential – and even required – first step. But much like digital experiences themselves, RFPs can range widely in quality.
At their best, RFPs clearly educate potential partners about your needs and help you compare your choices more easily. At their worst, RFPs are vague, complicated, and time-consuming for everyone involved. That can prompt some vendors to bypass them completely, leaving you with a less-than-stellar pool of options.
Many agencies see RFPs as a high-risk, low-reward business development strategy and are selective about responding, since they can eat up so much time. Case in point: The average company spends 32 hours and has 9 team members work on each RFP, yet wins less than half of them.
Despite all this, RFPs aren’t going anywhere. So how can you create an RFP that will actually attract the type of partner you want?
At Oomph, we review hundreds of RFPs every year to find the projects that are best suited for our skills. After sorting through the good, bad, and truly ugly, we’ve established an internal scoring system for potential RFPs — and learned some valuable lessons along the way.
Here are nine key factors that can help ensure your RFP stands out from the rest.
1. Embrace open communication.
By establishing open lines of communication from the outset, you can build a sense of trust and clarify questions to ensure the proposed solutions meet your needs.
If holding calls with individual vendors isn’t an option, hosting a pre-bid call is one effective way to gain face time with several prospective partners at once. Connecting live can give you a sense of how your two teams will mesh. For example, if an agency flakes on the call, those issues will likely only get worse during the project itself. On the flip side, a vendor who gets your goals and needs can often give you a more customized and accurate estimate.
2. Be as transparent as possible with your budget.
Ah, the million-dollar question: How much will this all cost? Some organizations decline to share a budget in their RFP, either because they’re not allowed to or because they don’t want vendors to inflate their price to match the stated budget. But omitting a dollar figure can quickly lead to frustration on all sides: You don’t want to waste time sorting through responses that aren’t in your budget, and agencies don’t want to respond to potential clients who can’t meet their rates.
By providing a targeted cost, you build trust with potential partners and avoid wasting time on solutions that are out of your price range. When including a budget, be clear on how vendors should respond. Do they need to list every expense as a line item or can they group costs? Should they include additional items that they think could enhance the project?
If you’re in an industry where you can’t share a budget, consider at least including a not-to-exceed figure. Otherwise, be prepared to sift through huge swings in costs. This is one instance where getting specific about your desired solution can actually be a good thing. Noting that you’re looking for a templated website vs. a custom build, for example, can help you avoid getting some proposals that come in at $20,000 and others that come in at $200,000.
3. Give ample time during the process.
RFPs are a lot of work and you don’t want to rush. A hasty process can increase the likelihood of mistakes, omissions, or incomplete responses from potential partners.
If you’re accepting questions on your RFP, make sure you leave enough time after answering them for agencies to formulate their response. If you have a second round, create some breathing room for agencies to prepare, especially if you’re expecting a presentation.
4. Provide the basics on your company.
Vendors want to know who you are and what you’re about. This includes basic details like the products or services you offer, your location, and your audience.
You should also include details on what makes your organization different. What sets you apart? What’s your mission? This will help vendors better understand your company’s goals, allowing them to tailor their proposals to your specific request.
Finally, let vendors know who will be spearheading the project on your team. Are there multiple decision-makers? Will your board need to sign off? Sharing information on your working style can help attract vendors who are a good fit and ensure they plan for the right level of collaboration in their scope.
5. Focus on your project goals, not the solution.
When creating an RFP, it’s easy to get caught up in the specific deliverable you think you need. But try to think big picture.
What do you want to accomplish? What was the impetus behind this work? For example, if your online leads are slowing down or it’s been ages since you last refreshed your design, share the details in your RFP. Make sure to include any project constraints as well, like if you want the winning firm to use your existing technical setup or if you’re open to new solutions.
By focusing on challenges and goals vs. proscriptive solutions, you allow potential partners to propose ideas that you may not have considered — but could be more effective than your initial solution.
6. Let applicants know which response formats are (and aren’t) OK.
List out the required elements you want to see in a proposal, like solution overview, a proposed timeline, and relevant work samples. Providing a standard framework can make it easier for agencies to assess the effort involved before deciding whether to respond and help you compare the strengths and weaknesses of various approaches. If any items are high-priority, be clear about where you expect applicants to spend the most time.
While providing details on what you’d like to see in the proposal is a smart move, be flexible if possible on how agencies deliver their response. If your project involves design work, allowing agencies to submit a PowerPoint deck instead of a written response can give you a glimpse at their design skills and how they interpret your brand based on the RFP. If you need proposals submitted in a specific format, go digital if possible. Most agencies will click “Pass” on any RFP that requires submitting 10 printed copies of a 30-page response.
7. Be clear on what will set applicants apart.
Think about what would make your partner a perfect fit for your organization. Is it experience in your industry or working with your preferred CMS? Is hiring a woman- or BIPOC-owned firm important to you? Are you eager to find a local agency that you can collaborate with in person?
By explicitly stating what will set top-tier candidates apart, you not only motivate vendors to put their best foot forward, but also give them the guidance they need to do so. Providing specific evaluation criteria in your RFP can also help ensure that the vendors who respond are the ones best suited to your project’s needs.
8. Consider your invites carefully.
The RFP process is meant to help you choose a single partner to meet your needs. Finding your ideal match requires carefully considering their expertise, proposed solution, and alignment with your company’s culture and values. So when you send your RFP, aim for quality over quantity in responses. Reviewing proposals from vendors who lack the necessary skills or who are a poor fit can lead to wasted time and, ultimately, a less successful project.
Beyond posting your RFP across your channels, think about how to proactively find the best partner for the job. Doing research in your industry and even asking competitors or affiliates who they’ve worked with can help narrow down your search.
9. Hold off on those references.
We get it – it’s helpful to get a second (or third, or fourth…) opinion when choosing a partner. However, it’s best to wait until you’ve narrowed it down to a few potential partners before reaching out to their references.
Why? You don’t want to waste your time contacting references for vendors who may not end up being a good fit for your project. Some vendors also may not want their clients contacted over and over again for early-stage RFPs. By waiting until you’ve narrowed down your list, you’ll likely have better, more specific questions to ask the references based on the vendor’s proposed solution.
Creating a Win-Win RFP Process
With the help of a well-crafted RFP, you can attract top-tier vendors who will be eager to flex their creative muscles and propose solutions that achieve your project’s goals. By prioritizing transparency, setting clear expectations, and valuing communication, you can establish a strong foundation for a productive and successful collaboration.
Need a fresh perspective on your digital project RFP? We’d love to talk about it.
Have you ever tried to buy tickets to a concert and experienced the frustration and eventual rage of waiting for pages to load, unresponsive pages, unclear next steps, timers counting down, or buttons not working to submit — and you probably still walked away with zero tickets? Yeah, you probably had some choice words, and your keyboard and mouse might have suffered your ire in the process.
As a website owner, you strive to create a seamless user experience for your audience. Ideally, one that doesn’t involve them preparing to star in their own version of the printer scene in Office Space. Despite your best efforts, there will be times when users get frustrated due to slow page loads, broken links, navigation loops, or any other technical issues. This frustration can lead to what the industry calls “rage clicks” and “thrashed cursors.” When your users are driven to these actions, your website’s reputation, engagement, and return visits can be damaged. Let’s dig in to discuss what rage clicks and thrashed cursors are and how to deal with frustrated users.
First of all, what are Rage Clicks?
Rage clicks are when a user repeatedly clicks on a button or link when it fails to respond immediately — the interface offers no feedback that their first click did something. This bad user experience doesn’t motivate them to return for more. These clicks are likely often accompanied by loud and audible sighs, groans, or even yelling. “Come on, just GO!” might ring a bell if you’ve ever been in this situation. Rage clicks are one of the most frustrating things a user can experience when using a website or app.
Rage Clicks are defined technically by establishing that:
- At least three clicks take place
- These three clicks happen within a two-second time frame
- All clicks occur within a 100px radius
Similarly, what is a Thrashed Cursor?
A thrashed cursor is when a user moves the cursor back and forth over a page or element, indicating impatience or confusion. Various issues, including slow page load times, broken links, unresponsive buttons, and unclear navigation, can cause users to exhibit these digital behaviors. It can also indicate the user is about to leave the site if they cannot find that solution quickly.
Thrashed cursors are defined technically by establishing that:
- There is an area on the page where a user was moving their mouse erratically
- An established pattern of “thrashing” occurs around or on specific elements or pages
- Higher rate of user exits from the identified pages
Why do Rage Clicks and Thrashed Cursor happen?
Common reasons rage clicks and thrashed cursors happen are:
- Poor Design: Poor design is one of the most common reasons for rage clicks and thrashed cursors. If the website has a confusing layout or navigation structure, it can be frustrating for users to find what they’re looking for. Or, they may assume an element is clickable; when it’s not, it can be irksome. Underlined text is an excellent example, as users often associate underlines with links.
- Technical Issues: Technical issues such as slow loading times, broken links, or non-responsive buttons can cause rage clicks and thrashed cursors. Users expect the website to work correctly; when it doesn’t, they can become annoyed or frustrated. If they click a button, they expect the button to do something.
- Lack of Clarity: If the website’s content is unclear or poorly written, it can cause confusion and frustration for users. They may struggle to understand the information provided or find it challenging to complete the intended action. Content loops can be a good example of this. Content loops happen when users repeatedly go back and forth between pages or sections of a website, trying to find the information they need. Eventually, they’ll become frustrated, leading to this user leaving the website.
How do you resolve issues that lead to Rage Clicks and Thrashed Cursors?
Now that we know what rage clicks and thrashed cursors are and why they happen, how do you resolve it, you may be asking. Here are a few things an agency partner can help you with that can significantly reduce the risk of your users resorting to these behaviors.
Use Performance Measuring Tools
By employing performance measuring, you can analyze the data collected, gain valuable insights into how users interact with your platform, and identify areas for improvement. For example, if you notice a high number of rage clicks on a specific button or link, it may indicate that users are confused about its functionality or that it’s not working correctly. Similarly, if you see a high number of thrashed cursors on a particular page, it may suggest that users are struggling to navigate or find the information they need.
Tools that support Friction or Frustration measurement:
- Clarity (from Microsoft)
- Quantum Metric
Conduct User Experience Exercises and Testing
Identifying the root causes of rage clicks and thrashed cursors can be done through a UX audit. An agency can examine your website design, functionality, and usability, identifying areas of improvement.
- User Journey Mapping: User journey mapping involves mapping the user’s journey through your website from a starting point to a goal, identifying pain points along the way, and determining where users may get stuck or frustrated.
- Usability Testing: Usability testing involves putting the website in front of real users and giving them tasks to complete. The tester then looks to identify issues, such as slow loading times, broken links, or confusing navigation.
- User Surveys: User surveys can be conducted in various ways, including online surveys, in-person interviews, and focus groups. These surveys can be designed to gather information about users’ perceptions of the website, interactions with the website, and satisfaction levels. Questions can be designed to identify areas of frustration, such as difficult-to-find information, slow page load times, or confusing navigation. It’s wise to keep surveys short, so work with your agency to select the questions to garner the best feedback.
- Heat Mapping: Heat mapping involves analyzing user behavior on your website, identifying where users are clicking, scrolling, and spending their time. This can identify areas of the website that are causing frustration and leading to rage clicks and thrashed cursors.
Focus on Website Speed Optimization
A digital agency can synthesize findings from UX research and performance-measuring tools and work to optimize your website for quicker page loads and buttons or links that respond immediately to user actions.
- Image Optimization: Optimizing images on your website will significantly improve page loading times. An agency can help you optimize server settings and compress images to reduce their size without sacrificing quality.
- Caching: Caching involves storing frequently accessed website data on a user’s device, reducing the need for data retrieval and improving website speed.
- Content Delivery Network (CDN): A CDN is a network of servers distributed worldwide that store website data, improving website speed by reducing the distance between the user and the server.
- Server Optimization: Server optimization involves optimizing server settings and configurations, such as increasing server resources, using a faster server, and reducing request response time. Website owners frequently skip this step and don’t select the right hosting plan, which can cost more money through lost users and lower conversions.
Resolve Technical Issues
A web agency can help resolve any technical issues that may be causing frustration for your users. These issues may include broken links or buttons, 404 errors, slow page load times, and server errors. Technical issue resolution can involve various activities, including code optimization, server maintenance, and bug fixes that work to ensure that everything is working correctly and address any issues that arise promptly. The resolution of technical issues will improve website performance, reducing the likelihood of user frustration and rage clicks.
User frustration can negatively impact user satisfaction and business outcomes. Partnering with a digital agency can be a valuable investment to mitigate these issues. Through the use of tools, UX audits, user surveys, website speed optimization, and technical issue resolution, a digital agency can identify and address the root causes of user frustration, improving the overall user experience — leading to an increase in user engagement, satisfaction, and loyalty, which means improved conversion rates, higher customer retention, and ultimately, increased revenue for your business.
If your customers are hulking out, maybe it’s time to call us!
Ever get a proposal back from an agency and think, “It would be cheaper and easier to do this ourselves?”
Here at Oomph, we’ve been getting the agency vs. in-house question for years. And we totally understand why. How appealing is it to get the full-time eyes and expertise of an employee, rather than paying a similar price for what can feel like less time from an agency?
You’re not the only one thinking it. With resources and budgets tightening across industries, many companies are asking themselves how to balance price, speed, and quality in their digital work – and if agencies are the answer. In fact, a recent marketing relationship survey found that 22% of brands are actively bringing their marketing in-house, a 5% increase from the previous year.
But before you follow the trend, consider all your options. The truth is that there are times when it makes sense to hire in-house. Yet there are also plenty of situations where an agency partner can produce better work at a lower cost.
Here’s what you need to know about agency vs. in-house to decide for yourself.
The Pros of Hiring In-House
For brands that need easy access to a steady resource for ongoing work, an in-house hire might be the right fit. Bringing on a staff developer can offer benefits like:
Full-time employees (FTE) are just down the hall or, at the very least, on the same Slack channels as you. That means you can drop a file to them to get quick edits on a new landing page, or break out the whiteboard spontaneously to brainstorm some ideas for future app features. This convenience can help facilitate more off-the-cuff creativity. It also sidesteps a lot of the red tape it takes to get websites approved and live.
Knowledge of the brand and business
Your FTE has a singular focus: you. It’s their job to know the ins and outs of your organization, and they won’t have to split their time with another brand’s work. Since your FTE will already be tapped into what works for your brand, you won’t have to spend so much time overseeing their work. What’s more, FTEs can draw from their depth of knowledge to deliver digital experiences that are truly unique to you.
A lack of strategic approach is one of the top three reasons why clients end relationships with their agencies. While agencies are packed with strategy and creative experts, that expertise is far-reaching and may extend to industries or platforms that aren’t relevant to your business. When you hire in-house, you can get laser-focused on finding a candidate with the work experiences and technical skills to align with your broader vision.
The Advantages of an Agency
At their best, agencies act as an extension of your team. What’s theirs becomes yours, meaning you’ll have access to a broad range of talent, skill sets, and resources. Your agency relationship can open doors to:
It’s reasonable to expect your full-time developer to be an expert in coding sites and apps. But what about SEO? Content marketing? UX/UI? Data and analytics? Copywriting?
Large websites, platforms, and applications call for all of these specialized skills – and so many more. That’s a lot of seats to fill and a pretty hefty budget to make the case for. If you hired and managed all of those individuals, you’d spend all your time trying to keep them busy.
With an agency, you get access to all of that expertise on an as-needed or contract basis and someone to manage them for you.
Technology evolves at a breakneck speed. Since internal teams typically just touch their own platforms and technologies, they often have less exposure to new tools and processes than agencies. For most agencies, learning is baked into the culture through dedicated professional development and skills learned through serving a broader range of clients.
Here at Oomph, we know part of our value is advising on the emerging technologies that might benefit your business. That’s why we create intentional spaces, like our monthly engineering guild, for our teams to explore and discuss new tools. The knowledge-sharing that agencies like ours engage in trickles down not only to their conversations with you, but into the projects and products they deliver.
Imagine you’re in the middle of building a new digital platform. What if your sole developer leaves, as so many employees do?
On average, companies lose 18% of their workforce every year to turnover, 12% of which is voluntary. While this rate varies from industry to industry, it’s still likely that you’ll one day lose team members to the draw of higher salaries and better benefits. Agencies offer a level of consistency that FTEs just don’t, backfilling any departures to keep your initiatives humming along.
Agency vs. In-House: Which Is More Cost Effective?
While it’s true that you’ll likely pay more for an hour of your agency’s time than an hour of your FTE’s, that doesn’t tell the whole story. Agencies are often a more cost-effective option because:
Full-time salaries are on the rise
According to a 2021 US News Report, software developers made a median salary of $120,730. Have sticker shock yet? Keep in mind, that doesn’t even include the additional costs of employment like benefits, PTO, and hardware and software.
Agency time is more efficient
Efficiency is a priority for any agency. They’re typically paid for the number of hours it takes to do a project – no more, no less – so they’re incentivized to make every minute count.
A FTE may not be so enterprising with your time. Not to mention that with FTEs, you also pay for:
- Time to onboard/ramp up
- Time spent on professional development, internal meetings, and other activities outside of their core work
- Time spent by managers/others to manage the employee, which is generally a higher time investment than managing your agency
The relationship can scale up or down
Imagine you’re launching a new website. To get it across the finish line, you need a wide variety of team members and a huge chunk of hours. But what happens after that website goes live?
With an agency, you can easily scale your engagement up or down to account for the ebbs and flows of digital projects. For example, you might hire an agency to provide a basic retainer package for post-launch site maintenance, and then add new features as you need them via specific scopes of work. In many cases, the cost of an agency support package could be as much as half the cost of hiring just one person full-time.
When To Hire an Agency
We have to say it: There are some situations where only an agency will do.
Now, we aren’t saying that agency has to be Oomph (although we’re always here to help if you need us). But we are saying that agencies may be the best fit if:
- Development isn’t a core capability of your business: Businesses that lack a deep knowledge of web development may struggle to effectively manage an in-house developer, or even worse, end up with technical debt they’re unaware of.
- You have a specific project to complete: Big projects are a great reason to work with an agency because you can essentially expand your team for a limited time, then scale back once the project wraps up.
- Your needs fluctuate or your team is maxed: Some months, you’ll have a surplus of development projects and your team will feel up to their eyeballs in to-dos. Other months, those projects slow down. A support package with an agency can flex along with your business’s needs, giving you the option to add more hours during busy times. While leveraging freelancers may sound appealing here, the constant ramp-up periods and lack of institutional knowledge that comes along with using contractors can actually slow work down. Agencies bring a blend of outsider perspective with flexible, ongoing partnership.
- Your needs are multidisciplinary: It rarely makes sense to hire a 10-person team for a specific project. But your agency can offer all the skills you need (and probably even more that you aren’t utilizing yet) without the hassle of managing an entire team or even overseeing multiple freelancers.
The Agency vs. In-House Bottom Line
Here’s the real tea: When it comes time to decide to “build vs. buy,” so to speak, there is no one right answer. There are pros and cons to each approach, and it really does depend on how your team is built now and where you need it to go.
Both approaches can work. And while we’d love for you to partner with Oomph, we also know that the most fruitful agency-client relationships are those where the agency’s capabilities merge seamlessly with the client’s needs. For that reason, we also believe in the best of both worlds – putting our full weight behind projects, but knowing when it’s time to play a supporting role to the FTE main characters.
Need help deciding? Let’s talk about it.
Connecting People and Planet
NEEF’s website is the gateway that connects its audiences to a vast array of learning experiences – but its existing platform was falling short. The organization needed more visually interesting resources and content, but it also knew its legacy Drupal site couldn’t keep up.
NEEF wanted to build a more powerful platform that could seamlessly:
- Communicate its mission and showcase its impact to inspire potential funders
- Broaden its audience reach through enhanced accessibility, content, and SEO
- Be a valuable resource by providing useful and engaging content, maps, toolkits, and online courses
- Build relationships by engaging users on the front end with easy-to-use content, then seamlessly channeling that data into back-end functionality for user-based tracking
Strategy is the foundation for effective digital experiences and the intuitive designs they require. Oomph first honed in on NEEF’s key goals, then implemented a plan to meet them: leveraging existing features that work, adding critical front- and back-end capabilities, and packaging it all in an engaging, user-centric new website.
Information architecture is at the core of user experience (UX). We focused on organizing NEEF’s information to make it more accessible and appealing to its core audiences: educators, conservationists, nonprofits, and partners. Our designers then transformed that strategy into strategic wireframes and dynamic designs, all of which we developed into a custom Drupal site.
The New NEEF: User-Centered Design
A Custom Site To Fuel Connection
NEEF needed a digital platform as unique as its organization, which is why Oomph ultimately delivered a suite of custom components designed to accommodate a variety of content needs.
Engaging and thoughtful design
NEEF’s new user experience is simple and streamlined. Visual cues aid in wayfinding (all Explore pages follow the same hero structure, for example), while imagery; microinteractions, such as hover effects; and a bold color palette draw the user in. The UX also emphasizes accessibility and inclusivity; the high contrast between the font colors and the background make the website more readable for people with visual impairments, while people with different skin tones can now see themselves represented in NEEF’s new library of 100 custom icons.
From water conservation to climate change, visitors often come to the NEEF site to learn about a specific subject. We overhauled NEEF’s existing site map to include topic-based browsing, with pages that roll resources, storytelling, and NEEF’s impact into one cohesive package. Additional links in the footer also make it easier for specific audiences to find information, such as nonprofits seeking grants or teachers looking for educational materials
NPLD host resources and event locator
Oomph refreshed existing components and added new ones to support one of NEEF’s flagship programs, National Public Lands Day (NPLD). People interested in hosting an event could use the new components to easily set one up, have their own dashboard to manage, and add their event to NEEF’s event locator. Once the event has passed, it’s automatically unlisted from the locator — but archived so hosts can duplicate and relaunch the event in future years.
Protecting the Planet, One User at a Time
Oomph helped NEEF launch its beautiful, engaging, and interactive site in May 2023. Within three months, NEEF’s team had built more than 100 new landing pages using the new component library, furthering its goal to build deeper connections with its audiences.
As NEEF’s digital presence continues to grow, so will its impact — all with the new custom site as its foundation.