Complex Websites: 3 Key Areas That Drive Complexity

Complex websites tend to ‘happen’ rather than be created intentionally. That’s because we often don’t realize when complexity has crept into our ‘simple’ website project.

We tend to think complexity is only an issue for large enterprise systems. If our project is something simpler, like a website, we don’t pay attention to it.

Yet, many website projects go over time and budget—and often, it’s due to unexpected complexity.

This article will help you understand why this happens and what you can do to prevent it. At the end, you’ll find a list of questions to discuss complexity concerns with your vendor.

Impact of Complexity on Project Timeline and Budget

The definition of complexity states that something consists of parts that interact with each other, resulting in an effect greater than the sum of its parts.

Let’s assume we want to build a headless WordPress website. We have these parts with their complexity rated as follows:

• WordPress CMS – 5
• Headless Website Principles – 8

However, when we put those two parts together, the resulting complexity is not 13 (5+8) but, for instance, 16.

Why is this so? For example, some plugins that work in standard WordPress don’t function well in a headless setup. As a result, the complexity of the WordPress CMS itself has now increased to 8.

Linear vs. Geometric Increases in Development Time for Complex Websites

Typically, we estimate projects in a somewhat linear fashion. As we add more components, we add their development time to the overall project timeline. 

But if the interaction of these components creates complexity in our system, our estimation can fall apart. That’s because an increase in complexity can lead to a geometric increase in delivery time rather than a linear one.

Let’s say the complexity of the website increases from 4 to 8. We may expect the delivery time to double from 20 hours to 40 hours. With a geometric increase, it can rise almost five times to 100 hours, as shown in the following image.

In reality, it’s difficult to estimate the effect of complexity on our projects. There are two main reasons:

• We don’t know how much the interaction of certain elements will increase complexity.
• We do not realize that we’re adding complexity to our website.

Types of Complexity

Of course, in software development, there are efforts to define and manage complexity. For example, a vFunction article outlines the following types of complexity:

• Essential complexity – is inherent to the problem the software is trying to solve. It cannot be avoided, only managed.
• Accidental complexity – originates from the technology and development tool choices.
• Cognitive complexity – refers to the mental effort required to manage and maintain the code.
• Structural complexity – relates to how components interact with each other.
• Temporal complexity – arises from how components interact over time.

While useful, most of these types relate to software code. Is there anything we can do before development begins?

Key Elements of Complex Websites

Let’s look at the three most common sources of complexity in website development projects:

1. Functionality
2. Design
3. Technology

During the planning phase, we can limit the risk of future complexity in each of these areas.

1) Website Functionality

Website functionality depends on the type of website. We can feel a clear distinction between the complexity of a brochure-like company website and an e-commerce site. But even within the same type, there can be a significant difference between a basic website and a complicated website.

Each functionality we add to our website can increase its complexity. As we know, this is an essential complexity that cannot be avoided once it’s defined in the project scope.

To manage functional complexity, we need to identify what is essential for our business goals.  Here are a few methods we can use:

• Customer Journey Mapping – a visual representation of the customer’s experience. It helps us understand which features are crucial at each stage for achieving user goals.
• KANO model – categorizes features into basic needs, performance needs, and delighters.
• Jobs to be Done – a framework that focuses on the tasks users want to do, helping to align features with user needs.
• Impact vs. Effort Matrix – prioritizes features based on their potential impact and the effort required. Our focus is then on high-impact, low-effort features.
• Project Scoping – defines the list of features that align with our core objectives. It helps prevent the project scope from expanding in an uncontrolled manner (known as scope creep).

Questions for Addressing Website Functionality Complexities

Ask the following questions when discussing the functionality of your project.

1. What feature identification and prioritization methods does your vendor have experience with?
2. How has your vendor handled feature prioritization in past projects?
3. How will they handle feature requests that are outside the initial scope?
4. What frameworks or tools will your vendor use for feature prioritization and tracking? How do they prevent scope creep?
5. What cooperation model is best suited for achieving your goals? Fixed price, time & material, or a retainer-based model?

