Boosting Site Performance in Drupal and WordPress: Strategies to Try and Avoid

Performance is crucial for any website, and a website built with the Drupal or WordPress content management system (CMS) is no exception. Search engines prioritize mobile website performance, and users abandon websites that load too slowly, so ensuring fast loading speeds is essential.

While Drupal and WordPress offer a solid foundation, adding features, themes, and modules/plugins can slow down your site. In this blog post, we’ll explore strategies to improve the performance of your Drupal and WordPress sites and some pitfalls to avoid.

Measuring Performance with Google Pagespeed Insights

How fast is your site? Google Pagespeed Insights is an excellent tool for measuring performance. It provides Core Web Vitals and an overview score with recommendations for improvement. Focus on achieving a general site performance score of 80+ and passing all Core Web Vitals.

Strategies for Boosting Pagespeed

1. Cache and Aggregate

Caching can significantly enhance performance. WordPress Performance plugins can handle CSS/JS caching, while full-page and database query caching require additional plugins and fine-tuning for optimal results. Drupal, however, has these performance enhancements already baked into the CMS.

Consider using performance-oriented plugins on your WordPress site. Autoptimize, Phastpress, and Hummingbird are popular options that can significantly enhance site performance. 

Drupal handles this with its internal caching. Enable Drupal’s built-in caching for all your pages, blocks, and views, and enable CSS and JavaScript aggregation on the Performance page.

These plugins and configurations may require platform-specific adjustments or specific settings for certain hosting environments, so testing is crucial.

2. Choose a Good Hosting Environment

Shared website hosting can be affected by other websites, adversely impacting your page speed. Dedicated or managed hosting environments offer better performance at a reasonable cost. Providers like Pantheon offer dedicated hosting for Drupal and WordPress, whereas Acquia provides dedicated Drupal hosting. WPEngine and Kinsta provide dedicated WordPress hosting. Any of these managed hosting providers are an excellent starting point.

Managed hosting environments often provide their own caching mechanisms that are worth exploring for their known performance benefits.

Varnish, for example, can dramatically improve performance. Consider Memcached or Redis for faster, more scalable caching — especially with complex Drupal or WordPress sites.

3. Image Size Matters

Even Drupal and WordPress have limits when compressing large images. Upload images close to the required size or aspect ratio. Configuring Drupal and WordPress to resize images automatically is essential for a fast experience.

4. Optimize Images

WordPress and Drupal can generate adequately sized images for your website, but newer formats like SVG, WebP, and Avif offer better compression without compromising quality. 

WordPress plugins like WebP Express, ShortPixel, SVG Support, and Safe SVG can reduce image size quickly and offer SVG support. 

In Drupal, the SVG Image module lets you add support for SVG files to the standard image field. It also facilitates web image format conversion through a filter within Drupal core image styles, which you can configure according to your needs.

It’s equally important to ensure the image loads are sized appropriately for the device accessing your site. Whether using Drupal or WordPress, you’ll want to ensure that responsive images are set in the SRCSET or your IMG tag. WordPress typically adds responsive images by default. You can manipulate these defaults using the wp_calculate_image_srcset() and wp_calculate_image_sizes() filters outlined within the WordPress Developer Resources. In Drupal, we do this using the module Easy Responsive Images.

Lazy loading images is an effective way of deferring the load of images until they’re about to enter the viewport.

Optimizing video embeds is as effective as optimizing your images. With Drupal, we do this using the Lite Youtube Embed module, which allows the videos to be lazy loaded.

5. Avoid Too Many Scripts

Google Tag Manager makes it easy to add multiple scripts for user journey tracking — but too many scripts can hinder performance. Regularly review and remove unnecessary third-party scripts to optimize site speed. We wrote a blog post on how to improve performance in Google Tag Manager. 

6. Copy/Pasting? Clean Your Content

When copying and pasting text from another document, clean out extra metadata and styling. Drupal and WordPress can clean some of it, but it’s best to avoid loading unnecessary content. When possible, always paste text without formatting.

7. Update, Update, Update

