3 different ways to progressively enhance your website

The world of the web has changed a ton over the past decade. Websites that show one page at a time with no animations or interactions can feel stale and outdated.

If your website doesn't engage users, they may go elsewhere -- there are so many glitzy new "headless" interactive sites that suck people in, and if those people are ones who used to buy from you, that could be a big problem. Yet building a site using modern front-end frameworks can be costly, especially if you already have good content on your site that might need to be brought over.

Better Care Network Puzzle

Fortunately, there's a middle ground -- adding "progressive enhancements" to your existing site.

For the past month, we've been blogging about progressive enhancements, delving into different kinds of enhancements and different purposes behind them. Our hope is this will inspire you to think of ways to improve your own website!

Here's a summary of what we've blogged about:

  1. Express complex systems of information. There is so much guidance about simplifying your message online -- but not all information domains are simple. Progressive Enhancements and great design can make it much easier to understand the relationships between the parts of a problem, and we've built a useful component to navigate this kind of information.
  2. Improve Data Entry. When collecting information from users, sometimes they will need help providing the right answer. Custom context-aware data entry widgets can be an easy way to collect better information, reduce errors, and streamline processes.
  3. Manage Data. Websites can do more than "just" present information -- they can also be tools to help you, or your customers, get their jobs done. Drupal in particular is a great platform to store data of all kinds, and entire custom applications can run in your browser using Drupal to store data in the back end.

"Headless" versus "Progressive Enhancements"

If you're paying attention to the web development world, content management system sites built on platforms like WordPress or Drupal almost seem passé. These are now "old school" technologies -- a lot of developers want to build sites using React, Vue, Angular, or Svelte, toolkits that move much of the functionality and processing into the browser where it can be far more interactive.

Yet it's still early days for these technologies, and you need developers to make any sort of change to sites built on these technologies.

Many agencies choose to make "headless" sites that still use WordPress for content management, and one of the front-end platforms for the actual user interaction. And this is a powerful way to go, but it's far more costly than just using WordPress alone.

A "headless" site is a site where the user's browser doesn't load a normal web page -- instead, it loads a bunch of Javascript, which then fetches content from the back end through an API. Building a headless site is an entirely different process -- you create templates and components in Javascript, use "client-side" data stores to keep track of various elements, and essentially build entire applications that run in your browser and just loads the bits it needs from the back end. This provides extreme flexibility, but it also requires a lot of work.

Progressive Enhancements are a middle ground -- instead of needing to rebuild all the functionality, navigation, and structure of your site a second time in the headless app, you simply carve out smaller chunks of functionality you want to improve and build them into your existing site.

This allows you to be far more targeted and efficient with what you choose to build, especially if you already have an existing site.


Freelock News

Limited Time Special!

While the "custom navigation puzzle" is fresh in our minds, we're offering a deep discount if you would like something along these lines added to your existing Drupal website, and you purchase before the end of September! Drupal 9 core has everything needed to drive this, besides your content. If you have a taxonomy with 2 - 4 levels of information, we can add this progressive enhancement to your site with some customization to make it fit your needs.

Website Effectiveness Engineering

At Freelock, we think people spend far too much time building new websites and having to re-do what they already have. If you build your website on a platform that's powerful enough to grow and change with your needs, your technology budget is far better spent addressing the specific needs you have right now, rather than re-doing something you've done several times already.

We've broken down what makes websites effective into 6 key topics, and starting now, we're picking something related to one of those topics to highlight and do a deep dive on each month. Each month we plan to write 3 blog posts on the topic, create a special offering related to that topic, and summarize our findings in an email like this one.

Next month's topic is Measuring Results. We will be exploring analytics, reporting systems, and what's worth measuring. If you have any questions related to analytics, we'd love to hear them! If you know anyone who might be interested, feel free to forward this message or point them to our signup form. And as always, if we can help you make your website more effective, schedule a meeting and we'll be happy to discuss!