2) Website Design

Website design, user interface, and interactions can be significant sources of complexity. We can divide websites into creative websites and utility websites.

A creative website is one where the design aims to showcase creative capabilities. It provides an aesthetic experience, sometimes even at the expense of straightforward usability.

The main purpose of the design of a utility website is to help users accomplish their tasks. Here, the UI supports the user, and any unnecessary interactions interfere with a positive user experience.

These two types sometimes blend together. Then you need to consider whether the added creativity supports your goals enough to justify the extra complexity.

For example, as a design agency, we wanted our website to show our design capabilities. One of the interactions we added was smooth scrolling.

Smooth scroll is used to “improve” the user experience of the default browser scroll. It’s an incredibly complex feature that can interact with components on individual pages in unexpected ways.

That’s not all, though. Since our implementation didn’t work well, we decided to remove it after a few months. Here comes another layer of complexity: not only is adding it complex, but removing it as well. You need to test every component that was previously adjusted to work with it.

Here are some other examples of design features that increase the complexity of a website.

• Movements – any type of animation or transition, especially if it is not isolated to a single component. Synchronized movements across multiple elements, like slide-in and slide-out animations of page sections.
• White and dark themes – requires creating and maintaining two sets of styles. It may limit the ability to reuse elements on different page types.
• Scroll hijacking – changing the speed or direction of the default browser scroll to reveal content. It’s considered a usability nightmare.
• Transition between pages – transitioning between pages in a way that mimics web applications, without a full page reload.

Questions for Addressing Website Design Complexities

Ask these questions when discussing your website’s design direction with your designer.

1. What type of website are you planning to build—creative, utility, or a mix of both?
2. How does creativity support your website goals?
3. Have you considered the consequences of building a complex website? How difficult will it be to change those creative elements on the website?
4. Does your vendor have enough experience developing creative websites if you want it to be on the creative side?
5. Does your vendor have experience with building design systems? Can they create a consistent design system if the website has too many “non-standard” elements?

3) Website Technology

As we mentioned, most types of complexities relate to technology. It’s no surprise, then, that technology has the biggest potential impact on project complexity.

This is further complicated by the fact that website development has evolved significantly over the past decade. 

It has shifted from traditional, multipage server-rendered websites to single-page applications and progressive web apps, only to return to multipage and hybrid models in recent years. Not to mention the rise of headless CMS and decoupled architectures.

When the development paradigm changes every few years, the industry hardly has time to settle on best practices. It must address new issues that arise with each new technology.

To be fair, it’s not solely the responsibility of developers creating new frameworks every month. The market demands faster, native-like, interactive applications.

What you can do in this situation is avoid jumping on the trend wagon. Work with your provider to justify the technology stack choice. 

Questions for Addressing Website Technology Complexities

Consider these questions about website technology:

1. Why is the chosen technology the best choice for achieving your goals?
2. What experience does your vendor have with the suggested technology stack? Is it a proven configuration or a bespoke solution?
3. Have they experienced a project going over timeline or budget due to an unexpected increase in complexity?
4. If you feel your website should be headless, what arguments support this choice?
5. How will integrations impact project execution?
6. How will potential data migration or consolidation increase the project’s complexity?
7. What will follow-up maintenance and the development of new features look like?

Conclusion

In this article, we described how complexity can affect website development projects. Websites might appear simpler because they revolve around proven patterns. Yet, like any other software projects, they are not immune to complexity and the challenges it brings.

The biggest challenge with complexity is that it often sneaks into our website unnoticed. It’s difficult to predict how new elements will interact with existing ones. It’s hard to estimate how much effort website improvements will require as it becomes more complex.

To mitigate these risks in your project, we have prepared a checklist with the questions from this article. You can send it to your provider to open a discussion on this topic. Not all questions may apply to your website, but an experienced vendor should be able to address your main concerns.

Complexity Checklist

Use this checklist with your vendor to address complexity risks in your website project.

Does your vendor lack the experience to handle complexity in website projects? Or do you feel they aren’t taking your concerns seriously? Contact us to discuss your website project.