Regardless of which platform you choose, it’s critically important to keep the content management system and its corresponding modules or plugins up-to-date. Drupal core and modules and WordPress core and plugin updates can offer performance and security fixes.

Be sure to keep PHP on the most recent stable version supported by Drupal or WordPress to benefit from performance and security fixes.

Strategies to Avoid

1. WordPress Page Builders

Avoid using page builders on the built-in WordPress block editor (Gutenberg). Gutenberg has improved site editing to the point where additional page builders — such as Elementor or Beaver Builder — are rarely needed. They can negatively impact site performance.

In Drupal, however, there is no equivalent page builder. It is important to use themes and modules that do not provide unnecessary bloat. 

2. Excessive Plugins

Many Drupal modules or WordPress plugins can have unnecessary features that slow down your site. If you only need one feature from a module or plugin that loads many others, consider finding a more lightweight alternative. The functionality provided by that one feature within that module or plugin may be able to be written within your theme or a custom Drupal module or WordPress plugin for a more performant and secure site.

It’s always essential to audit your Drupal modules and WordPress plugins regularly. We would recommend quarterly. Disable unnecessary Drupal modules and WordPress Plugins that consume resources, and consider removing them from the code base completely where possible.

3. Frameworks and Bloated Themes

Adding frameworks like Bootstrap, icon packs, and fonts to a theme can increase CSS and JS bundle size. If you can’t optimize these effectively, stick to creating what you need on an existing theme. Less is definitely more in this case.

The payload of CSS for what loads above the fold on a page can be managed using Critical CSS. 

Some parting advice:

Write efficient custom code in your theme and Drupal module or WordPress plugin to ensure it is optimized for performance. If you’re a developer,  disable caching and aggregation when developing to avoid issues. 

As always, test, test, and test again. Test the site under heavy load to simulate real-world scenarios to uncover bottlenecks, and use third-party services such as New Relic to help dig into these bottlenecks.

Drupal and WordPress provide a solid foundation for performance, but modules, plugins, themes, and functionality can reduce site speed. Monitoring performance is crucial — and pairing it with continuous optimization is essential. For more advanced assistance, feel free to get in touch; we’d be happy to provide expert advice, and even a few performance improvements.

Did you know that Shane is our very first Kanopi employee, ever? If you’ve enjoyed reading his post, please check out his other great works in our blogosphere, such as: 

The Comprehensive Guide to Drupal Recipes

At the keynote speech at DrupalCon 2022, Dries Buytaert, the founder of Drupal, presented the idea of “Starter templates” to help ambitious site builders quickly and easily create solutions. From that, the Distributions and Recipes initiative was born.

Drupal recipes are the foundation for the new Starshot Initiative, which aims to make Drupal easier to use and out of the box for all users. It took a couple of years, but Recipes have been added to Drupal core in 10.3 as Experimental APIs.

(If you prefer webinars, I gave a webinar on Recipes, Starshot, and the future of Drupal. Check it out.)

The Problem

For decades, developers have been packaging functionality together for Drupal to create different solutions, such as eCommerce stores, blogs, LMS, social media, and publishing sites. Many approaches were taken, each with its own pain points.

Installation Profiles

  • You can only start with them.
  • Once you start with them, you are stuck with them forever!
  • You can’t change to a different install profile.

Distributions

  • Complex dependencies that need to be maintained
  • Updates could break customizations
  • Would be hard to get solutions into Drupal core.

Features and Custom modules

  • As with the above, these often become complex and hard to manage.
  • Need update hooks or manual steps to alter core and other contrib module’s configuration.

The Solution

An issue has been created to add four new APIs to Drupal that will allow Recipes to be applied to Drupal. These recipes allow Drupal module automation, theme installation, and configuration at any time during the lifecycle of a Drupal site. They can install modules, import configuration, alter existing configuration, and even provide content to a Drupal site. Recipes are ephemeral; once applied, the results become the site’s responsibility.

What makes up a Drupal Recipe?

A recipe needs only a folder with the recipe’s name, which contains a recipe.yml file.  Beyond that, optional items are a /config folder, a /content folder, and a composer.json file. You can also include README.md and LICENSE.md files like a module or theme.

