One-Dimensional Website Optimization Considered Harmful

Published on August 4, 2022 (↻ September 9, 2023), filed under (RSS feed for all categories).

Listen to a performance specialist, an accessibility guru, an SEO champion, a UX pundit, an HTML optimizer, and what you’ll learn is all going to be smart and important and useful. Depending on where you and your project stand, listening to these of our field’s experts should benefit you and the project.

Listen to only one of these specialists, however, and sooner or later you’ll optimize your website on only one dimension—and that’s likely not only going to be costly, but also counter-productive.

Contents

  1. Website Optimization Vectors
  2. One-Dimensional Optimization
  3. Multi-Dimensional Optimization
  4. The Benefits of Pareto Optimization

Website Optimization Vectors

There are several vectors to approach website and app optimization. Here are the main ones:

This also roughly reflects the popularity of these optimization vectors—playing with Google Trends, SEO seems to be by far the most common website optimization topic, followed by performance and accessibility. Usability, technical conformance, and legal compliance appear to represent the long tail:

Google Trends comparison of website SEO, performance, accessibility, usability, and legal compliance searches.

Figure: SEO FTW.

One-Dimensional Optimization

One-dimensional optimization means to optimize for one of these vectors. That is, SEO, performance optimization, accessibility optimization, usability optimization, conformance optimization, or legal optimization, driven and supported through experts, news sources, and tools.

So far, so good. Does one-dimensional optimization have problems? Yes—that’s the hypothesis of this article.

What are these problems? High cost and adverse effects on other optimization vectors, both of which are caused by one-dimensional optimization really being optimization specialization:

Cost

In order to understand the cost problem, let’s work with the Pareto (or 80/20) rule. If you don’t know it, it says that “for many outcomes, roughly 80% of consequences come from 20% of causes.” For example, 20% of your customers are responsible for 80% of your revenue, or 20% of your project’s bugs cause 80% of the downtime (or 80% of the time, you wear part of 20% of your clothes).

For optimization, this means that 80% of optimization steps will only make for 20% of the optimization cost. “Full” optimization is extremely pricey, then, with 20% of the optimization requiring 80% of the investment.

This is a simple model. It’s not to argue against doing any costly optimizations—these can be important and intended—, but to raise awareness that not all of it comes at the same price, for the same returns.

Adverse Effects on Other Dimensions

The other problem is that one-dimensional optimization not only neglects but adversely affects other dimensions.

Examples aren’t hard to come by *; let’s take this one, “avoid using background-image in CSS”:

“Much faster loading.”

Figure: Performance over-optimization with adverse effects on HTML quality and code maintainability.

Let’s assume that this is, indeed, improving and optimizing performance.

Is it without consequence, can it be seen in isolation?

It isn’t and it can’t: This kind of optimization moves from CSS to HTML and therefore crosses the formatting/document language barrier, and, as HTML is harder to maintain than CSS, negatively impacts maintainability and quality. (Yes, there are two paradigms, but even in the second paradigm—embracing change through intentionally tight coupling—it’s a risky proposition to say that dropping background images did not impact HTML maintainability and quality. So let’s work with this.)

This point, that one-dimensional optimization has consequences and cannot fully be isolated from other optimization vectors, is crucial â€ . Together with its cost, it brings us to its natural counterpart:

Multi-Dimensional Optimization

First, apart from the problems induced by emphasis of just one quality dimension, we certainly want to accomplish good results in more than one area.

Instead of only having a site rank well in search engines, we also want it to be fast, accessible, usable, conformant, compliant, and in generally good shape. That means, usually there is an inherent motivation to go beyond one-dimensional optimization.

You can see where this is going—the Pareto rule allows to do this. If applied consciously, it even comes with additional benefits:

Pareto Rule Judo

If you think about the Pareto rule again (20% of the work making for 80% of the result), what if those 80% are pretty good, and we still want to do 100% work, just not for one topic alone?

That’s some conceptual “judo” the Pareto rule allows us to do: By its logic, investing 20% in 5 different topics would allow to reap 5× 80% of the results!

I don’t believe just how many percent you put in and get out are so terribly important here, and neither whether you would focus on three, four, five, or six different topics—the idea is that some effort is relatively cheap (but impactful), that we can invest efforts into several topics, and that therefore, we can avoid the conflicts coming from one-sided optimization, and get significantly better results.

The Benefits of Pareto Optimization

You let me know what details and examples would help this post, but when we are looking at Pareto optimization â€ˇ and its benefits, then to a degree, we can have our cake, and eat it, too.

There are several website optimization vectors, and we can relatively inexpensively optimize all these dimensions. (As one-dimensional “100%” optimization hurts the other dimensions, this is not a staffing and funding issue.) We can do so by using the Pareto rule to our advantage, by avoiding the costly 100% and shooting for the relatively inexpensive 80%.

The main point is to be aware of the problems of one-dimensional optimization, and to use that to make conscious use of the fact that knowledge, specialization, quality aren’t linear (1% effort leading to 1% quality), that different levels have different price points. On websites and apps, we can’t have “100%” everywhere; we don’t always need “100%,” either—and therefore we want to use a lower-percentage aim to achieve more, cheaper.

❧ Going back to the beginning, listen to the performance specialist, the accessibility guru, the SEO champion, the UX pundit, the HTML optimizer—and realize that while you can’t have it all, you can benefit from all their knowledge. Be smart about going for 100%, remember that you can improve your investments by aiming for a little less. It can be a lot more.

This post is deliberately 80% perfect.

* I’m calling out HTML shredding in particular as, unsurprisingly, it’s a thing and it comes from everywhere. The latest fad seems to be to add onerror attributes to img elements—something you don’t need to do (instead, you need to manage your media assets) and don’t want to do (instead, you test in your test environment, and you value clean markup).

† Look at any of the dimensions: If all you do is SEO, eventually your HTML and CSS will look like a Christmas tree. When all you do is performance optimization, you end up with one hell of a weird website, one that no one understands. For accessibility, you will need a staff of 50 to review all the code the other 50 wrote using AML (ARIA Markup Language). With usability, your prototypes are still being tested. If there’s only focus on conformance,—I don’t know what you’re trying to say. And if lawyers optimize your site, your consent management platform will end up making for 70% of your overall code base.

‡ I didn’t look at Pareto or multi-objective optimization before but yes, this is it, this is the kind of optimization I’m talking about. I’m putting it a lot easier, though, i.e., this here isn’t yet describing a new science of Pareto-optimal websites. I’d be curious about it, however.

Was this useful or interesting? Share (toot) this post, or maybe treat me to a coffee. Thanks!

About Me

Jens Oliver Meiert, on September 30, 2021.

I’m Jens, and I’m an engineering lead and author. I’ve worked as a technical lead for companies like Google and as an engineering manager for companies like Miro, I’m close to W3C and WHATWG, and I write and review books for O’Reilly and Frontend Dogma.

With my current move to Spain, I’m open to a new remote frontend leadership position. Feel free to review and refer my CV or LinkedIn profile.

I love trying things, not only in web development, but also in other areas like philosophy. Here on meiert.com I share some of my views and experiences.