Design Debt In Webflow
Tags: designdebt, techdebt, webflowdesign, webflow
Published: 2021-01-08 17:02:44

---
title: Design Debt In Webflow
published: true
date: 2021-01-08 12:56:50 UTC
tags: designdebt,techdebt,webflowdesign,webflow
canonical_url: https://www.matechs.com/blog/design-debt-in-webflow
---

_Defining design debt and how it affects Webflow projects._

![](https://cdn-images-1.medium.com/max/1024/1*oaYiaojtTyP0-xYyt443-A.png)

What is _design debt_? The correct term would be _technical debt_. We’re all familiar with the concept of debt in the financial context. You receive an amount of money today to be paid back with interest at a specific rate and date in the future. Although that’s an **oversimplified** explanation, it is also the essence of technical debt.

> [_Technical debt is a concept in programming that reflects the extra development work that arises when code that is easy to implement in the short run is used instead of applying the best overall solution. — _ **_Technical debt may also be known as design debt_** _._](https://www.techopedia.com/definition/27913/technical-debt)

‍This article will focus on the impact of technical debt on Webflow websites. The terms technical (tech) debt and design debt are interchangeable.

Whatever the problems you’re trying to solve, the most suitable solutions come after thorough analysis and research. Technical debt arises when you skip or ignore the results of the research work and go for a shortcut instead.

Underestimating the effects of _shortcut_ solutions comes at a cost. In the long run, you will have to _fix_ the negative impact of these decisions on design and business operations. The _fix_ will require additional work and resources that represent the interest you pay when you incur technical debt.

In the case of collaborative projects, tech debt creates barriers within your team or with your client. Although at present, Webflow Designer Canvas allows only one user at a time, [the community has frequently requested more collaboration features](https://wishlist.webflow.com/ideas/WEBFLOW-I-39). This would certainly accelerate projects and facilitate teamwork. On the other hand, it would require substantial project management work and an accurate design process in place to allow multiple designers to collaborate successfully in the same project.

### How Do You Create And Accumulate Design Debt In Webflow?

#### **No content structure**

The main reason for tech debt is starting a project without planning the content structure first. As the saying goes, _content is king_. UX decisions are based on content specifics. The layout of a website depends on its content, not the other way around. That’s why using templates is rarely the best option for your project, as ready-made solutions are not created based on your specific needs and requirements.

#### **Incorrect use of classes**

Creating Div Block 99999 definitely makes for a fun tweet. However, that’s an indicator that the design process is not organized. The project has no clear structure. If classes are not used in a proper way, projects get unnecessarily complicated.

#### **No design testing**

Not testing the site’s performance and its responsiveness means that you’re not in control of your design and the project as a whole. Most importantly, websites need to comply with web accessibility standards. Designing an accessible website provides a better user experience and [improves performance on search engines](https://webflow.com/blog/seo-technical-checklist-for-webflow-projects).

### Bad Debt Vs. Tolerable Debt

If you’re using Webflow to build a quick prototype or a proof of concept, design debt could be acceptable _to some extent_. This is valid only if you have planned the time and resources to redesign the project properly.

When designing a project from scratch, tech debt has a critical role in its success — or failure. If you’re working on a website project that will go live, any form of tech debt is bad debt. That’s why it’s so important to have a clear design process from the start.