Recipe structure

  • recipe_name folder
    • recipe.yml
    • /config folder
      • node.type.event.yml
    • /content folder
    • composer.json

recipe.yml structure

name: 'Event'
  type: 'Content type'
recipes:
  event_manager
install:
  datetime_range
  node
config:
  actions:
    user.role.event_manager:
      grantPermissions:
        'delete any event content'
        'edit any event content'

What can’t a Recipe do?

To keep things functional and sustainable, recipes can’t do certain things.  For instance, recipes can’t…

  • Have their own code. If you need code, have your recipe install a module with that code.
  • Make dynamic changes.
  • Provide their own upgrade path (functionality is now part of the site).

Applying a recipe to an existing site

Recipes are applied to Drupal, not installed. Until the code is merged into Drupal core, you need to patch Drupal.  Patches can be found here on the project page.

Once you’ ha’ve patched your Drupal core version, you can use the internal script to apply a recipe to an existing site. On your command line, run the following command from your webroot:

php core/scripts/drupal recipe core/recipes/standard -v

This command uses PHP to find the “recipe” script in core/scripts/drupal. Then list the full path to the recipe. The -v flag has the recipe runner output the application steps as they happen on the command line. 

Once you apply the patch, you will get Drupal recipes from core! Core’s recipes currently include the Standard installation profile recreated as recipes. You can apply Standard and get all the functionality or apply them individually as needed. They were created to be very atomic — so that you can choose your own adventure.

Applying a recipe using Quick Start

Another Drupal script allows you to install Drupal from a recipe. When you do this, you do not start from an install profile! This is a new change. Previously, you at least had to start with a minimal profile; now, that is no longer needed.

If you’re starting a new Drupal install, you can use the following script:

php core/scripts/drupal quick-start core/recipes/article_content_type

The new Recipe APIs

The core of the recipe’s code are four new APIs.

  • Drupal\Core\Config\Action
  • Drupal\Core\Config\Checkpoint
  • Drupal\Core\Recipe
  • Drupal\Core\DefaultContent

The Recipe API depends on DefaultContent, Action, and Checkpoint. The other three APIs have no interdependencies.

Drupal\Core\Config\Checkpoint

A checkpoint is made for the site’s configuration when a recipe is applied. The recipe runner uses this to revert if the application fails, but there may be other uses for this in the future, like unapplying a recipe.

Drupal\Core\DefaultContent

This API’s code came from the contributed Default Content module. It allows recipes to provide content to Drupal using YAML files.

Drupal\Core\Config\Action

The Config Action API is the magic of the recipe system. It allows you to alter configurations already in a site, including core’s configs!

Drupal\Core\Recipe

Finally, the Recipe API puts it all together and applies the recipe. The recipe runner takes a recipe, and follows the following steps:

  1. Applies dependent recipes
  2. Install modules and themes
  3. Imports configuration from the /config folder
  4. Alters configuration based on actions
  5. Imports content from the /content folder

Deep Dive into an Actual Recipe

This recipe creates two fully configured content types. It includes meta tags, paths, configured admin forms:

name: 'Saplings - Content types'
description: 'Configuration for the Saplings Content types.'
type: 'Site'
# Here we require other dependent recipes.
recipes:
  - saplings-content-base
  - saplings-component-types
# Now we install modules.
install:
  # Core.
  - menu_ui
  - tour
  # Contrib.
  - access_unpublished
  - field_group
  - metatag_open_graph
  - metatag_twitter_cards
  - pathauto
  - publication_date
  - scheduler
  - scheduler_content_moderation_integration
  - schema_article
  - simple_sitemap
  - token_or
  - ui_patterns_layouts
