One-Dimensional Website Optimization Considered Harmful
Post from August 4, 2022, filed under Web Development.
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. Let’s have a look at why this is.
- Website Optimization Vectors
- One-Dimensional Optimization
- Multi-Dimensional Optimization
- The Benefits of Pareto Optimization
Website Optimization Vectors
There are several vectors to approach website and app optimization. Here are the main ones:
- Usability (and user experience)
- Technical conformance (validation)
- Legal compliance
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:
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:
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.
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:
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 and, if applied consciously, to reap 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, you can’t have “100%” everywhere; you don’t always need “100%,” either—and therefore you 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 the new science of Pareto-optimal websites. Go for it.
I’m Jens Oliver Meiert, and I’m an engineering lead (currently manager for Developer Experience at LivePerson) and author. I’ve worked as a technical lead for Google, I’m close to W3C and WHATWG, and I write and review books for O’Reilly. I love trying things, sometimes including philosophy, art, and adventure. Here on meiert.com I share some of my views and experiences.
If you have questions or suggestions about what I write, please leave a comment (if available) or a message.
Have a look at the most popular posts, possibly including:
Looking for a way to comment? Comments have been disabled, unfortunately.
Perhaps my most comprehensive book: The Web Development Glossary (2020). With explanations and definitions for literally thousands of terms from Web Development and related fields, building on Wikipedia as well as the MDN Web Docs. Available at Apple Books, Kobo, Google Play Books, and Leanpub.