config:
  # Now can import configuration
  import:
    # Core.
    menu_ui: "*"
    # Contrib.
    access_unpublished: "*"
    pathauto: "*"
    # If we only want to import certain configs, we can identify them like this.
    scheduler:
      - scheduler.settings
      - views.view.scheduler_scheduled_content
  # Config actions are where we can change configuration in Drupal 
  actions:
    # Set Metatag Home page:
    metatag.metatag_defaults.front:
      simple_config_update:
        tags.canonical_url: '[site:url]'
        tags.description: '[node:sa_description|node:sa_seo_description]'
        tags.image_src: '[node:sa_seo_image:entity:field_media_image:sa_social_media_facebook|node:sa_featured_image:entity:field_media_image:sa_social_media_facebook]'
     tags.og_description: '[node:sa_description|node:sa_seo_description]'
    # Set permissions for anonymous role.
    user.role.anonymous:
      ensure_exists:
        id: anonymous
      grantPermissions:
        - 'access content'
        - 'access sitemap'
        - 'access_unpublished node sa_page'
        - 'access_unpublished node sa_post'
    # Set permissions for content editor role.
    user.role.content_editor:
      ensure_exists:
        id: content_editor
      grantPermissions:
        - 'access administration pages'
        - 'access block library'
        - 'access content overview'
        - 'access environment indicator'
        - 'access environment indicator ribbon'
        - 'access help pages'
        - 'access media overview'
        - 'access media_entity_browser entity browser pages'
        - 'access media_entity_browser_modal entity browser pages'

What are Config Actions?

As you can see in the recipe example above, you can import config from modules and themes, and take action against config that already exists. Config actions are written to make specific changes to config files — including Drupal core configuration files, which previously could only be done through update hooks.

Look for this list to update as the initiative digs into phase 2 and creates more recipes and possibilities.

Available to all config entities

simple_config_update

This is a config action that can be used to make foo: bar type updates to any configuration file.

setThirdPartySetting(s)

The setThirdPartySetting(s) config actions allows recipe authors to set third-party

settings values.  Add the ‘s’ to apply multiple third part settings.

ensure_exists

This action can be used to ensure as a user role exists before applying other actions.  It helps a recipe not fail if the role does not exist.

create

The create config action can be used to create a config entity, but it is much easier to just put the config file in the /config folder.

Applicable to specific config entity types

addItemToToolbar

Used to add a button to the toolbar of a CKEditor 5 editor.

addToAllBundles

Used to add a field to all bundles of an entity type. Should be used in combination with setComponent(s) below to make sure the field displays on forms and displays.

addNodeTypes, addTaxonomyVocabularies

Used to add editorial workflows to node and taxonomy bundles.

grantPermission(s)

Used to grant permissions to any user.role.* config files.  Add the ‘s’ to add multiple permissions.

setComponent(s)

Used to to add fields to an entity’s view or form display configs.

What’s next for Drupal Recipes?

Now that recipes are in Drupal core, the phase 2 of the roadmap will soon be updated. Integration with Project Browser, and recipe creation in Starshot are definitely on the top of the list, but there are lots more things to do.  Stay tuned and check out the issue queue to learn more!

Want to learn more via an on-demand webinar?

View Jim’s on-demand webinar on Drupal Recipes and Starshot.

Screenshot from Jim Birch's webinar on Drupal recipes and Starshot

Measuring Content Success: the Only Scorecard You Need

Three new websites are built every second.

Let this stat sink in.

That translates to 252,000 new websites created each and every day.

How can you ensure your website’s content is optimized to attract and retain visitors against an ever-increasing number of websites vying for our attention — and that it reaches the coveted top spot on Google’s search engine results page?

At the very least, consider the questions Google asks for creating helpful, reliable, people-first content. 

Now, if you really want to take your content to the next level, read on to learn about Kanopi Studios’ Content Scorecard. We’ve built a powerful tool that allows you to evaluate various aspects of your content and identify areas that offer the greatest opportunities for improvement.

(Want to skip ahead? Download the Content Scorecard now to check it out.)

Getting a team excited about a big website redesign is easy. What’s less easy is getting folks excited about a content audit. How do you show a content audit is worth the time and resources? By focusing on the value of completing one. 

In this blog, we’ll explore the key metrics of Kanopi’s content scorecard and discuss how it can assist you with auditing the content found on your website, along with the benefits of doing so.

Before we dig into the key metrics, let’s discuss content audits and ROI.

Content audits pinpoint costly problems

Content can expire faster than a carton of milk in your fridge. And if content is no longer helping folks complete key tasks on your site, it could be doing more harm than good.

If any content on your site is actively losing leads, it needs your full attention.

A range of issues impacts your content’s ability to reach and convert your website visitors, including:

  • outdated information 
  • accessibility issues 
  • confusing or unclear messaging 
  • non-intuitive website navigation 
  • poor readability, and 
  • technical problems like missing metadata.

These challenges can drive website visitors away from your site. Running a content audit can help you find and fix the most prominent issues before they become costly. 

Content audits extend the life of existing content 

Content audits aren’t just for analyzing your site’s content and finding mistakes. They also discover opportunities to get more out of your existing content.

Content improvement plans tend to surface naturally as a result of content audits. They uncover powerful opportunities to:

  • Drive more traffic to your site, improving search engine rankings while beating your competitors to the top spot on Google’s search engine results pages.
  • Stand out from the rest, elevating important differentiators to help you overtake your competitors.  
  • Convert site visitors to patients or customers through increased engagement and conversion optimization. 

Numbers always help folks visualize impact. Kanopi audited the Alameda County Community Food Bank’s website content and navigation, using findings to develop a strategy that led to:

  • +37% in page views per session and 
  • 93/100 accessibility score

Content audits increase the ROI of long-term strategy

Important marketing campaigns need to begin with an informed, data-backed strategy. If you’re about to start a project like a website redesign, begin with a content audit to understand:

  • what content you currently have, 
  • how your content is performing, and 
  • how to take a holistic approach to improve all site content.

The optimal moment to capture these insights is before you make big changes.

Set yourself up to get the best possible return by setting benchmarks for measuring content performance and how you’ll evaluate success instead of devoting vital resources to something that’ll need fixing later on.

Now, let’s get into Kanopi’s content scorecard metrics used with every content audit we run for our clients:

Content Best Practices

Writing for the web means taking a user-first approach and getting to grips with how people consume content. People aren’t reading your content word-by-word. Instead, folks scan for keywords that help them accomplish the goal of their visit to your website.

Apply these eight proven best practices to ensure your site’s content is actionable and purposeful: 

1. Readability

When it comes to your content, readability significantly impacts user engagement. 

Simply put, content that‘s easy to read and understand is more likely to resonate with your website visitors.

To evaluate readability, make sure your content is conversational, straightforward, and written at an eighth-grade level. Authoring tools like the Hemingway Editor can help you evaluate the reading level of your content. 

Also, you’ll want to ensure that your sentences are short and concise — ideally 20 syllables or less

2. Accessibility

Ensuring that your content is accessible to all users, including those with disabilities, is not only a legal requirement but also a sound business decision. The World Health Organization estimates that 1 in 6 of us experiences significant disability. Why create unnecessary barriers for folks using your website with inaccessible content?

Check factors such as text-to-background color contrast ratio, meaningful alt text for images, captions for videos, and availability of transcripts.

The WAVE web accessibility evaluation tool provides browser extensions that help you identify which content on your web pages is causing the most challenging accessibility issues.

3. Brevity

In today’s fast-paced digital world, we all have short attention spans, which is why it’s crucial to keep your website’s content concise and to the point. 

Save the elaborate prose for that novel you’ve been meaning to write. You can evaluate the brevity of your site’s text-based content by examining factors such as the length of navigation items, headings, body text, and introduction/explainer content.

4. Consistency

Consistency is vital to creating a cohesive and user-friendly experience across your website. 

You can assess consistency by checking if text elements follow the same pattern and style, if there is a consistent content hierarchy across pages familiar to folks, and if navigation pathways are logical and easy to follow.

5. Clear Pathways

Your content should guide users along a clear path down every page and across to related pages on your site, leading them to the next desired action. 

Check that the next desired action you want folks to take is clearly stated on the page, that the page is organized logically, and navigation pathways are easy to find and follow. Prominent breadcrumbs help people keep track of where they are within the content on your site.

6. Accuracy

Ensuring that your content is accurate and up to date is essential for maintaining credibility and trust with your website visitors. 

Evaluate accuracy by checking for outdated information and verifying that content has been fact-checked by one of your subject-matter experts. 

7. Narrative Progression

Effective storytelling can captivate your audience and keep them engaged with your content. 

Assess your narrative progression by checking if content flows logically from the top of each page to the bottom, providing users with a cohesive and engaging experience. Headings, subheadings, body text, and buttons should relate to each other and guide folks to easily move down each web page. 

8. Telling your story

Every piece of content on your site should serve a purpose and contribute to your overarching narrative. Every word, image, video, and graphic should relate to each other and help you tell your organization’s story.

Evaluate your storytelling chops by checking if text complements images, illustrations, and videos and if it’s clear how each piece of content contributes to telling your story.

Language, Voice, & Tone

Determining the right voice and tone — and which words to use to convey your voice and tone — is essential to engaging your site visitors and creating a connection with them.

Different content warrants a shifting tone (e.g., if you’re discussing cancer treatment options it’s best not to be too light), but generally speaking, aim for a personal, positive tone when writing content. 

Strike the right balance between appearing casual with your readers while avoiding bureaucratic or institutional speak. Your writing should sound like it is coming from a human, not a corporate robot. ‘Write like you talk’ is a helpful phrase to remember to ensure your writing isn’t too stiff.

Getting your tone right can be tricky, but studies show it dramatically impacts your user’s perception of your organization. Here are four key points to remember:

1. Your Voice

Your organization’s voice is its personality — it sets the tone for communicating with your website visitors. 

Assess your voice by checking if content aligns with your brand’s voice, and if it’s consistent across your site. (If you don’t have written guidelines in place describing your brand voice, we’d strongly recommend you start there.)

2. Your Tone

The tone of your content can vary depending on the audience you’re trying to reach and the message you’re trying to convey. 

Evaluate your tone by checking if it’s clear, consistent, and resonates with your target personas.

A checklist example from Kanopi's content audit template

3. Persona Alignment

Tailoring your content to resonate with your target personas is essential for connecting with the people who matter most to your organization. 

Evaluate persona alignment by checking that your content emphasizes user benefits and goals and if the language and words on your site resonate with the people who visit it daily.

What is a persona, you ask? Personas are archetypical users whose characteristics and goals represent the needs of a larger group of your audience. Learn more about how personas help with web design.

4. Web Writing Standards

Adhering to basic web writing standards can improve the clarity and effectiveness of your content. 

Check your content uses an active voice, avoids jargon and idioms, follows a consistent writing style, and aligns with your agreed content style guide.

Search Engine Optimization (SEO)

There’s no denying that optimizing your content for SEO impacts your content’s performance and helps you meet important marketing goals.

Without it, your organization could be missing out on organic traffic, leads, sales, visibility, and rankings. Zero in on your keywords, meta descriptions, and alt text to get the most out of your existing content:

1. Keyword Optimization

Optimizing your content for relevant keywords can improve its visibility in search engine results. 

Achieve basic keyword optimization by checking if target keywords are present and appear naturally throughout each page within headings, subheadings, body text, and buttons (as opposed to throwing them in without considering their proper context, a.k.a. ‘shoehorning’).

2. Meta Description Optimization

Meta descriptions play a crucial role in attracting clicks from folks using search engines to find what they need. Evaluate your meta descriptions by checking if they’re under 155 characters, use an active voice, match the content on the page, are unique, and include target keywords.

3. Alt Text Optimization

Alt text is essential for providing context to users who cannot view images. 

Review your site’s alt text by making sure it’s specific succinct, and correctly applied to relevant images. Also, ensure all images have unique alt text. Duplicate alt text can confuse folks who use a screen reader when exploring your site.

Ensure your content is readable, accessible, SEO optimized (and more!)

By closely examining your content to ensure it follows best practices, you can pinpoint areas that need improvement and make sure your content is engaging, accessible, and optimized for both visitors and search engines like Google.

By conducting regular content audits using Kanopi’s content scorecard, you can maintain high-quality content standards and ensure that all the content on your website tells your unique story.

If you need help with your next content audit, don’t hesitate to get in touch with Kanopi. We’re more than happy to help you get started.

Contact us to help you run a content audit (or download our content scorecard template for yourself).